@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@500;600;700&family=Manrope:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root {
  --bg: #020203;
  --fg: #f3f0e8;
  --muted: rgba(243, 240, 232, .62);
  --dim: rgba(243, 240, 232, .34);
  --line: rgba(243, 240, 232, .14);
  --red: #6f1714;
  --header-h: 72px;
  --mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --sword-progress: 0;
  --sword-detail-progress: 0;
  --context-progress: 0;
  --sword-glow-x: 52%;
  --sword-x-offset: 0vw;
}


* { box-sizing: border-box; }
html {
  background: var(--bg);
  scroll-behavior: auto;
  scroll-snap-type: y proximity;
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: "Manrope", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }

.noise {
  pointer-events: none;
  position: fixed;
  inset: 0;
  z-index: 60;
  opacity: .045;
  mix-blend-mode: overlay;
  background-image: url("assets/_shared/noise-sharp.png");
  background-repeat: repeat;
  background-size: 128px 128px;
  image-rendering: pixelated;
}

.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 50;
  height: var(--header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 clamp(18px, 4vw, 56px);
  background: linear-gradient(to bottom, rgba(2,2,3,.74), rgba(2,2,3,0));
}
.brand,
.nav,
.eyebrow,
.home-case-topline,
.cover-meta,
.frame-index,
.scroll-note,
.sword-readout {
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  text-transform: uppercase;
  letter-spacing: .13em;
}
.brand {
  font-size: 11px;
  font-weight: 500;
}
.nav {
  display: flex;
  gap: clamp(18px, 3vw, 34px);
  color: var(--muted);
  font-size: 10px;
}
.nav a:hover { color: var(--fg); }

.eyebrow {
  margin: 0 0 14px;
  color: var(--dim);
  font-size: 10px;
  font-weight: 500;
}
h1, h2, h3 {
  margin: 0;
  font-weight: 600;
  letter-spacing: -.052em;
  line-height: .9;
}
h1 { font-size: clamp(48px, 7.5vw, 126px); }
h2 { font-size: clamp(46px, 7vw, 118px); }
h3 { font-size: clamp(36px, 5.4vw, 92px); }
p { line-height: 1.55; }

.snap-panel { scroll-snap-align: start; scroll-snap-stop: normal; }

/* HOME */
.home-hero {
  min-height: 0;
  background: var(--bg);
}
.home-case {
  position: relative;
  display: block;
  width: 100vw;
  height: auto;
  min-height: 0;
  overflow: hidden;
  isolation: isolate;
  background: #020203;
}
.home-case::before {
  content: "";
  position: absolute;
  z-index: 2;
  right: 0;
  top: 0;
  width: 48%;
  height: 100%;
  pointer-events: none;
  opacity: .0;
  background: radial-gradient(circle at 58% 45%, rgba(245,246,238,.12), transparent 26rem);
  transition: opacity .7s cubic-bezier(.2,.8,.2,1);
}
.home-case-art {
  width: 100vw;
  max-width: none;
  height: auto;
  object-fit: contain;
  object-position: center top;
  filter: none;
  transition: filter .85s cubic-bezier(.2,.8,.2,1), transform 1.05s cubic-bezier(.2,.8,.2,1);
}
.home-case-art-base {
  position: relative;
  z-index: 1;
  opacity: 1;
  transform: scale(1);
  transition: opacity .75s cubic-bezier(.2,.8,.2,1), transform 1.05s cubic-bezier(.2,.8,.2,1), filter .75s cubic-bezier(.2,.8,.2,1);
}

.home-case-art-hover {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  opacity: 0;
  object-fit: cover;
  object-position: center top;
  transform: scale(1.004);
  filter: brightness(.94) contrast(1.04);
  transition: opacity .46s cubic-bezier(.2,.8,.2,1), transform .72s cubic-bezier(.2,.8,.2,1), filter .72s cubic-bezier(.2,.8,.2,1);
}
.home-case:hover .home-case-art-hover {
  opacity: 1;
  transform: scale(1);
  filter: brightness(1) contrast(1);
}
.home-case-content {
  position: absolute;
  z-index: 4;
  right: clamp(42px, 9vw, 160px);
  top: 40%;
  width: min(500px, 34vw);
  transform: translate3d(0, 0, 0);
  transition: transform .8s cubic-bezier(.2,.8,.2,1), filter .8s cubic-bezier(.2,.8,.2,1);
}
.home-case-logo {
  position: relative;
  z-index: 3;
  width: min(31vw, 500px);
  max-width: 100%;
  height: auto;
  opacity: .94;
  pointer-events: none;
  filter: drop-shadow(0 22px 36px rgba(0,0,0,.56));
  transition: opacity .6s cubic-bezier(.2,.8,.2,1), transform .8s cubic-bezier(.2,.8,.2,1), filter .8s cubic-bezier(.2,.8,.2,1);
}
.case-gradient {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: transparent;
}
.home-case-topline {
  position: absolute;
  z-index: 3;
  left: clamp(64px, 7vw, 132px);
  right: clamp(24px, 4vw, 72px);
  top: clamp(70px, 7.2vw, 118px);
  display: grid;
  grid-template-columns: 70px 1fr auto;
  gap: 24px;
  color: rgba(243,240,232,.45);
  font-size: 10px;
  pointer-events: none;
}
.home-case-topline span:nth-child(2)::before {
  content: "";
  display: inline-block;
  width: min(38vw, 460px);
  height: 1px;
  margin-right: 18px;
  vertical-align: middle;
  background: rgba(243,240,232,.18);
}
.home-case-copy {
  position: relative;
  z-index: 3;
  width: min(430px, 100%);
  margin-top: clamp(18px, 3.6vh, 46px);
}
.home-case-copy p:not(.eyebrow) {
  max-width: 420px;
  margin: 0;
  color: rgba(243,240,232,.74);
  font-size: clamp(12px, .92vw, 15px);
  text-shadow: 0 12px 32px rgba(0,0,0,.74);
}
.home-case-copy .eyebrow {
  color: rgba(243,240,232,.60);
  text-shadow: 0 10px 28px rgba(0,0,0,.72);
}
.home-case:hover::before { opacity: 1; }
.home-case:hover .home-case-art-base {
  opacity: .12;
  transform: scale(1.006);
}
.home-case:hover .home-case-content {
  transform: translate3d(-.55vw, -1.2vh, 0);
  filter: drop-shadow(0 28px 50px rgba(0,0,0,.52));
}
.home-case:hover .home-case-logo {
  opacity: 1;
  transform: translate3d(0, -.6vh, 0) scale(1.012);
  filter: drop-shadow(0 26px 42px rgba(0,0,0,.66));
}

.work-index {
  padding: 12vh clamp(14px, 2.5vw, 36px) 12vh;
  background: linear-gradient(180deg, #020203, #050506 52%, #020203);
}
.section-title {
  width: min(1300px, 94vw);
  margin: 0 auto 10vh;
}
.section-title h2 { max-width: 1050px; }
.work-list {
  display: grid;
  gap: clamp(20px, 3vw, 52px);
}
.work-item {
  position: relative;
  min-height: min(760px, 78vh);
  overflow: hidden;
  background: #040405;
  isolation: isolate;
}
.work-item::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(90deg, rgba(2,2,3,.86), rgba(2,2,3,.20) 60%, rgba(2,2,3,.62)),
    linear-gradient(0deg, rgba(2,2,3,.88), rgba(2,2,3,.1) 60%);
}
.work-item img {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  object-fit: cover;
  opacity: .82;
}
.work-item.muted img {
  object-fit: contain;
  padding: 6vh 0;
  opacity: .62;
  filter: brightness(.8);
}
.work-item-copy {
  position: absolute;
  z-index: 3;
  left: clamp(24px, 4vw, 72px);
  bottom: clamp(28px, 6vh, 72px);
}
.work-item-copy span {
  display: block;
  margin-bottom: 22px;
  color: var(--red);
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .14em;
  font-size: 11px;
}
.work-item-copy p {
  margin: 20px 0 0;
  color: rgba(243,240,232,.62);
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: 11px;
}

/* PROJECT */
.project-header { background: linear-gradient(to bottom, rgba(0,0,0,.64), rgba(0,0,0,0)); }
.panel {
  min-height: 100vh;
  min-height: 100svh;
  position: relative;
  background: #000;
  overflow: hidden;
}

.context-panel {
  position: relative;
  min-height: 0;
  height: auto;
  display: block;
  background: #050605;
  overflow: hidden;
  isolation: isolate;
}
.context-art {
  position: relative;
  z-index: 1;
  width: 100vw;
  max-width: none;
  height: auto;
  object-fit: contain;
  object-position: center top;
  filter: none;
  transform: none;
  will-change: auto;
}
.context-shade {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: transparent;
}
.context-copy {
  position: absolute;
  z-index: 4;
  right: clamp(42px, 9vw, 160px);
  top: 46%;
  width: min(470px, 33vw);
  padding: 0;
  color: rgba(248,248,244,.92);
  transform: translateY(-50%);
  filter: drop-shadow(0 20px 38px rgba(0,0,0,.62));
  text-shadow: 0 14px 34px rgba(0,0,0,.72);
}

.context-logo-title {
  width: min(360px, 100%);
  margin: 0 0 clamp(18px, 3.2vh, 38px);
  opacity: .96;
  filter: drop-shadow(0 22px 42px rgba(0,0,0,.68));
  transform: translate3d(0, calc(var(--context-progress) * -1.5vh), 0);
  will-change: transform;
}

.context-copy .eyebrow {
  color: rgba(248,248,244,.52);
}
.context-copy p:not(.eyebrow) {
  width: min(440px, 100%);
  margin: 0;
  color: rgba(248,248,244,.72);
  font-size: clamp(13px, .9vw, 15px);
}
.scroll-note {
  position: absolute;
  z-index: 4;
  right: clamp(18px, 3vw, 46px);
  bottom: clamp(18px, 3vw, 40px);
  color: rgba(243,240,232,.34);
  font-size: 9px;
}

.sword-reveal {
  position: relative;
  height: 172vh;
  background: #000;
  scroll-snap-align: none;
  scroll-snap-stop: normal;
}
.sword-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  isolation: isolate;
  display: grid;
  place-items: center;
  background: #000;
}
.sword-atmosphere {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at 52% calc(18% + var(--sword-progress) * 56%), rgba(208,215,202,.12), transparent 25rem),
    radial-gradient(circle at 80% 50%, rgba(196,205,190,.08), transparent 18rem),
    radial-gradient(circle at 82% 78%, rgba(111,23,20,.08), transparent 32rem),
    linear-gradient(90deg, rgba(255,255,255,.018), transparent 25%, transparent 76%, rgba(255,255,255,.04)),
    linear-gradient(180deg, #000, #050606 43%, #000);
  opacity: .94;
}
.sword-grid {
  position: absolute;
  inset: 0;
  z-index: 2;
  opacity: .13;
  background:
    linear-gradient(rgba(243,240,232,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(243,240,232,.03) 1px, transparent 1px);
  background-size: 100% 22vh, 14vw 100%;
  mask-image: radial-gradient(circle at 62% 50%, black, transparent 67%);
}
.sword-rotator-stage {
  position: absolute;
  z-index: 4;
  right: clamp(42px, 5.4vw, 104px);
  top: 50%;
  width: min(29vw, 470px);
  height: min(82vh, 820px);
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  pointer-events: none;
  opacity: calc(.68 + var(--sword-progress) * .20);
  filter: drop-shadow(0 34px 76px rgba(0,0,0,.96));
}
.sword-rotator-stage::before,
.sword-rotator-stage::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(243,240,232,.08);
  border-radius: 4px;
  opacity: calc(.10 + var(--sword-progress) * .14);
}
.sword-rotator-stage::before {
  width: min(44vw, 560px);
  height: min(44vw, 560px);
}
.sword-rotator-stage::after {
  width: min(26vw, 330px);
  height: min(26vw, 330px);
}
.sword-rotator-canvas {
  position: relative;
  z-index: 2;
  width: auto;
  height: min(77vh, 770px);
  max-width: none;
  aspect-ratio: 360 / 760;
  object-fit: contain;
  pointer-events: none;
  background: transparent;
  filter: brightness(1.08) contrast(1.09);
  transform: translate3d(0, calc(var(--sword-progress) * -1.2vh), 0) scale(1.01);
  will-change: transform;
}
.sword-detail-stage {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: min(46vw, 780px);
  height: 100%;
  overflow: hidden;
  pointer-events: none;
  opacity: .88;
  mask-image: linear-gradient(90deg, transparent 0%, black 2.5%, black 97.5%, transparent 100%);
}
.sword-detail-stage::before,
.sword-detail-stage::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}
.sword-detail-stage::before {
  background:
    radial-gradient(circle at 50% calc(18% + var(--sword-detail-progress) * 74%), rgba(236,241,224,.12), transparent 18rem),
    linear-gradient(90deg, rgba(0,0,0,.20), transparent 16%, transparent 84%, rgba(0,0,0,.18));
}
.sword-detail-stage::after {
  background: linear-gradient(180deg, rgba(0,0,0,.74), transparent 18%, transparent 78%, rgba(0,0,0,.88));
}
.sword-detail {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 50%;
  height: 214vh;
  width: auto;
  max-width: none;
  object-fit: contain;
  transform: translate3d(-50%, calc(24vh - var(--sword-detail-progress) * 148vh), 0);
  filter: drop-shadow(0 46px 92px rgba(0,0,0,.96)) brightness(1.02) contrast(1.04);
  will-change: transform;
}
.sword-description {
  position: absolute;
  z-index: 5;
  top: 50%;
  left: clamp(64px, 7vw, 132px);
  right: auto;
  width: min(345px, 28vw);
  transform: translateY(-50%);
  opacity: calc(.58 + var(--sword-progress) * .28);
}
.sword-description h2 {
  font-size: clamp(30px, 4vw, 58px);
  letter-spacing: -.04em;
}
.sword-description p:not(.eyebrow) {
  margin: 22px 0 0;
  color: rgba(243,240,232,.58);
  font-size: clamp(12px, .85vw, 14px);
}
.sword-readout {
  position: absolute;
  z-index: 5;
  right: clamp(18px, 3vw, 46px);
  left: auto;
  bottom: clamp(18px, 3vw, 40px);
  display: flex;
  gap: 20px;
  color: rgba(243,240,232,.28);
  font-size: 9px;
}

.frames { background: #000; }
.story-panel {
  display: grid;
  place-items: center;
  background: #000;
}
.story-panel img {
  width: 100vw;
  height: 100vh;
  height: 100svh;
  object-fit: contain;
  background: #000;
  transform: scale(1.001);
}
.story-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 50%, transparent 48%, rgba(0,0,0,.11) 100%),
    linear-gradient(180deg, rgba(0,0,0,.14), transparent 22%, transparent 78%, rgba(0,0,0,.2));
}
.frame-index {
  position: absolute;
  z-index: 4;
  left: clamp(18px, 3vw, 46px);
  bottom: clamp(18px, 3vw, 40px);
  color: rgba(243,240,232,.24);
  font-size: 9px;
}
.end-panel {
  display: grid;
  place-items: center;
  padding: clamp(20px, 5vw, 72px);
  background:
    radial-gradient(circle at 50% 30%, rgba(243,240,232,.07), transparent 35rem),
    #020203;
}
.end-panel div { width: min(800px, 90vw); }
.end-panel p:not(.eyebrow) { color: var(--muted); max-width: 540px; }
code {
  color: var(--fg);
  background: rgba(255,255,255,.08);
  padding: .1em .36em;
  border-radius: 4px;
}
.redirect-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
}

@media (max-width: 1020px) {
  :root { --sword-glow-x: 66%; --sword-x-offset: 14vw; }
  .context-copy {
    right: 24px;
    top: auto;
    bottom: clamp(26px, 6vh, 72px);
    width: min(460px, calc(100vw - 48px));
    transform: none;
  }
  .context-copy .eyebrow { color: rgba(243,240,232,.52); }
  .context-copy p:not(.eyebrow) { color: rgba(243,240,232,.72); }
}

@media (max-width: 820px) {
  :root { --header-h: 62px; }
  html { scroll-snap-type: y proximity; }
  .nav { display: none; }
  .brand { font-size: 10px; }
  .home-case { min-height: 0; }
  .home-case-art { object-fit: contain; object-position: center top; }
  .home-case-content { right: 20px; top: 42%; width: min(70vw, 340px); }
  .home-case-logo { width: min(62vw, 320px); max-width: 100%; }
  .home-case-topline {
    left: 20px;
    right: 20px;
    top: 78px;
    grid-template-columns: 1fr auto;
  }
  .home-case-topline span:nth-child(2) { display: none; }
  .home-case-copy { width: auto; margin-top: 18px; }
  .work-index { padding: 14vh 12px 8vh; }
  .work-item { min-height: 68vh; }
  .sword-readout { display: none; }
}


@media (max-width: 1020px) {
  .sword-reveal { height: 166vh; }
  .sword-description {
    top: auto;
    left: 20px;
    bottom: 10vh;
    width: min(350px, calc(100vw - 40px));
    transform: none;
  }
  .sword-rotator-stage {
    right: 3vw;
    width: min(37vw, 390px);
    height: min(67vh, 660px);
    opacity: calc(.55 + var(--sword-progress) * .18);
  }
  .sword-rotator-canvas { height: min(66vh, 660px); }
  .sword-detail-stage {
    left: 50%;
    width: 46vw;
    opacity: .64;
  }
  .sword-detail { height: 194vh; transform: translate3d(-50%, calc(22vh - var(--sword-detail-progress) * 124vh), 0); }
}

@media (max-width: 820px) {
  .sword-reveal { height: 150vh; }
  .sword-detail-stage { opacity: .34; width: 58vw; }
  .sword-rotator-stage { right: -8vw; opacity: .48; }
  .sword-rotator-canvas { height: min(52vh, 540px); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; scroll-snap-type: none; }
  .home-case-art { transition: none; }
  .context-art, .context-copy, .context-logo { transform: none; }
  .sword-detail, .sword-rotator-canvas { transform: none; }
}

/* v21 — direct project entry, no page fade */
.home-case {
  cursor: pointer;
  transform-origin: center center;
  transition: transform .42s cubic-bezier(.2,.8,.2,1), filter .42s cubic-bezier(.2,.8,.2,1);
}
.home-case-action {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-top: clamp(18px, 2.6vh, 34px);
  color: rgba(243,240,232,.72);
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: 10px;
  text-shadow: 0 10px 28px rgba(0,0,0,.72);
  transition: color .55s cubic-bezier(.2,.8,.2,1), transform .55s cubic-bezier(.2,.8,.2,1);
}
.home-case-action::after {
  content: "";
  width: 46px;
  height: 1px;
  background: rgba(243,240,232,.42);
  transform-origin: left center;
  transition: width .55s cubic-bezier(.2,.8,.2,1), background .55s cubic-bezier(.2,.8,.2,1);
}
.home-case:hover .home-case-action {
  color: rgba(243,240,232,.96);
  transform: translate3d(0, -2px, 0);
}
.home-case:hover .home-case-action::after {
  width: 74px;
  background: rgba(243,240,232,.72);
}

.project-header {
  background: linear-gradient(to bottom, rgba(0,0,0,.78), rgba(0,0,0,0));
}
.project-header .brand {
  color: rgba(243,240,232,.64);
  transition: color .35s ease, transform .35s ease;
}
.project-header .brand:hover {
  color: rgba(243,240,232,.95);
  transform: translateX(-3px);
}
.project-path {
  color: rgba(243,240,232,.38);
  pointer-events: none;
}
/* Project opens directly: no fade/entry overlay after clicking from the home page. */

@media (max-width: 820px) {
  .home-case-action { margin-top: 14px; }
  .project-path { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .home-case,
  .home-case-action,
  .penance-page .context-art,
  .penance-page .context-copy,
  .penance-page .context-logo-title {
    animation: none !important;
    transition: none !important;
  }
}


/* v22 — colour home image, hover reveal, quick shadow click transition */
.page-transition {
  position: fixed;
  inset: 0;
  z-index: 120;
  background:
    radial-gradient(circle at 64% 42%, rgba(0,0,0,.22), rgba(0,0,0,.88) 62%, #000 100%);
  opacity: 0;
  pointer-events: none;
  transition: opacity .23s cubic-bezier(.2,.8,.2,1);
}
body.is-leaving .page-transition { opacity: .86; }
.home-case.is-opening {
  transform: scale(1.004);
  filter: brightness(.78) contrast(1.05);
}

/* v23 — non-sticky black breathing room above the first visual cards */
.home-page .home-hero,
.penance-page .context-panel {
  padding-top: var(--header-h);
  background: #000;
}

.home-page .home-case,
.penance-page .context-panel {
  overflow: hidden;
}

@media (max-width: 820px) {
  .home-page .home-hero,
  .penance-page .context-panel {
    padding-top: var(--header-h);
  }
}


/* v24 — home test: swapped hover/default artwork and moved metadata line higher */
.home-case-topline {
  top: clamp(16px, 2vw, 34px);
}

@media (max-width: 820px) {
  .home-case-topline {
    top: clamp(12px, 2.2vw, 22px);
  }
}


/* v25 — project intro placement + corrected storyboard order */
.penance-page .context-copy {
  top: 53%;
}

.penance-page .context-logo-title {
  width: min(440px, 100%);
  margin-bottom: clamp(20px, 3.8vh, 46px);
}

@media (max-width: 1020px) {
  .penance-page .context-copy {
    top: auto;
  }
  .penance-page .context-logo-title {
    width: min(380px, 92vw);
  }
}


/* v26 — controlled home hover zone + subtler project entry + living intro image */
.home-case:hover::before { opacity: 0; }
.home-case:hover .home-case-art-hover { opacity: 0; }
.home-case:hover .home-case-art-base { opacity: 1; transform: scale(1); }
.home-case:hover .home-case-content { transform: translate3d(0, 0, 0); filter: none; }
.home-case:hover .home-case-logo { opacity: .94; transform: none; filter: drop-shadow(0 22px 36px rgba(0,0,0,.56)); }
.home-case:hover .home-case-action { color: rgba(243,240,232,.72); transform: none; }
.home-case:hover .home-case-action::after { width: 46px; background: rgba(243,240,232,.42); }

.home-case.is-logo-hover::before { opacity: 1; }
.home-case.is-logo-hover .home-case-art-hover {
  opacity: 1;
  transform: scale(1);
  filter: brightness(1) contrast(1);
}
.home-case.is-logo-hover .home-case-art-base {
  opacity: .12;
  transform: scale(1.006);
}
.home-case.is-logo-hover .home-case-content {
  transform: translate3d(-.55vw, -1.2vh, 0);
  filter: drop-shadow(0 28px 50px rgba(0,0,0,.52));
}
.home-case.is-logo-hover .home-case-logo {
  opacity: 1;
  transform: translate3d(0, -.6vh, 0) scale(1.012);
  filter: drop-shadow(0 26px 42px rgba(0,0,0,.66));
}
.home-case.is-logo-hover .home-case-action {
  color: rgba(243,240,232,.96);
  transform: translate3d(0, -2px, 0);
}
.home-case.is-logo-hover .home-case-action::after {
  width: 74px;
  background: rgba(243,240,232,.72);
}

.home-case-hover-zone {
  position: absolute;
  z-index: 6;
  right: clamp(18px, 6vw, 130px);
  top: 26%;
  width: min(48vw, 740px);
  height: 46%;
  border-radius: 4px;
  pointer-events: none;
}

body.is-leaving .page-transition { opacity: .72; }
.home-case.is-opening { transform: scale(1.002); filter: brightness(.84) contrast(1.03); }

.penance-page .context-art {
  transform-origin: center top;
  transform: translate3d(0, calc(var(--context-progress) * -1.1vh), 0) scale(calc(1 + var(--context-progress) * .012));
  will-change: transform;
}

@media (max-width: 820px) {
  .home-case-hover-zone {
    right: 0;
    top: 30%;
    width: 82vw;
    height: 48%;
  }
}


/* v27 — fix storyboard order, visible entry shade, and actual project-intro zoom */
.page-transition {
  background:
    radial-gradient(circle at 64% 42%, rgba(0,0,0,.18), rgba(0,0,0,.90) 58%, #000 100%);
  transition: opacity .32s cubic-bezier(.2,.8,.2,1);
}
body.is-leaving .page-transition { opacity: .92; }
.home-case.is-opening { transform: scale(1.002); filter: brightness(.72) contrast(1.04); }

.project-entry-shade {
  position: fixed;
  inset: 0;
  z-index: 118;
  pointer-events: none;
  background: #000;
  animation: projectShadeOut .48s cubic-bezier(.2,.8,.2,1) forwards;
}
@keyframes projectShadeOut {
  0% { opacity: .78; }
  100% { opacity: 0; }
}

.penance-page .context-panel {
  overflow: hidden;
}
.penance-page .context-art {
  transform-origin: center top;
  transform: translate3d(0, calc(var(--context-progress) * -0.8vh), 0) scale(calc(1.025 + var(--context-progress) * .01));
  will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
  .project-entry-shade { animation: none; opacity: 0; }
  .penance-page .context-art { transform: scale(1.025); }
}


/* v28 — intuitive home hover zone + remove scroll-snap stalls in storyboard */
html {
  scroll-snap-type: none;
}

.snap-panel {
  scroll-snap-align: none;
  scroll-snap-stop: normal;
}

.story-panel {
  min-height: 100vh;
  min-height: 100svh;
}

.home-case-hover-zone {
  right: 0;
  top: 0;
  width: 52%;
  height: 100%;
  border-radius: 0;
}

.home-case.is-logo-hover::before {
  opacity: .72;
}

.home-case.is-logo-hover .home-case-art-hover {
  opacity: 1;
}

.home-case.is-logo-hover .home-case-art-base {
  opacity: .10;
}

@media (max-width: 820px) {
  html { scroll-snap-type: none; }
  .home-case-hover-zone {
    right: 0;
    top: 0;
    width: 64%;
    height: 100%;
  }
}

/* v29 — restore scoped storyboard snap + first frame shadow reveal */
:root {
  --first-frame-shadow: 0;
}

/* Bring back the subtle full-screen catch only for storyboard frames.
   The sticky sword section stays out of snap points, so scroll does not stall there. */
@media (min-width: 821px) {
  html {
    scroll-snap-type: y proximity;
    scroll-padding-top: 0px;
  }

  .context-panel,
  .sword-reveal,
  .home-hero,
  .work-index {
    scroll-snap-align: none;
    scroll-snap-stop: normal;
  }

  .story-panel.snap-panel,
  .end-panel.snap-panel {
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }
}

.story-panel.is-opening-frame::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background:
    radial-gradient(circle at 44% 43%, rgba(0,0,0,.18), rgba(0,0,0,.72) 68%, rgba(0,0,0,.92) 100%),
    linear-gradient(180deg, rgba(0,0,0,.78), rgba(0,0,0,.28) 48%, rgba(0,0,0,.68));
  opacity: calc(.86 * (1 - var(--first-frame-shadow)));
  transition: opacity .08s linear;
}

.story-panel.is-opening-frame img {
  filter: brightness(calc(.58 + var(--first-frame-shadow) * .42)) contrast(calc(1.02 + var(--first-frame-shadow) * .03));
  transform: scale(calc(1.006 - var(--first-frame-shadow) * .004));
  transition: filter .08s linear, transform .08s linear;
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  html {
    scroll-snap-type: none;
  }

  .story-panel.is-opening-frame::before {
    opacity: 0;
  }

  .story-panel.is-opening-frame img {
    filter: none;
    transform: scale(1.001);
  }
}


/* v30 — attached split sections under the main Twój K. home card */
.home-duo {
  width: 100vw;
  min-height: 100vh;
  min-height: 100svh;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin: 0;
  padding: 0;
  background: #000;
  overflow: hidden;
}

.home-duo-panel {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  overflow: hidden;
  background: #000;
  isolation: isolate;
}

.home-duo-panel img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
  opacity: .92;
  transform: scale(1.002);
}

.home-duo-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 45%, transparent 38%, rgba(0,0,0,.28) 100%),
    linear-gradient(180deg, rgba(0,0,0,.18), transparent 36%, rgba(0,0,0,.68));
}

.home-duo-copy {
  position: absolute;
  z-index: 3;
  left: clamp(18px, 3vw, 46px);
  bottom: clamp(18px, 3vw, 42px);
  color: rgba(243,240,232,.58);
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: 9px;
}

.home-duo-copy span {
  display: block;
  margin-bottom: 10px;
  color: rgba(243,240,232,.34);
}

.home-duo-copy p {
  margin: 0;
  font-size: 9px;
  line-height: 1.5;
}

@media (max-width: 820px) {
  .home-duo {
    grid-template-columns: 1fr;
  }
  .home-duo-panel {
    min-height: 70vh;
    min-height: 70svh;
  }
}

/* v31 — dim attached home sections; brighten only on hover */
.home-duo-panel img {
  opacity: 1;
  filter: brightness(.46) contrast(1.06) saturate(.82);
  transform: scale(1.004);
  transition:
    filter .42s cubic-bezier(.2,.8,.2,1),
    transform .62s cubic-bezier(.2,.8,.2,1),
    opacity .42s cubic-bezier(.2,.8,.2,1);
}

.home-duo-panel::after {
  background:
    radial-gradient(circle at 50% 45%, rgba(0,0,0,.06) 0%, rgba(0,0,0,.52) 100%),
    linear-gradient(180deg, rgba(0,0,0,.42), rgba(0,0,0,.18) 38%, rgba(0,0,0,.78));
  transition: opacity .42s cubic-bezier(.2,.8,.2,1), background .42s cubic-bezier(.2,.8,.2,1);
}

.home-duo-panel:hover img {
  filter: brightness(1) contrast(1.02) saturate(1);
  transform: scale(1.012);
}

.home-duo-panel:hover::after {
  background:
    radial-gradient(circle at 50% 45%, transparent 32%, rgba(0,0,0,.22) 100%),
    linear-gradient(180deg, rgba(0,0,0,.16), transparent 38%, rgba(0,0,0,.56));
}

.home-duo-panel:hover .home-duo-copy {
  color: rgba(243,240,232,.82);
}

@media (hover: none) {
  .home-duo-panel img {
    filter: brightness(.72) contrast(1.04) saturate(.92);
  }
}

/* v32 — subtle bottom separation gradient under the main Twój K. home card */
.home-page .home-case .case-gradient {
  background:
    linear-gradient(180deg,
      rgba(0,0,0,.26) 0%,
      rgba(0,0,0,0) 13%,
      rgba(0,0,0,0) 82%,
      rgba(0,0,0,.62) 100%);
}

.home-page .home-duo {
  position: relative;
}

.home-page .home-duo::before {
  content: "";
  position: absolute;
  z-index: 5;
  left: 0;
  right: 0;
  top: 0;
  height: clamp(42px, 7vh, 96px);
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.78), rgba(0,0,0,0));
}

/* v33 — gradient only on the lower attached sections, not on the main Twój K. card */
.home-page .home-case .case-gradient {
  background: transparent !important;
}

.home-page .home-duo::before {
  content: "";
  position: absolute;
  z-index: 5;
  left: 0;
  right: 0;
  top: 0;
  height: clamp(42px, 7vh, 96px);
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.82), rgba(0,0,0,0));
}


/* v34 — as the lower attached sections enter the viewport, the top gradient and dimming fade to zero */
.home-page {
  --home-duo-clear: 0;
}

.home-page .home-duo::before {
  opacity: calc(1 - var(--home-duo-clear));
  transition: opacity .08s linear;
}

.home-page .home-duo-panel img {
  filter:
    brightness(calc(.46 + (var(--home-duo-clear) * .54)))
    contrast(calc(1.06 - (var(--home-duo-clear) * .04)))
    saturate(calc(.82 + (var(--home-duo-clear) * .18)));
}

.home-page .home-duo-panel::after {
  opacity: calc(1 - var(--home-duo-clear));
}

.home-page .home-duo-panel:hover img {
  filter: brightness(1) contrast(1.02) saturate(1);
}

.home-page .home-duo-panel:hover::after {
  opacity: calc((1 - var(--home-duo-clear)) * .55);
}

@media (prefers-reduced-motion: reduce) {
  .home-page {
    --home-duo-clear: 1;
  }
}

/* v39 — faster film-frame stepping: one short scroll gesture should move to the next storyboard frame. */
html {
  scroll-snap-type: none !important;
}

.snap-panel {
  scroll-snap-align: none !important;
  scroll-snap-stop: normal !important;
}

/* Give the rotating sword canvas extra transparent breathing room so the crossguard/arms are not clipped. */
.sword-rotator-stage {
  width: min(33vw, 560px);
}

.sword-rotator-canvas {
  aspect-ratio: 520 / 760;
}

.frames.story-cinema {
  --story-count: 5;
  position: relative;
  /* Keep the sticky film-frame feeling, but compress the scroll distance.
     176svh = about 19svh per frame change for 5 frames, instead of 100svh. */
  height: 176vh;
  height: 176svh;
  background: #000;
  overflow: visible;
  isolation: isolate;
}

.story-cinema-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  background: #000;
  isolation: isolate;
}

.story-cinema .story-panel {
  position: absolute;
  inset: 0;
  z-index: 1;
  min-height: 100vh;
  min-height: 100svh;
  opacity: 0;
  transform: none;
  pointer-events: none;
  background: #000;
  transition:
    opacity .48s cubic-bezier(.22,.78,.22,1),
    filter .48s cubic-bezier(.22,.78,.22,1);
}

.story-cinema .story-panel.is-active {
  z-index: 3;
  opacity: 1;
  pointer-events: auto;
}

.story-cinema .story-panel img {
  position: absolute;
  inset: 0;
  width: 100vw;
  height: 100vh;
  height: 100svh;
  max-width: none;
  object-fit: contain;
  object-position: center center;
  background: #000;
  transform: scale(1.002);
  filter: brightness(.96) contrast(1.02);
  transition:
    filter .48s cubic-bezier(.22,.78,.22,1),
    transform .82s cubic-bezier(.22,.78,.22,1);
}

.story-cinema .story-panel.is-active img {
  transform: scale(1.001);
  filter: brightness(1) contrast(1.02);
}

.story-cinema .story-panel::after {
  z-index: 4;
}

.story-cinema .frame-index {
  z-index: 6;
  opacity: 0;
  transform: translateY(5px);
  transition: opacity .36s cubic-bezier(.22,.78,.22,1), transform .36s cubic-bezier(.22,.78,.22,1);
}

.story-cinema .story-panel.is-active .frame-index {
  opacity: 1;
  transform: translateY(0);
}

.story-cinema-dip {
  position: absolute;
  inset: 0;
  z-index: 8;
  pointer-events: none;
  opacity: 0;
  background:
    radial-gradient(circle at 50% 48%, rgba(0,0,0,.02), rgba(0,0,0,.20) 64%, rgba(0,0,0,.42) 100%),
    linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.28) 52%, rgba(0,0,0,.10));
}

.story-cinema.is-switching .story-cinema-dip {
  animation: storyFrameDip 410ms cubic-bezier(.22,.78,.22,1) both;
}

@keyframes storyFrameDip {
  0% { opacity: 0; }
  38% { opacity: .24; }
  100% { opacity: 0; }
}

.story-cinema .story-panel.is-opening-frame::before {
  z-index: 5;
}

@media (max-width: 1020px) {
  .sword-rotator-stage {
    width: min(42vw, 460px);
  }
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .frames.story-cinema {
    height: auto;
  }

  .story-cinema-sticky {
    position: relative;
    height: auto;
    overflow: visible;
  }

  .story-cinema .story-panel {
    position: relative;
    opacity: 1;
    pointer-events: auto;
  }

  .story-cinema-dip {
    display: none;
  }
}

/* v41 — restore transparent PNG sword detail and keep the reveal window wide enough for the crossguard. */
.sword-detail-stage {
  width: min(58vw, 1060px);
  mask-image: linear-gradient(90deg, transparent 0%, black 1%, black 99%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, black 1%, black 99%, transparent 100%);
}

.sword-detail-stage::before {
  background:
    radial-gradient(circle at 50% calc(18% + var(--sword-detail-progress) * 74%), rgba(236,241,224,.12), transparent 18rem),
    linear-gradient(90deg, rgba(0,0,0,.18), transparent 13%, transparent 87%, rgba(0,0,0,.16));
}

@media (max-width: 1020px) {
  .sword-detail-stage {
    width: 64vw;
  }
}

@media (max-width: 820px) {
  .sword-detail-stage {
    width: 72vw;
  }
}

/* v42 — minimal storyboard thumbnail browser, opened from bottom-right. */
.story-thumb-ui {
  position: absolute;
  inset: 0;
  z-index: 12;
  pointer-events: none;
}

.story-thumb-toggle {
  position: absolute;
  right: clamp(24px, 3.8vw, 72px);
  bottom: clamp(22px, 3vw, 44px);
  display: inline-flex;
  align-items: center;
  gap: .7em;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(255,255,255,.58);
  font: 600 10px/1 var(--mono);
  letter-spacing: .18em;
  text-transform: uppercase;
  cursor: pointer;
  pointer-events: auto;
  opacity: .78;
  transition:
    opacity .22s ease,
    color .22s ease,
    transform .22s cubic-bezier(.22,.78,.22,1),
    bottom .36s cubic-bezier(.22,.78,.22,1);
}

.story-thumb-toggle:hover,
.story-thumb-toggle:focus-visible {
  color: rgba(255,255,255,.92);
  opacity: 1;
  transform: translateY(-1px);
  outline: none;
}

.story-thumb-arrow {
  display: inline-block;
  transform: translateY(-1px);
  opacity: .72;
  font-size: 12px;
  transition: transform .28s cubic-bezier(.22,.78,.22,1), opacity .22s ease;
}

.story-cinema.thumbs-open .story-thumb-toggle {
  bottom: clamp(116px, 14vh, 148px);
}

.story-cinema.thumbs-open .story-thumb-arrow {
  transform: rotate(180deg) translateY(1px);
  opacity: .95;
}

.story-thumb-strip {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: clamp(92px, 13vh, 128px);
  padding: 14px clamp(18px, 3vw, 54px) 16px;
  background:
    linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.68) 34%, rgba(0,0,0,.92));
  transform: translateY(105%);
  opacity: 0;
  pointer-events: none;
  transition:
    transform .44s cubic-bezier(.22,.78,.22,1),
    opacity .34s ease;
}

.story-cinema.thumbs-open .story-thumb-strip {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

.story-thumb-track {
  height: 100%;
  display: flex;
  align-items: flex-end;
  gap: 10px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 4px 2px 8px;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.22) transparent;
}

.story-thumb-track::-webkit-scrollbar {
  height: 4px;
}

.story-thumb-track::-webkit-scrollbar-track {
  background: transparent;
}

.story-thumb-track::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.20);
  border-radius: 4px;
}

.story-thumb {
  position: relative;
  flex: 0 0 clamp(112px, 12vw, 168px);
  height: clamp(46px, 6.2vw, 72px);
  border: 1px solid rgba(255,255,255,.13);
  background: #050505;
  padding: 0;
  overflow: hidden;
  cursor: pointer;
  scroll-snap-align: start;
  opacity: .52;
  filter: brightness(.68) saturate(.84);
  transition:
    opacity .22s ease,
    filter .22s ease,
    border-color .22s ease,
    transform .22s cubic-bezier(.22,.78,.22,1);
}

.story-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.story-thumb span {
  position: absolute;
  left: 8px;
  bottom: 7px;
  color: rgba(255,255,255,.82);
  font: 600 9px/1 var(--mono);
  letter-spacing: .14em;
  text-shadow: 0 1px 8px rgba(0,0,0,.78);
}

.story-thumb:hover,
.story-thumb:focus-visible,
.story-thumb.is-current {
  opacity: 1;
  filter: brightness(1) saturate(1);
  border-color: rgba(255,255,255,.42);
  transform: translateY(-2px);
  outline: none;
}

.story-thumb.is-current::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: rgba(255,255,255,.66);
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .story-thumb-ui {
    display: none;
  }
}


/* v43 — storyboard thumbnails: arrow-only drawer + auto-open when cursor reaches bottom of the frames. */
.story-thumb-hotzone {
  position: absolute;
  z-index: 1;
  left: 0;
  right: 0;
  bottom: 0;
  height: clamp(70px, 11vh, 120px);
  pointer-events: auto;
  background: transparent;
}

.story-thumb-toggle {
  z-index: 4;
  right: clamp(24px, 3.8vw, 72px);
  bottom: clamp(20px, 2.8vw, 42px);
  width: 34px;
  height: 34px;
  justify-content: center;
  gap: 0;
  border-radius: 4px;
  background: rgba(0,0,0,.08);
  color: rgba(255,255,255,.48);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

.story-thumb-toggle:hover,
.story-thumb-toggle:focus-visible {
  color: rgba(255,255,255,.88);
  background: rgba(0,0,0,.18);
}

.story-thumb-arrow {
  font-size: 18px;
  line-height: 1;
  letter-spacing: 0;
  transform: translateY(-1px);
}

.story-cinema.thumbs-open .story-thumb-toggle {
  bottom: clamp(112px, 13.5vh, 146px);
}

.story-cinema.thumbs-open .story-thumb-arrow {
  transform: rotate(180deg) translateY(1px);
}

.story-thumb-strip {
  z-index: 3;
}

.story-cinema.thumbs-open .story-thumb-hotzone {
  height: clamp(118px, 16vh, 164px);
}


/* v44 — clearer storyboard drawer trigger + framed home CTA */
.home-case-action {
  padding: 10px 14px 10px 16px;
  border: 1px solid rgba(243,240,232,.34);
  border-radius: 4px;
  background: rgba(0,0,0,.10);
  box-shadow: 0 12px 34px rgba(0,0,0,.28);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

.home-case-action::after {
  width: 34px;
}

.home-case.is-logo-hover .home-case-action,
.home-case-action:hover {
  border-color: rgba(243,240,232,.64);
  background: rgba(0,0,0,.18);
  box-shadow: 0 16px 42px rgba(0,0,0,.36);
}

.home-case.is-logo-hover .home-case-action::after,
.home-case-action:hover::after {
  width: 50px;
}

.story-thumb-toggle {
  width: auto;
  min-width: 124px;
  height: 40px;
  padding: 0 14px 0 13px;
  gap: 9px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.16);
  color: rgba(255,255,255,.68);
  box-shadow: 0 16px 38px rgba(0,0,0,.32);
}

.story-thumb-toggle:hover,
.story-thumb-toggle:focus-visible,
.story-cinema.thumbs-open .story-thumb-toggle {
  color: rgba(255,255,255,.94);
  border-color: rgba(255,255,255,.34);
  background: rgba(0,0,0,.28);
}

.story-thumb-arrow {
  font-size: 22px;
  transform: translateY(-1px);
}

.story-thumb-label {
  display: inline-block;
  font: 600 9px/1 var(--mono);
  letter-spacing: .16em;
  text-transform: uppercase;
  transform: translateY(.5px);
  white-space: nowrap;
}

.story-cinema.thumbs-open .story-thumb-arrow {
  transform: rotate(180deg) translateY(1px);
}

@media (max-width: 820px) {
  .home-case-action {
    padding: 9px 12px 9px 14px;
  }
}

/* v45 — stronger cinematic reveal into the first storyboard frame + tiny sword-card entry motion */
:root {
  --sword-entry-progress: 0;
}

/* The sword card should feel like it is just barely sliding out from underneath the Twój K. intro card.
   No darkening here, only a tiny vertical reveal so the transition is not dead-still. */
.sword-sticky {
  transform: translate3d(0, calc((1 - var(--sword-entry-progress)) * 2.4vh), 0);
  transition: transform .08s linear;
}

/* First storyboard frame starts much deeper in black and reveals from underneath the sword card. */
.story-cinema .story-panel.is-opening-frame {
  clip-path: inset(calc((1 - var(--first-frame-shadow)) * 30%) 0 0 0);
  -webkit-clip-path: inset(calc((1 - var(--first-frame-shadow)) * 30%) 0 0 0);
  transition:
    clip-path .08s linear,
    -webkit-clip-path .08s linear,
    opacity .48s cubic-bezier(.22,.78,.22,1),
    filter .48s cubic-bezier(.22,.78,.22,1);
}

.story-cinema .story-panel.is-opening-frame::before {
  background:
    radial-gradient(circle at 44% 43%, rgba(0,0,0,.38), rgba(0,0,0,.86) 64%, rgba(0,0,0,.98) 100%),
    linear-gradient(180deg, rgba(0,0,0,.96), rgba(0,0,0,.58) 48%, rgba(0,0,0,.82));
  opacity: calc(.97 * (1 - var(--first-frame-shadow)));
}

.story-cinema .story-panel.is-opening-frame img {
  filter: brightness(calc(.34 + var(--first-frame-shadow) * .66)) contrast(calc(1.05 + var(--first-frame-shadow) * .02));
  transform: translate3d(0, calc((1 - var(--first-frame-shadow)) * 1.6vh), 0) scale(calc(1.012 - var(--first-frame-shadow) * .010));
}

/* A black leading edge makes the first frame feel like it is coming from below the previous black sword plate. */
.story-cinema .story-panel.is-opening-frame::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,calc(.96 * (1 - var(--first-frame-shadow)))) 0%, rgba(0,0,0,0) 24%),
    radial-gradient(circle at 50% 50%, transparent 45%, rgba(0,0,0,.16) 100%),
    linear-gradient(180deg, rgba(0,0,0,.20), transparent 22%, transparent 78%, rgba(0,0,0,.24));
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .sword-sticky {
    transform: none;
  }

  .story-cinema .story-panel.is-opening-frame {
    clip-path: none;
    -webkit-clip-path: none;
  }

  .story-cinema .story-panel.is-opening-frame img {
    filter: none;
    transform: scale(1.001);
  }
}

/* v46 — deeper first-frame reveal from under the sword plate + slightly stronger sword-card emergence */
:root {
  --first-frame-cover: 0.60;
}

/* The sword card now slides in just a little more clearly from beneath the Twój K. intro. */
.sword-sticky {
  transform: translate3d(0, calc((1 - var(--sword-entry-progress)) * 5.2vh), 0);
}

/* Frame 01 hides much deeper at the top, then lifts out from below the black sword plate. */
.story-cinema .story-panel.is-opening-frame {
  clip-path: inset(calc((1 - var(--first-frame-shadow)) * 60%) 0 0 0);
  -webkit-clip-path: inset(calc((1 - var(--first-frame-shadow)) * 60%) 0 0 0);
}

.story-cinema .story-panel.is-opening-frame::before {
  background:
    radial-gradient(circle at 44% 43%, rgba(0,0,0,.52), rgba(0,0,0,.92) 62%, rgba(0,0,0,1) 100%),
    linear-gradient(180deg, rgba(0,0,0,1), rgba(0,0,0,.72) 48%, rgba(0,0,0,.90));
  opacity: calc(.99 * (1 - var(--first-frame-shadow)));
}

.story-cinema .story-panel.is-opening-frame img {
  filter: brightness(calc(.22 + var(--first-frame-shadow) * .78)) contrast(calc(1.08 + var(--first-frame-shadow) * .02));
  transform: translate3d(0, calc((1 - var(--first-frame-shadow)) * 4.2vh), 0) scale(calc(1.018 - var(--first-frame-shadow) * .016));
}

.story-cinema .story-panel.is-opening-frame::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,calc(1 * (1 - var(--first-frame-shadow)))) 0%, rgba(0,0,0,calc(.82 * (1 - var(--first-frame-shadow)))) 14%, rgba(0,0,0,0) 38%),
    radial-gradient(circle at 50% 50%, transparent 40%, rgba(0,0,0,.20) 100%),
    linear-gradient(180deg, rgba(0,0,0,.24), transparent 22%, transparent 78%, rgba(0,0,0,.28));
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .sword-sticky {
    transform: none;
  }

  .story-cinema .story-panel.is-opening-frame {
    clip-path: none;
    -webkit-clip-path: none;
  }
}

/* v47 — actual under-panel reveals + chapter card between sword and storyboard */
.context-panel {
  position: relative;
  z-index: 4;
}

/* Let the sword plate begin a little underneath the Twój K. intro card instead of only appearing after it. */
.sword-reveal {
  position: relative;
  z-index: 3;
  margin-top: -10vh;
  height: calc(172vh + 10vh);
}

.sword-sticky {
  /* stronger but still subtle entry motion from beneath the previous card */
  transform: translate3d(0, calc((1 - var(--sword-entry-progress)) * 9vh), 0) !important;
}

/* Let the storyboard begin underneath the sword plate. The sword section sits above it, so frame 01
   feels like it is being uncovered from below rather than covered by an artificial black strip. */
.frames.story-cinema {
  position: relative;
  z-index: 2;
  margin-top: -22vh;
  height: calc(176vh + 22vh);
}

.story-cinema-sticky {
  transform: translate3d(0, calc((1 - var(--first-frame-shadow)) * 26vh), 0);
  transition: transform .08s linear;
  will-change: transform;
}

/* Remove the previous top-cut strip behaviour. Frame 01 now physically rises into the viewport. */
.story-cinema .story-panel.is-opening-frame {
  clip-path: none !important;
  -webkit-clip-path: none !important;
}

.story-cinema .story-panel.is-opening-frame::before {
  background:
    radial-gradient(circle at 47% 46%, rgba(0,0,0,.18), rgba(0,0,0,.78) 66%, rgba(0,0,0,.96) 100%),
    linear-gradient(180deg, rgba(0,0,0,.86), rgba(0,0,0,.40) 46%, rgba(0,0,0,.78));
  opacity: calc(.96 * (1 - var(--first-frame-shadow)));
}

.story-cinema .story-panel.is-opening-frame::after {
  background:
    radial-gradient(circle at 50% 50%, transparent 40%, rgba(0,0,0,.18) 100%),
    linear-gradient(180deg, rgba(0,0,0,.18), transparent 24%, transparent 76%, rgba(0,0,0,.26));
}

.story-cinema .story-panel.is-opening-frame img {
  filter: brightness(calc(.20 + var(--first-frame-shadow) * .80)) contrast(calc(1.08 + var(--first-frame-shadow) * .02));
  transform: translate3d(0, calc((1 - var(--first-frame-shadow)) * 4vh), 0) scale(calc(1.018 - var(--first-frame-shadow) * .016));
}

.chapter-title {
  position: absolute;
  z-index: 10;
  left: 50%;
  top: 50%;
  transform: translate3d(-50%, calc(-50% + (1 - var(--first-frame-shadow)) * 3.5vh), 0);
  color: rgba(243,240,232,.76);
  font-family: var(--mono);
  font-size: clamp(10px, .95vw, 14px);
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  white-space: nowrap;
  text-shadow: 0 18px 42px rgba(0,0,0,.82);
  opacity: calc(1 - var(--first-frame-shadow));
  pointer-events: none;
  transition: opacity .08s linear, transform .08s linear;
}

.chapter-title::before,
.chapter-title::after {
  content: "";
  display: inline-block;
  width: clamp(34px, 7vw, 120px);
  height: 1px;
  margin: 0 clamp(14px, 2vw, 32px);
  vertical-align: middle;
  background: rgba(243,240,232,.18);
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .sword-reveal,
  .frames.story-cinema {
    margin-top: 0;
    height: auto;
  }
  .sword-sticky,
  .story-cinema-sticky {
    transform: none !important;
  }
  .chapter-title {
    display: none;
  }
}


/* v48 — correct reveal direction + chapter title between sword and first frame */
:root {
  --chapter-progress: 0;
}

/* Stronger real overlap: the sword card begins just under the Twój K. image card. */
.penance-page .context-panel {
  z-index: 6;
}

.penance-page .sword-reveal {
  z-index: 5;
  margin-top: -14vh;
  height: calc(172vh + 14vh);
}

.penance-page .sword-sticky {
  transform: translate3d(0, calc((1 - var(--sword-entry-progress)) * 13vh), 0) !important;
}

/* The chapter belongs to the black space between the sword and the storyboard, not on the first frame. */
.chapter-bridge {
  position: relative;
  z-index: 4;
  height: 42vh;
  min-height: 260px;
  display: grid;
  place-items: center;
  background: #000;
  overflow: hidden;
  isolation: isolate;
}

.chapter-bridge::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 42%, rgba(243,240,232,.055), transparent 22rem),
    linear-gradient(180deg, #000 0%, rgba(0,0,0,.88) 44%, #000 100%);
  opacity: calc(.88 - var(--chapter-progress) * .52);
}

.chapter-bridge-title {
  position: relative;
  z-index: 2;
  color: rgba(243,240,232,.84);
  font-family: var(--mono);
  font-size: clamp(14px, 1.36vw, 22px);
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  white-space: nowrap;
  text-shadow: 0 20px 54px rgba(0,0,0,.92);
  opacity: calc(1 - var(--chapter-progress) * 1.25);
  transform: translate3d(0, calc(var(--chapter-progress) * -2.2vh), 0);
  transition: opacity .08s linear, transform .08s linear;
}

.chapter-bridge-title::before,
.chapter-bridge-title::after {
  content: "";
  display: inline-block;
  width: clamp(42px, 9vw, 150px);
  height: 1px;
  margin: 0 clamp(16px, 2.4vw, 38px);
  vertical-align: middle;
  background: rgba(243,240,232,.20);
}

/* Reset the v47 negative overlap that made the frame feel like it was hiding.
   Frame 01 now rises upward into place from below the black chapter/sword space. */
.frames.story-cinema {
  z-index: 3;
  margin-top: 0 !important;
  height: 176vh !important;
  height: 176svh !important;
}

.story-cinema-sticky {
  transform: translate3d(0, calc((1 - var(--first-frame-shadow)) * 24vh), 0) !important;
  transition: transform .08s linear;
}

.story-cinema .story-panel.is-opening-frame {
  clip-path: none !important;
  -webkit-clip-path: none !important;
}

.story-cinema .story-panel.is-opening-frame::before {
  background:
    radial-gradient(circle at 47% 46%, rgba(0,0,0,.24), rgba(0,0,0,.84) 66%, rgba(0,0,0,.98) 100%),
    linear-gradient(180deg, rgba(0,0,0,.94), rgba(0,0,0,.48) 46%, rgba(0,0,0,.80));
  opacity: calc(.98 * (1 - var(--first-frame-shadow)));
}

.story-cinema .story-panel.is-opening-frame::after {
  background:
    radial-gradient(circle at 50% 50%, transparent 40%, rgba(0,0,0,.18) 100%),
    linear-gradient(180deg, rgba(0,0,0,.20), transparent 24%, transparent 76%, rgba(0,0,0,.26));
}

.story-cinema .story-panel.is-opening-frame img {
  filter: brightness(calc(.18 + var(--first-frame-shadow) * .82)) contrast(calc(1.08 + var(--first-frame-shadow) * .02));
  transform: translate3d(0, calc((1 - var(--first-frame-shadow)) * 7vh), 0) scale(calc(1.018 - var(--first-frame-shadow) * .016));
}

/* Old in-frame title disabled. The real chapter title is above the storyboard now. */
.chapter-title {
  display: none !important;
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .penance-page .sword-reveal {
    margin-top: 0;
    height: auto;
  }
  .penance-page .sword-sticky,
  .story-cinema-sticky {
    transform: none !important;
  }
  .chapter-bridge {
    height: 26vh;
    min-height: 180px;
  }
  .chapter-bridge-title {
    font-size: 11px;
    opacity: .78;
    transform: none;
  }
}

/* v49 — correct sword emergence direction.
   The sword plate no longer slides itself away. It sits underneath the Twój K. card,
   and the previous card scrolling off-screen uncovers it. This reads as reveal, not hiding. */
.penance-page .context-panel {
  position: relative;
  z-index: 8;
  box-shadow: 0 7vh 12vh rgba(0,0,0,.42);
}

.penance-page .sword-reveal {
  position: relative;
  z-index: 4;
  margin-top: -20vh;
  height: calc(172vh + 20vh);
}

.penance-page .sword-sticky {
  transform: none !important;
  transition: none !important;
}

/* Keep the sword atmosphere already active while it is being uncovered. */
.penance-page .sword-sticky::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.84), rgba(0,0,0,0) 22%);
  opacity: .28;
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .penance-page .sword-reveal {
    margin-top: 0;
    height: auto;
  }
  .penance-page .context-panel {
    box-shadow: none;
  }
}

/* v50 — less buried sword reveal + first storyboard frame reveals from beneath instead of running away */
/* The sword plate was tucked too far under the Twój K. card. Keep the overlap, but make it lighter
   so the whole sword composition is visible, not only the rotating sword. */
.penance-page .context-panel {
  z-index: 8;
  box-shadow: 0 3.2vh 8.5vh rgba(0,0,0,.34);
}

.penance-page .sword-reveal {
  z-index: 4;
  margin-top: -8vh;
  height: calc(172vh + 8vh);
}

.penance-page .sword-sticky {
  transform: none !important;
  transition: none !important;
}

.penance-page .sword-sticky::before {
  opacity: .18;
}

/* Put the opening frame physically under the black chapter space. The frame itself no longer
   travels upward/downward; the black plate above scrolls away and reveals it. */
.chapter-bridge {
  z-index: 5;
}

.frames.story-cinema {
  z-index: 3;
  margin-top: -14vh !important;
  height: calc(176vh + 14vh) !important;
  height: calc(176svh + 14svh) !important;
}

.story-cinema-sticky {
  transform: none !important;
  transition: none !important;
}

.story-cinema .story-panel.is-opening-frame img {
  transform: scale(calc(1.014 - var(--first-frame-shadow) * .012)) !important;
  filter: brightness(calc(.16 + var(--first-frame-shadow) * .84)) contrast(calc(1.08 + var(--first-frame-shadow) * .02));
}

.story-cinema .story-panel.is-opening-frame::before {
  background:
    radial-gradient(circle at 47% 46%, rgba(0,0,0,.28), rgba(0,0,0,.88) 64%, rgba(0,0,0,1) 100%),
    linear-gradient(180deg, rgba(0,0,0,.98), rgba(0,0,0,.54) 46%, rgba(0,0,0,.82));
  opacity: calc(.99 * (1 - var(--first-frame-shadow)));
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .penance-page .sword-reveal,
  .frames.story-cinema {
    margin-top: 0 !important;
    height: auto !important;
  }
}


/* v52 — Chapter I: stays in place, Penance appears below it in the same type language. */
:root {
  --chapter-switch: 0;
}

.sword-detail {
  filter: brightness(1.03) contrast(1.05) !important;
}

.sword-detail-stage {
  background: transparent !important;
}

.chapter-bridge-title {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(10px, 1.1vw, 18px);
  min-width: min(780px, 90vw);
  min-height: clamp(90px, 9vw, 142px);
  opacity: calc(1 - var(--chapter-progress) * 1.18);
  transform: translate3d(0, calc(var(--chapter-progress) * -1.4vh), 0);
}

.chapter-bridge-title::before,
.chapter-bridge-title::after {
  position: absolute;
  top: calc(50% - clamp(20px, 2.2vw, 35px));
  width: clamp(46px, 8vw, 138px);
  margin: 0;
  opacity: .78;
}

.chapter-bridge-title::before {
  right: calc(50% + clamp(92px, 12vw, 182px));
}

.chapter-bridge-title::after {
  left: calc(50% + clamp(92px, 12vw, 182px));
}

.chapter-word,
.chapter-project {
  pointer-events: none;
  font-family: var(--mono);
  font-weight: 500;
  text-transform: uppercase;
  text-shadow: 0 20px 54px rgba(0,0,0,.92);
  will-change: opacity, transform;
}

.chapter-word {
  font-size: clamp(14px, 1.36vw, 22px);
  letter-spacing: .18em;
  color: rgba(243,240,232,.84);
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.chapter-project {
  font-size: clamp(25px, 3.1vw, 58px);
  letter-spacing: .13em;
  color: rgba(243,240,232,.92);
  opacity: var(--chapter-switch);
  transform: translate3d(0, calc((1 - var(--chapter-switch)) * 14px), 0) scale(calc(.985 + var(--chapter-switch) * .015));
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .chapter-bridge-title {
    opacity: .84;
    transform: none;
    gap: 10px;
  }
  .chapter-word { opacity: 1; }
  .chapter-project { opacity: 1; transform: none; }
}


/* v53 — make PENANCE quieter and make the reveal slower/more subtle. */
.chapter-bridge-title {
  gap: clamp(4px, .55vw, 9px);
}

.chapter-bridge-title::before,
.chapter-bridge-title::after {
  top: calc(50% - clamp(13px, 1.35vw, 22px));
}

.chapter-project {
  font-size: clamp(18px, 1.72vw, 32px);
  letter-spacing: .17em;
  color: rgba(243,240,232,.82);
  opacity: calc(var(--chapter-switch) * .88);
  transform: translate3d(0, calc((1 - var(--chapter-switch)) * 7px), 0) scale(calc(.992 + var(--chapter-switch) * .008));
  transition: none;
}

.chapter-word {
  color: rgba(243,240,232,.82);
}

/* v54 — darker opening frame and stronger under-sword reveal. */
.frames.story-cinema {
  margin-top: -24vh !important;
  height: calc(176vh + 24vh) !important;
  height: calc(176svh + 24svh) !important;
}

.story-cinema .story-panel.is-opening-frame::before {
  background:
    radial-gradient(circle at 47% 46%, rgba(0,0,0,.36), rgba(0,0,0,.92) 61%, rgba(0,0,0,1) 100%),
    linear-gradient(180deg, rgba(0,0,0,1), rgba(0,0,0,.76) 42%, rgba(0,0,0,.92));
  opacity: calc(.995 * (1 - var(--first-frame-shadow)));
}

.story-cinema .story-panel.is-opening-frame::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,calc(.92 * (1 - var(--first-frame-shadow)))) 0%, rgba(0,0,0,calc(.60 * (1 - var(--first-frame-shadow)))) 22%, rgba(0,0,0,0) 48%),
    radial-gradient(circle at 50% 52%, transparent 32%, rgba(0,0,0,calc(.42 * (1 - var(--first-frame-shadow)))) 100%);
}

.story-cinema .story-panel.is-opening-frame img {
  transform: translate3d(0, calc((1 - var(--first-frame-shadow)) * 14vh), 0) scale(calc(1.024 - var(--first-frame-shadow) * .020)) !important;
  filter: brightness(calc(.055 + var(--first-frame-shadow) * .945)) contrast(calc(1.10 + var(--first-frame-shadow) * .02)) !important;
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .frames.story-cinema {
    margin-top: 0 !important;
    height: auto !important;
  }
  .story-cinema .story-panel.is-opening-frame img {
    transform: none !important;
    filter: brightness(1) contrast(1.02) !important;
  }
}

/* v55 — hold only the first storyboard frame longer, so it fully emerges before frame 02. */
.frames.story-cinema {
  /* Adds extra scroll distance only to the opening beat; the later film-frame changes keep the short rhythm. */
  height: calc(250vh + 24vh) !important;
  height: calc(250svh + 24svh) !important;
}

.story-cinema .story-panel.is-opening-frame::before {
  opacity: calc(1 * (1 - var(--first-frame-shadow)));
}

.story-cinema .story-panel.is-opening-frame::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,calc(.96 * (1 - var(--first-frame-shadow)))) 0%, rgba(0,0,0,calc(.66 * (1 - var(--first-frame-shadow)))) 22%, rgba(0,0,0,0) 54%),
    radial-gradient(circle at 50% 52%, transparent 30%, rgba(0,0,0,calc(.46 * (1 - var(--first-frame-shadow)))) 100%);
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .frames.story-cinema {
    height: auto !important;
  }
}


/* v56 — rebalance opening storyboard beat: not dead-long, but still resolves before frame 02. */
.frames.story-cinema {
  height: calc(212vh + 24vh) !important;
  height: calc(212svh + 24svh) !important;
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .frames.story-cinema {
    height: auto !important;
  }
}


/* v57 — frame 01 reveal is tied to entering the viewport: dark at the bottom, full brightness when fullscreen. */
.frames.story-cinema {
  /* Shorter than v56 so the first frame does not wait too long in darkness, but enough room for film-frame stepping. */
  height: calc(200vh + 24vh) !important;
  height: calc(200svh + 24svh) !important;
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .frames.story-cinema {
    height: auto !important;
  }
}

/* v58 — fix opening-frame reveal direction: always show MORE of frame 01, never less. */
.frames.story-cinema {
  /* Keep the v57 rhythm; the fix is reveal logic, not extra dead scroll. */
  height: calc(200vh + 24vh) !important;
  height: calc(200svh + 24svh) !important;
}

.story-cinema-sticky {
  transform: none !important;
}

.story-cinema .story-panel.is-opening-frame {
  /* The top of the image is initially hidden and then uncovered monotonically. */
  clip-path: inset(calc((1 - var(--first-frame-shadow)) * 42%) 0 0 0) !important;
  -webkit-clip-path: inset(calc((1 - var(--first-frame-shadow)) * 42%) 0 0 0) !important;
}

.story-cinema .story-panel.is-opening-frame img {
  /* No vertical travel here — the visible area grows through the clip-path only. */
  transform: scale(calc(1.018 - var(--first-frame-shadow) * .016)) !important;
  filter: brightness(calc(.075 + var(--first-frame-shadow) * .925)) contrast(calc(1.10 + var(--first-frame-shadow) * .02)) !important;
}

.story-cinema .story-panel.is-opening-frame::before {
  background:
    radial-gradient(circle at 47% 46%, rgba(0,0,0,.34), rgba(0,0,0,.90) 63%, rgba(0,0,0,1) 100%),
    linear-gradient(180deg, rgba(0,0,0,.98), rgba(0,0,0,.68) 44%, rgba(0,0,0,.90));
  opacity: calc(.99 * (1 - var(--first-frame-shadow)));
}

.story-cinema .story-panel.is-opening-frame::after {
  background:
    radial-gradient(circle at 50% 52%, transparent 31%, rgba(0,0,0,calc(.40 * (1 - var(--first-frame-shadow)))) 100%),
    linear-gradient(180deg, rgba(0,0,0,calc(.52 * (1 - var(--first-frame-shadow)))) 0%, rgba(0,0,0,calc(.26 * (1 - var(--first-frame-shadow)))) 36%, rgba(0,0,0,0) 70%);
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .frames.story-cinema {
    height: auto !important;
  }
  .story-cinema .story-panel.is-opening-frame {
    clip-path: none !important;
    -webkit-clip-path: none !important;
  }
  .story-cinema .story-panel.is-opening-frame img {
    transform: none !important;
    filter: brightness(1) contrast(1.02) !important;
  }
}

/* v59 — first storyboard frame reveal begins immediately as the frame appears. */


/* v60 — first storyboard reveal is one continuous motion from first visibility to fullscreen.
   The mask opens linearly; brightness follows separately and more slowly, so there is no wait/jump. */
:root {
  --first-frame-light: 0;
}

.story-cinema .story-panel.is-opening-frame {
  clip-path: inset(calc((1 - var(--first-frame-shadow)) * 42%) 0 0 0) !important;
  -webkit-clip-path: inset(calc((1 - var(--first-frame-shadow)) * 42%) 0 0 0) !important;
}

.story-cinema .story-panel.is-opening-frame img {
  transform: scale(calc(1.018 - var(--first-frame-shadow) * .016)) !important;
  filter: brightness(calc(.075 + var(--first-frame-light) * .925)) contrast(calc(1.10 + var(--first-frame-light) * .02)) !important;
}

.story-cinema .story-panel.is-opening-frame::before {
  opacity: calc(.99 * (1 - var(--first-frame-light)));
}

.story-cinema .story-panel.is-opening-frame::after {
  background:
    radial-gradient(circle at 50% 52%, transparent 31%, rgba(0,0,0,calc(.40 * (1 - var(--first-frame-light)))) 100%),
    linear-gradient(180deg, rgba(0,0,0,calc(.52 * (1 - var(--first-frame-light)))) 0%, rgba(0,0,0,calc(.26 * (1 - var(--first-frame-light)))) 36%, rgba(0,0,0,0) 70%);
}

/* v61 — viewport-synced opening: no dead wait before frame 01 reveal. */
.story-cinema .story-panel.is-opening-frame {
  clip-path: inset(calc((1 - var(--first-frame-shadow)) * 36%) 0 0 0) !important;
  -webkit-clip-path: inset(calc((1 - var(--first-frame-shadow)) * 36%) 0 0 0) !important;
}

.story-cinema .story-panel.is-opening-frame img {
  transform: scale(calc(1.014 - var(--first-frame-shadow) * .012)) !important;
  filter: brightness(calc(.085 + var(--first-frame-light) * .915)) contrast(calc(1.09 + var(--first-frame-light) * .02)) !important;
}

.story-cinema .story-panel.is-opening-frame::before {
  opacity: calc(.96 * (1 - var(--first-frame-light))) !important;
}

.story-cinema .story-panel.is-opening-frame::after {
  background:
    radial-gradient(circle at 50% 52%, transparent 31%, rgba(0,0,0,calc(.38 * (1 - var(--first-frame-light)))) 100%),
    linear-gradient(180deg, rgba(0,0,0,calc(.46 * (1 - var(--first-frame-light)))) 0%, rgba(0,0,0,calc(.22 * (1 - var(--first-frame-light)))) 36%, rgba(0,0,0,0) 70%) !important;
}

/* v62 — fix opening frame delay: remove the redundant internal top-clip that only became visible
   once the frame was already fullscreen. The real reveal now comes from the black chapter/sword
   plane moving away, while brightness starts changing from the first visible pixel. */
.story-cinema .story-panel.is-opening-frame {
  clip-path: none !important;
  -webkit-clip-path: none !important;
}

.story-cinema .story-panel.is-opening-frame img {
  transform: scale(calc(1.014 - var(--first-frame-shadow) * .010)) !important;
  filter: brightness(calc(.07 + var(--first-frame-light) * .93)) contrast(calc(1.10 + var(--first-frame-light) * .02)) !important;
}

.story-cinema .story-panel.is-opening-frame::before {
  opacity: calc(.98 * (1 - var(--first-frame-light))) !important;
}

.story-cinema .story-panel.is-opening-frame::after {
  background:
    radial-gradient(circle at 50% 52%, transparent 31%, rgba(0,0,0,calc(.40 * (1 - var(--first-frame-light)))) 100%),
    linear-gradient(180deg, rgba(0,0,0,calc(.42 * (1 - var(--first-frame-light)))) 0%, rgba(0,0,0,calc(.20 * (1 - var(--first-frame-light)))) 36%, rgba(0,0,0,0) 70%) !important;
}


/* v63 — real first-frame opening reveal, tied to frame entry instead of sticky/fullscreen state. */
:root {
  --first-frame-reveal: 0;
}

/* Bring back the good v58-style reveal direction, but drive it from the actual
   section entering the viewport. The visible area can only grow. */
.story-cinema .story-panel.is-opening-frame {
  clip-path: inset(calc((1 - var(--first-frame-reveal)) * 54%) 0 0 0) !important;
  -webkit-clip-path: inset(calc((1 - var(--first-frame-reveal)) * 54%) 0 0 0) !important;
}

.story-cinema .story-panel.is-opening-frame img {
  transform: scale(calc(1.016 - var(--first-frame-reveal) * .014)) !important;
  filter: brightness(calc(.065 + var(--first-frame-light) * .935)) contrast(calc(1.10 + var(--first-frame-light) * .02)) !important;
}

.story-cinema .story-panel.is-opening-frame::before {
  opacity: calc(.985 * (1 - var(--first-frame-light))) !important;
}

.story-cinema .story-panel.is-opening-frame::after {
  background:
    radial-gradient(circle at 50% 52%, transparent 31%, rgba(0,0,0,calc(.42 * (1 - var(--first-frame-light)))) 100%),
    linear-gradient(180deg, rgba(0,0,0,calc(.50 * (1 - var(--first-frame-light)))) 0%, rgba(0,0,0,calc(.24 * (1 - var(--first-frame-light)))) 36%, rgba(0,0,0,0) 70%) !important;
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .story-cinema .story-panel.is-opening-frame {
    clip-path: none !important;
    -webkit-clip-path: none !important;
  }
}


/* v64 — true viewport cover reveal for frame 01.
   The previous clip-path was tied to the panel coordinates, so while the panel was only visible at the bottom
   the mask appeared to pause. This cover is viewport-based: it moves upward immediately from first contact. */
:root {
  --first-frame-cover-height: 88vh;
  --first-frame-cover-opacity: 0;
}

.story-cinema .story-panel.is-opening-frame {
  clip-path: none !important;
  -webkit-clip-path: none !important;
}

.story-cinema .story-panel.is-opening-frame img {
  transform: scale(calc(1.014 - var(--first-frame-reveal) * .010)) !important;
  filter: brightness(calc(.07 + var(--first-frame-light) * .93)) contrast(calc(1.10 + var(--first-frame-light) * .02)) !important;
}

.story-cinema .story-panel.is-opening-frame::before {
  background:
    radial-gradient(circle at 47% 46%, rgba(0,0,0,.34), rgba(0,0,0,.90) 63%, rgba(0,0,0,1) 100%),
    linear-gradient(180deg, rgba(0,0,0,.98), rgba(0,0,0,.66) 44%, rgba(0,0,0,.88));
  opacity: calc(.92 * (1 - var(--first-frame-light))) !important;
}

.story-cinema .story-panel.is-opening-frame::after {
  background:
    radial-gradient(circle at 50% 52%, transparent 31%, rgba(0,0,0,calc(.40 * (1 - var(--first-frame-light)))) 100%),
    linear-gradient(180deg, rgba(0,0,0,calc(.32 * (1 - var(--first-frame-light)))) 0%, rgba(0,0,0,calc(.16 * (1 - var(--first-frame-light)))) 36%, rgba(0,0,0,0) 70%) !important;
}

.story-opening-cover {
  position: fixed;
  z-index: 7;
  left: 0;
  right: 0;
  top: 0;
  height: var(--first-frame-cover-height);
  pointer-events: none;
  opacity: var(--first-frame-cover-opacity);
  background:
    radial-gradient(circle at 50% 54%, rgba(243,240,232,.035), transparent 28rem),
    linear-gradient(180deg, #000 0%, rgba(0,0,0,.985) 58%, rgba(0,0,0,.94) 100%);
  box-shadow: 0 2vh 7vh rgba(0,0,0,.82);
  will-change: height, opacity;
}

@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .story-opening-cover {
    display: none;
  }
}

/* v65 — flatten the Chapter I / Penance glow.
   The earlier round halo competed with the sword atmosphere; keep only a wide, low horizontal breath of light. */
.chapter-bridge::before {
  background:
    radial-gradient(ellipse 76vw 11vh at 50% 48%, rgba(243,240,232,.028), rgba(243,240,232,.012) 36%, rgba(243,240,232,0) 76%),
    linear-gradient(180deg, #000 0%, rgba(0,0,0,.91) 44%, #000 100%) !important;
  opacity: calc(.74 - var(--chapter-progress) * .44) !important;
}

.story-opening-cover {
  background:
    radial-gradient(ellipse 78vw 10vh at 50% 54%, rgba(243,240,232,.018), rgba(243,240,232,.007) 34%, rgba(243,240,232,0) 74%),
    linear-gradient(180deg, #000 0%, rgba(0,0,0,.988) 58%, rgba(0,0,0,.95) 100%) !important;
}


/* v66 — bilingual ENG / PL toggle */
.lang-switch {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: clamp(8px, 1.4vw, 18px);
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .13em;
}
.lang-button {
  appearance: none;
  border: 0;
  background: transparent;
  color: rgba(243,240,232,.36);
  font: inherit;
  font-size: 10px;
  line-height: 1;
  padding: 0;
  cursor: pointer;
  transition: color .22s ease, opacity .22s ease;
}
.lang-button:hover,
.lang-button.is-active {
  color: rgba(243,240,232,.92);
}
.lang-button + .lang-button::before {
  content: "/";
  display: inline-block;
  margin-right: 8px;
  color: rgba(243,240,232,.22);
}
@media (max-width: 740px) {
  .lang-switch { gap: 6px; margin-right: 4px; }
  .lang-button { font-size: 9px; }
}


/* v68 — minimal contact / CV page */
.contact-page {
  background: #000;
}
.contact-header {
  background: linear-gradient(to bottom, rgba(0,0,0,.82), rgba(0,0,0,0));
}
.contact-main {
  min-height: 100vh;
  background:
    radial-gradient(ellipse 62vw 34vh at 28% 18%, rgba(243,240,232,.045), transparent 66%),
    linear-gradient(180deg, #000 0%, #030303 48%, #000 100%);
}
.contact-hero {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(300px, .9fr) minmax(460px, 1.1fr);
  gap: clamp(42px, 7vw, 130px);
  align-items: center;
  width: min(1500px, 92vw);
  margin: 0 auto;
  padding: clamp(110px, 15vh, 170px) 0 clamp(70px, 10vh, 120px);
}
.contact-photo-column {
  display: flex;
  justify-content: center;
  align-items: center;
  transform: translateX(clamp(8px, 2.2vw, 34px));
}
.contact-photo-frame {
  position: relative;
  width: min(420px, 31vw);
  min-width: 280px;
  aspect-ratio: 4 / 5.15;
  overflow: hidden;
  background:
    radial-gradient(ellipse 42% 34% at 52% 34%, rgba(243,240,232,.12), transparent 62%),
    linear-gradient(180deg, rgba(243,240,232,.055), rgba(243,240,232,.018));
  border: 1px solid rgba(243,240,232,.13);
  box-shadow: 0 36px 96px rgba(0,0,0,.74);
  isolation: isolate;
}
.contact-photo-frame::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(rgba(243,240,232,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(243,240,232,.035) 1px, transparent 1px);
  background-size: 100% 24%, 25% 100%;
  opacity: .22;
}
.contact-photo-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(180deg, rgba(0,0,0,.18), transparent 44%, rgba(0,0,0,.44)),
    radial-gradient(circle at 50% 48%, transparent 44%, rgba(0,0,0,.34) 100%);
}
.contact-photo-placeholder {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: grid;
  place-items: center;
  color: rgba(243,240,232,.36);
  font: 500 10px/1.5 var(--mono);
  letter-spacing: .16em;
  text-transform: uppercase;
  text-align: center;
}
.contact-content {
  width: min(720px, 100%);
  padding-top: 1.2vh;
}
.contact-content h1 {
  font-size: clamp(48px, 6.4vw, 104px);
  letter-spacing: -.058em;
}
.contact-intro {
  max-width: 650px;
  margin: clamp(22px, 3.2vh, 42px) 0 0;
  color: rgba(243,240,232,.72);
  font-size: clamp(15px, 1.1vw, 18px);
  line-height: 1.58;
}
.contact-info-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  margin-top: clamp(44px, 6vh, 74px);
  border-top: 1px solid rgba(243,240,232,.12);
}
.contact-block {
  display: grid;
  grid-template-columns: minmax(130px, 170px) 1fr;
  gap: clamp(18px, 3vw, 54px);
  padding: clamp(22px, 3vh, 34px) 0;
  border-bottom: 1px solid rgba(243,240,232,.10);
}
.contact-block-label {
  margin: .22em 0 0;
  color: rgba(243,240,232,.42);
  font: 600 10px/1.35 var(--mono);
  letter-spacing: .16em;
  text-transform: uppercase;
}
.contact-block p:not(.contact-block-label),
.cv-row p {
  margin: 0;
  color: rgba(243,240,232,.64);
  font-size: clamp(13px, .92vw, 15px);
}
.cv-list {
  display: grid;
  gap: 20px;
}
.cv-row {
  display: grid;
  grid-template-columns: minmax(105px, 140px) 1fr;
  gap: clamp(14px, 2vw, 32px);
}
.cv-row > span {
  color: rgba(243,240,232,.36);
  font: 500 10px/1.45 var(--mono);
  letter-spacing: .13em;
  text-transform: uppercase;
}
.cv-row strong {
  color: rgba(243,240,232,.84);
  font-weight: 600;
  font-style: normal;
}
.cv-row em {
  color: rgba(243,240,232,.52);
  font-style: normal;
}
.contact-links {
  display: grid;
  gap: 10px;
}
.contact-links a {
  display: grid;
  grid-template-columns: minmax(135px, 180px) 1fr;
  gap: clamp(14px, 2vw, 32px);
  align-items: baseline;
  padding: 13px 0;
  border-bottom: 1px solid rgba(243,240,232,.075);
  transition: color .25s ease, border-color .25s ease, transform .25s ease;
}
.contact-links a:hover {
  transform: translateX(4px);
  border-color: rgba(243,240,232,.24);
}
.contact-links span {
  color: rgba(243,240,232,.38);
  font: 500 10px/1.4 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.contact-links strong {
  color: rgba(243,240,232,.80);
  font-weight: 500;
  font-size: clamp(13px, .95vw, 15px);
}
.contact-links a:hover strong {
  color: rgba(243,240,232,.96);
}

@media (max-width: 980px) {
  .contact-hero {
    grid-template-columns: 1fr;
    gap: 48px;
    width: min(760px, calc(100vw - 40px));
    padding-top: 96px;
  }
  .contact-photo-column {
    justify-content: flex-start;
    transform: none;
  }
  .contact-photo-frame {
    width: min(360px, 72vw);
    min-width: 0;
  }
  .contact-block,
  .cv-row,
  .contact-links a {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}

@media (max-width: 820px) {
  .contact-header .nav { display: flex; gap: 14px; }
  .contact-header .project-path { display: none; }
  .contact-hero { padding-top: 90px; }
}

/* v69 — contact page: separated reading rhythm, unframed photo, cleaner formal sections */
.contact-main {
  background:
    radial-gradient(ellipse 72vw 28vh at 35% 8%, rgba(243,240,232,.038), transparent 68%),
    radial-gradient(ellipse 48vw 22vh at 82% 58%, rgba(243,240,232,.022), transparent 72%),
    linear-gradient(180deg, #000 0%, #030303 44%, #000 100%);
}

.contact-hero-v69 {
  grid-template-columns: minmax(300px, .82fr) minmax(520px, 1.18fr);
  align-items: start;
  gap: clamp(54px, 8vw, 145px);
  padding-top: clamp(112px, 13vh, 148px);
  padding-bottom: clamp(76px, 12vh, 140px);
}

.contact-photo-column-v69 {
  justify-content: flex-start;
  align-items: flex-start;
  transform: translateX(clamp(24px, 3.4vw, 58px));
  padding-top: clamp(0px, 1.2vh, 16px);
}

.contact-photo-media {
  position: sticky;
  top: clamp(92px, 13vh, 136px);
  width: min(390px, 29vw);
  min-width: 270px;
  margin: 0;
  color: rgba(243,240,232,.32);
}

.contact-photo-media img {
  width: 100%;
  aspect-ratio: 4 / 5.05;
  object-fit: cover;
  object-position: center 34%;
  filter: brightness(.88) contrast(1.04) saturate(.9);
  box-shadow: 0 46px 110px rgba(0,0,0,.62);
}

.contact-photo-media figcaption {
  margin-top: 14px;
  color: rgba(243,240,232,.34);
  font: 500 9px/1.45 var(--mono);
  letter-spacing: .15em;
  text-transform: uppercase;
}

.contact-content-v69 {
  padding-top: clamp(12px, 2vh, 28px);
}

.contact-content-v69 h1 {
  font-size: clamp(48px, 5.8vw, 92px);
  letter-spacing: -.06em;
}

.contact-content-v69 .contact-intro {
  max-width: 720px;
  margin-top: clamp(22px, 3vh, 36px);
  color: rgba(243,240,232,.70);
}

.contact-section-stack {
  display: grid;
  gap: clamp(18px, 2.2vh, 28px);
  margin-top: clamp(48px, 7vh, 86px);
}

.contact-panel {
  position: relative;
  padding: clamp(26px, 4vh, 46px) clamp(24px, 3.8vw, 54px);
  border-top: 1px solid rgba(243,240,232,.13);
  background:
    linear-gradient(90deg, rgba(243,240,232,.035), rgba(243,240,232,.012) 45%, rgba(243,240,232,0));
  overflow: hidden;
}

.contact-panel::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(243,240,232,.32), rgba(243,240,232,0));
  pointer-events: none;
}

.contact-panel::after {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: min(220px, 36%);
  height: 1px;
  background: rgba(243,240,232,.28);
  pointer-events: none;
}

.contact-panel-head {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: clamp(18px, 2.4vw, 34px);
  align-items: baseline;
  margin-bottom: clamp(18px, 2.4vh, 28px);
}

.contact-panel-head span {
  color: rgba(243,240,232,.36);
  font: 600 10px/1 var(--mono);
  letter-spacing: .18em;
  text-transform: uppercase;
}

.contact-panel-head h2 {
  color: rgba(243,240,232,.88);
  font-family: "Manrope", Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(20px, 2.1vw, 34px);
  line-height: 1;
  letter-spacing: -.045em;
}

.contact-panel > p {
  max-width: 700px;
  margin: 0;
  color: rgba(243,240,232,.66);
  font-size: clamp(13px, .94vw, 15px);
  line-height: 1.72;
}

.contact-panel > p + p {
  margin-top: 16px;
}

.contact-note {
  color: rgba(243,240,232,.44) !important;
}

.experience-list {
  display: grid;
  gap: 0;
}

.experience-row {
  display: grid;
  grid-template-columns: minmax(115px, 160px) 1fr;
  gap: clamp(18px, 2.6vw, 42px);
  padding: 18px 0;
  border-top: 1px solid rgba(243,240,232,.075);
}

.experience-row:first-child {
  border-top: 0;
  padding-top: 0;
}

.experience-row:last-child {
  padding-bottom: 0;
}

.experience-row > span {
  color: rgba(243,240,232,.35);
  font: 500 10px/1.45 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
}

.experience-row h3 {
  margin: 0 0 7px;
  color: rgba(243,240,232,.84);
  font-size: clamp(14px, 1vw, 16px);
  line-height: 1.25;
  letter-spacing: -.015em;
}

.experience-row p {
  margin: 0;
  color: rgba(243,240,232,.52);
  font-size: clamp(13px, .92vw, 15px);
  line-height: 1.55;
}

.contact-links-v69 {
  grid-template-columns: 1fr;
  gap: 0;
}

.contact-links-v69 a {
  padding: 16px 0;
  border-top: 1px solid rgba(243,240,232,.075);
  border-bottom: 0;
}

.contact-links-v69 a:first-child {
  border-top: 0;
  padding-top: 0;
}

.contact-links-v69 a:last-child {
  padding-bottom: 0;
}

@media (max-width: 980px) {
  .contact-hero-v69 {
    grid-template-columns: 1fr;
    gap: 50px;
    width: min(780px, calc(100vw - 40px));
    padding-top: 96px;
  }

  .contact-photo-column-v69 {
    transform: none;
  }

  .contact-photo-media {
    position: relative;
    top: auto;
    width: min(340px, 76vw);
    min-width: 0;
  }

  .contact-panel {
    padding: 26px 0 30px 18px;
    background: linear-gradient(90deg, rgba(243,240,232,.026), rgba(243,240,232,0));
  }

  .contact-panel-head,
  .experience-row,
  .contact-links-v69 a {
    grid-template-columns: 1fr;
    gap: 9px;
  }
}

/* v70 — contact page: simple profile layout, sticky left rail, readable right column */
.contact-main-v70 {
  min-height: 100vh;
  background:
    radial-gradient(ellipse 80vw 34vh at 22% 0%, rgba(243,240,232,.025), transparent 72%),
    linear-gradient(180deg, #000 0%, #020202 50%, #000 100%);
}

.contact-profile-layout {
  width: min(1420px, 90vw);
  margin: 0 auto;
  padding: clamp(112px, 14vh, 160px) 0 clamp(90px, 12vh, 150px);
  display: grid;
  grid-template-columns: minmax(300px, 0.82fr) minmax(520px, 1.18fr);
  gap: clamp(70px, 9vw, 155px);
  align-items: start;
}

.contact-rail {
  min-height: calc(100vh - 180px);
}

.contact-rail-inner {
  position: sticky;
  top: clamp(92px, 12vh, 126px);
  display: grid;
  gap: clamp(28px, 4vh, 46px);
  width: min(390px, 100%);
}

.profile-photo {
  margin: 0;
  width: min(360px, 29vw);
  min-width: 270px;
}

.profile-photo img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5.1;
  object-fit: cover;
  object-position: center 32%;
  filter: brightness(.9) contrast(1.04) saturate(.9);
  box-shadow: 0 42px 110px rgba(0,0,0,.58);
}

.rail-contact {
  width: min(360px, 100%);
  padding-top: 2px;
  border-top: 1px solid rgba(243,240,232,.13);
}

.rail-label {
  margin: 0 0 16px;
  color: rgba(243,240,232,.40);
  font: 600 10px/1 var(--mono);
  letter-spacing: .17em;
  text-transform: uppercase;
}

.rail-contact a {
  display: grid;
  gap: 5px;
  padding: 14px 0;
  border-top: 1px solid rgba(243,240,232,.075);
  transition: transform .25s ease, border-color .25s ease;
}

.rail-contact a:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.rail-contact a:hover {
  transform: translateX(4px);
  border-color: rgba(243,240,232,.20);
}

.rail-contact span {
  color: rgba(243,240,232,.36);
  font: 500 9px/1.35 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
}

.rail-contact strong {
  color: rgba(243,240,232,.78);
  font-size: clamp(13px, .92vw, 15px);
  font-weight: 500;
}

.profile-copy {
  padding-top: clamp(6px, 1.2vh, 18px);
}

.profile-intro-block {
  margin-bottom: clamp(62px, 9vh, 112px);
}

.profile-intro-block h1 {
  margin: 0;
  color: rgba(243,240,232,.92);
  font-size: clamp(56px, 6.2vw, 104px);
  line-height: .94;
  letter-spacing: -.065em;
}

.profile-intro-block .contact-intro {
  max-width: 700px;
  margin-top: clamp(22px, 3.2vh, 38px);
  color: rgba(243,240,232,.68);
  font-size: clamp(15px, 1.05vw, 18px);
  line-height: 1.62;
}

.profile-section {
  display: grid;
  grid-template-columns: minmax(135px, 180px) minmax(0, 1fr);
  gap: clamp(38px, 5vw, 82px);
  padding: clamp(40px, 6vh, 72px) 0;
  border-top: 1px solid rgba(243,240,232,.13);
}

.profile-section:last-child {
  border-bottom: 1px solid rgba(243,240,232,.10);
}

.profile-section-title {
  display: grid;
  gap: 14px;
  align-content: start;
}

.profile-section-title span {
  color: rgba(243,240,232,.33);
  font: 600 10px/1 var(--mono);
  letter-spacing: .18em;
  text-transform: uppercase;
}

.profile-section-title h2 {
  margin: 0;
  color: rgba(243,240,232,.88);
  font-size: clamp(21px, 2vw, 32px);
  line-height: 1.05;
  letter-spacing: -.045em;
}

.profile-section-body {
  max-width: 720px;
}

.profile-section-body p {
  margin: 0;
  color: rgba(243,240,232,.63);
  font-size: clamp(13px, .95vw, 15px);
  line-height: 1.74;
}

.profile-section-body p + p {
  margin-top: 18px;
  color: rgba(243,240,232,.48);
}

.profile-experience-list {
  display: grid;
  gap: 0;
}

.profile-experience-row {
  display: grid;
  grid-template-columns: minmax(120px, 150px) minmax(0, 1fr);
  gap: clamp(20px, 3vw, 46px);
  padding: 20px 0;
  border-top: 1px solid rgba(243,240,232,.075);
}

.profile-experience-row:first-child {
  padding-top: 0;
  border-top: 0;
}

.profile-experience-row:last-child {
  padding-bottom: 0;
}

.profile-experience-row > span {
  color: rgba(243,240,232,.34);
  font: 500 10px/1.45 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
}

.profile-experience-row h3 {
  margin: 0 0 8px;
  color: rgba(243,240,232,.82);
  font-size: clamp(14px, 1vw, 16px);
  line-height: 1.25;
  letter-spacing: -.018em;
}

.profile-experience-row p {
  color: rgba(243,240,232,.51);
  line-height: 1.58;
}

@media (max-width: 980px) {
  .contact-profile-layout {
    width: min(780px, calc(100vw - 40px));
    grid-template-columns: 1fr;
    gap: 54px;
    padding-top: 96px;
  }

  .contact-rail {
    min-height: auto;
  }

  .contact-rail-inner {
    position: relative;
    top: auto;
    width: 100%;
  }

  .profile-photo {
    width: min(330px, 74vw);
    min-width: 0;
  }

  .rail-contact {
    width: 100%;
    max-width: 420px;
  }

  .profile-section {
    grid-template-columns: 1fr;
    gap: 22px;
    padding: 36px 0;
  }

  .profile-experience-row {
    grid-template-columns: 1fr;
    gap: 9px;
  }
}


/* v71 — contact profile image previews on Instagram hover */
.profile-photo-switcher {
  position: relative;
  aspect-ratio: 4 / 5.1;
  overflow: hidden;
  background: #050505;
  box-shadow: 0 42px 110px rgba(0,0,0,.58);
}

.profile-photo-switcher .profile-photo-layer {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  opacity: 0;
  transform: scale(1.01);
  filter: brightness(.88) contrast(1.05) saturate(.9);
  transition:
    opacity .34s cubic-bezier(.2,.8,.2,1),
    transform .55s cubic-bezier(.2,.8,.2,1),
    filter .34s cubic-bezier(.2,.8,.2,1);
  box-shadow: none;
}

.profile-photo-switcher .profile-photo-default {
  object-position: center 32%;
}

.profile-photo-switcher .profile-photo-jakub {
  object-position: center center;
  filter: brightness(.92) contrast(1.03) saturate(.96);
}

.profile-photo-switcher .profile-photo-signed {
  object-position: center center;
  filter: brightness(.88) contrast(1.07) saturate(.88);
}

.profile-photo-switcher[data-active="default"] .profile-photo-default,
.profile-photo-switcher[data-active="jakub"] .profile-photo-jakub,
.profile-photo-switcher[data-active="signed"] .profile-photo-signed {
  opacity: 1;
  transform: scale(1.025);
}

.profile-photo-switcher[data-active="jakub"] .profile-photo-jakub,
.profile-photo-switcher[data-active="signed"] .profile-photo-signed {
  filter: brightness(.98) contrast(1.04) saturate(1);
}

.rail-contact a[data-profile-preview] strong::after {
  content: "";
  display: inline-block;
  width: 18px;
  height: 1px;
  margin-left: 10px;
  vertical-align: middle;
  background: rgba(243,240,232,.18);
  transform: scaleX(.45);
  transform-origin: left center;
  transition: transform .25s ease, background .25s ease;
}

.rail-contact a[data-profile-preview]:hover strong::after,
.rail-contact a[data-profile-preview]:focus-visible strong::after {
  transform: scaleX(1);
  background: rgba(243,240,232,.48);
}

/* v74 — professional structure pass: compact index, footer, statement, preloader, active nav, mobile polish */
.nav a.is-active {
  color: rgba(243,240,232,.96);
  opacity: 1;
}
.nav a.is-active::after {
  content: "";
  display: block;
  height: 1px;
  width: 100%;
  margin-top: 5px;
  background: rgba(243,240,232,.42);
  transform-origin: left center;
}

.site-preloader {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  place-items: center;
  background: #000;
  color: rgba(243,240,232,.68);
  font: 500 10px/1 var(--mono);
  text-transform: uppercase;
  letter-spacing: .18em;
  opacity: 1;
  transition: opacity .52s cubic-bezier(.2,.8,.2,1), visibility .52s step-end;
  pointer-events: none;
}
.site-preloader span::before,
.site-preloader span::after {
  content: "";
  display: inline-block;
  width: 46px;
  height: 1px;
  margin: 0 18px 3px;
  background: rgba(243,240,232,.18);
}
.site-preloader.is-hidden {
  opacity: 0;
  visibility: hidden;
}

.project-statement {
  position: relative;
  z-index: 2;
  padding: clamp(82px, 13vh, 160px) clamp(22px, 5vw, 96px);
  background:
    radial-gradient(ellipse 62vw 22vh at 54% 0%, rgba(243,240,232,.026), transparent 72%),
    #000;
  border-top: 1px solid rgba(243,240,232,.055);
  border-bottom: 1px solid rgba(243,240,232,.055);
}
.project-statement-inner {
  width: min(900px, 78vw);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(160px, .28fr) minmax(0, .72fr);
  gap: clamp(34px, 6vw, 86px);
  align-items: start;
}
.project-statement .eyebrow {
  margin: .3em 0 0;
  color: rgba(243,240,232,.34);
}
.project-statement p:not(.eyebrow) {
  margin: 0;
  color: rgba(243,240,232,.72);
  font-size: clamp(17px, 1.55vw, 26px);
  line-height: 1.48;
  letter-spacing: -.035em;
}

.work-index-v74 {
  padding: clamp(92px, 14vh, 180px) clamp(18px, 4vw, 72px);
  background:
    radial-gradient(ellipse 70vw 26vh at 50% 0%, rgba(243,240,232,.024), transparent 74%),
    linear-gradient(180deg, #000 0%, #040404 52%, #000 100%);
}
.work-index-v74 .section-title {
  width: min(1180px, 92vw);
  margin-bottom: clamp(44px, 7vh, 86px);
}
.work-index-v74 .section-title h2 {
  font-size: clamp(30px, 4.6vw, 82px);
  line-height: .98;
  letter-spacing: -.065em;
  margin: 18px 0 0;
  max-width: 980px;
}
.work-directory {
  width: min(1180px, 92vw);
  margin: 0 auto;
  border-top: 1px solid rgba(243,240,232,.16);
}
.work-directory-row {
  display: grid;
  grid-template-columns: 80px minmax(180px, .9fr) minmax(240px, 1.1fr) minmax(100px, auto);
  gap: clamp(18px, 3.4vw, 54px);
  align-items: center;
  min-height: 96px;
  padding: 24px 0;
  border-bottom: 1px solid rgba(243,240,232,.12);
  transition: color .28s ease, border-color .28s ease, transform .28s ease;
}
.work-directory-row[href]:hover {
  transform: translateX(8px);
  border-color: rgba(243,240,232,.28);
}
.work-directory-number,
.work-directory-meta,
.work-directory-action {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: 10px;
}
.work-directory-number { color: rgba(243,240,232,.36); }
.work-directory-title {
  color: rgba(243,240,232,.9);
  font-size: clamp(21px, 2.2vw, 34px);
  line-height: 1;
  letter-spacing: -.045em;
}
.work-directory-meta { color: rgba(243,240,232,.48); line-height: 1.6; }
.work-directory-action { color: rgba(243,240,232,.62); justify-self: end; }
.work-directory-row.is-muted { opacity: .58; }

.site-footer {
  background: #000;
  border-top: 1px solid rgba(243,240,232,.12);
  padding: clamp(34px, 6vh, 72px) clamp(20px, 4vw, 72px);
}
.footer-inner {
  width: min(1180px, 92vw);
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  gap: 36px;
  align-items: flex-end;
}
.footer-brand {
  display: flex;
  align-items: center;
  gap: clamp(18px, 2.4vw, 34px);
  min-width: 0;
}
.footer-logo-mark {
  width: clamp(42px, 4.2vw, 64px);
  height: auto;
  display: block;
  flex: 0 0 auto;
  opacity: .9;
}
.footer-copy {
  min-width: 0;
}
.footer-name {
  margin: 0;
  font-size: clamp(20px, 2vw, 34px);
  letter-spacing: -.045em;
  color: rgba(243,240,232,.88);
}
.footer-line,
.footer-meta {
  margin: 12px 0 0;
  color: rgba(243,240,232,.42);
  font: 500 10px/1.7 var(--mono);
  text-transform: uppercase;
  letter-spacing: .13em;
}
.footer-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 12px 22px;
}
.footer-meta a { color: rgba(243,240,232,.62); }
.footer-meta a:hover { color: rgba(243,240,232,.94); }

.rail-download {
  margin-top: 8px;
  border-top-color: rgba(243,240,232,.14) !important;
}
.rail-download strong {
  color: rgba(243,240,232,.52) !important;
}
.rail-download:hover strong {
  color: rgba(243,240,232,.82) !important;
}

@media (max-width: 900px) {
  .site-header {
    height: auto;
    min-height: 62px;
    padding: 16px 18px;
    align-items: flex-start;
    gap: 18px;
  }
  .brand { line-height: 1.4; }
  .nav {
    gap: 12px 16px;
    flex-wrap: wrap;
    justify-content: flex-end;
    font-size: 9px;
  }
  .project-path { display: none; }
  .home-case-content {
    right: 22px;
    left: 22px;
    bottom: 42px;
    width: auto;
    align-items: flex-start;
  }
  .home-case-logo { width: min(260px, 72vw); }
  .home-case-topline {
    left: 20px;
    right: 20px;
    top: 82px;
  }
  .home-duo { grid-template-columns: 1fr; min-height: auto; }
  .home-duo-panel { min-height: 68vh; min-height: 68svh; }
  .work-directory-row {
    grid-template-columns: 52px 1fr;
    gap: 12px 22px;
    min-height: 0;
    padding: 24px 0;
  }
  .work-directory-meta,
  .work-directory-action {
    grid-column: 2;
    justify-self: start;
  }
  .footer-inner {
    display: grid;
    gap: 28px;
    align-items: start;
  }
  .footer-meta { justify-content: flex-start; }
  .project-statement-inner {
    width: min(720px, calc(100vw - 40px));
    grid-template-columns: 1fr;
    gap: 22px;
  }
  .project-statement p:not(.eyebrow) {
    font-size: clamp(18px, 5vw, 30px);
  }
  .sword-description {
    left: 22px !important;
    right: 22px !important;
    bottom: 8vh !important;
    width: auto !important;
  }
  .sword-rotator-stage {
    opacity: .45;
    transform: translate3d(16vw, -3vh, 0) scale(.82) !important;
  }
  .sword-detail-stage {
    width: 72vw !important;
    left: 50% !important;
    opacity: .64;
  }
  .story-thumb-ui {
    right: 16px !important;
    bottom: 16px !important;
  }
}

@media (max-width: 640px) {
  .noise { opacity: .032; }
  .site-preloader span::before,
  .site-preloader span::after { width: 22px; margin-inline: 10px; }
  .context-copy {
    left: 22px !important;
    right: 22px !important;
    bottom: 38px !important;
    width: auto !important;
  }
  .context-logo-title { width: min(260px, 72vw) !important; }
  .chapter-bridge-title { transform: translate3d(0, 0, 0) scale(.92); }
  .profile-section {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .profile-intro-block h1 {
    font-size: clamp(42px, 16vw, 72px);
  }
}

/* v75 — mobile production pass: same concept, simpler reliable phone layout */
@media (max-width: 820px) {
  :root {
    --header-h: 92px;
  }

  html,
  body {
    width: 100%;
    overflow-x: hidden;
  }

  body {
    font-size: 15px;
  }

  .noise {
    opacity: .026;
    background-size: 96px 96px;
  }

  .site-header {
    position: fixed;
    height: auto;
    min-height: var(--header-h);
    padding: 14px 16px 12px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 12px;
    background: linear-gradient(180deg, rgba(0,0,0,.92), rgba(0,0,0,.68) 62%, rgba(0,0,0,0));
  }

  .brand {
    font-size: 10.6px;
    letter-spacing: .14em;
  }

  .nav {
    display: flex !important;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 16px;
    padding: 0 0 4px;
    font-size: 9px;
    white-space: nowrap;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .nav::-webkit-scrollbar {
    display: none;
  }

  .lang-switch {
    flex: 0 0 auto;
    margin-right: 2px;
  }

  .nav a,
  .project-path {
    flex: 0 0 auto;
  }

  .nav a.is-active::after {
    margin-top: 4px;
  }

  /* HOME — the wide desktop image becomes a proper vertical mobile cover. */
  .home-page .home-hero {
    padding-top: var(--header-h);
  }

  .home-case {
    min-height: calc(92svh - var(--header-h));
    height: calc(92svh - var(--header-h));
  }

  .home-case-art,
  .home-case-art-hover {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
  }

  .home-case-art-base {
    position: absolute;
  }

  .home-case-content {
    left: 18px;
    right: 18px;
    top: auto;
    bottom: clamp(28px, 7vh, 56px);
    width: auto;
  }

  .home-case-logo {
    width: min(300px, 78vw);
  }

  .home-case-copy {
    margin-top: 16px;
    width: min(360px, 86vw);
  }

  .home-case-copy p:not(.eyebrow) {
    font-size: 13px;
    max-width: 330px;
  }

  .home-case-action {
    margin-top: 18px;
    padding: 10px 13px 10px 15px;
  }

  .home-case-topline {
    top: 16px;
    left: 18px;
    right: 18px;
    grid-template-columns: 42px 1fr auto;
    gap: 12px;
    font-size: 8px;
  }

  .home-case-topline span:nth-child(2) {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .home-case-topline span:nth-child(2)::before {
    display: none;
  }

  .home-case.is-logo-hover .home-case-art-base,
  .home-case:hover .home-case-art-base {
    opacity: 1;
    transform: scale(1.002);
  }

  .home-case.is-logo-hover .home-case-art-hover,
  .home-case:hover .home-case-art-hover {
    opacity: 0;
  }

  .home-case.is-logo-hover .home-case-content,
  .home-case:hover .home-case-content {
    transform: none;
  }

  .home-case-hover-zone {
    display: none;
  }

  .home-duo {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .home-duo-panel {
    min-height: 62svh;
  }

  .home-duo-panel img {
    filter: brightness(.78) contrast(1.04) saturate(.92);
  }

  .home-duo-panel::after {
    opacity: .64;
  }

  .work-index-v74 {
    padding: 72px 18px 80px;
  }

  .work-index-v74 .section-title,
  .work-directory,
  .footer-inner {
    width: min(100%, 560px);
  }

  .work-index-v74 .section-title h2 {
    font-size: clamp(34px, 11vw, 54px);
    line-height: .98;
  }

  .work-directory-row {
    grid-template-columns: 42px 1fr;
    gap: 10px 18px;
    padding: 22px 0;
  }

  .work-directory-title {
    font-size: 23px;
  }

  .work-directory-meta,
  .work-directory-action {
    grid-column: 2;
    justify-self: start;
    font-size: 9px;
  }

  .site-footer {
    padding: 42px 18px 56px;
  }

  .footer-inner {
    display: grid;
    gap: 24px;
  }

  .footer-meta {
    justify-content: flex-start;
  }

  /* PROJECT INTRO — readable vertical poster instead of a tiny wide image. */
  .penance-page .context-panel {
    padding-top: var(--header-h);
    min-height: 92svh;
    height: 92svh;
  }

  .penance-page .context-art {
    position: absolute;
    inset: var(--header-h) 0 0 0;
    width: 100%;
    height: calc(100% - var(--header-h));
    object-fit: cover;
    object-position: center top;
    transform: scale(1.018);
  }

  .penance-page .context-shade {
    background:
      linear-gradient(180deg, rgba(0,0,0,.10), transparent 30%, rgba(0,0,0,.82) 100%),
      linear-gradient(90deg, rgba(0,0,0,.54), rgba(0,0,0,.06) 52%, rgba(0,0,0,.38));
  }

  .penance-page .context-copy {
    left: 20px !important;
    right: 20px !important;
    top: auto !important;
    bottom: clamp(30px, 6vh, 58px) !important;
    width: auto !important;
    transform: none !important;
  }

  .penance-page .context-logo-title {
    width: min(280px, 76vw) !important;
    margin-bottom: 18px;
  }

  .penance-page .context-copy p:not(.eyebrow) {
    max-width: 360px;
    font-size: 13px;
    line-height: 1.58;
  }

  .scroll-note {
    display: none;
  }

  .project-statement {
    padding: 70px 20px;
  }

  .project-statement-inner {
    width: min(100%, 560px);
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .project-statement p:not(.eyebrow) {
    font-size: clamp(21px, 7vw, 34px);
    line-height: 1.2;
  }

  /* SWORD — simplified mobile composition. Scroll still works, but it does not rely on desktop-wide layering. */
  .penance-page .sword-reveal {
    margin-top: 0 !important;
    height: 112svh !important;
    min-height: 112svh;
  }

  .sword-sticky {
    position: sticky;
    top: 0;
    height: 100svh;
  }

  .sword-atmosphere {
    background:
      radial-gradient(ellipse 78vw 34vh at 50% 42%, rgba(208,215,202,.10), transparent 68%),
      radial-gradient(ellipse 78vw 38vh at 50% 78%, rgba(111,23,20,.06), transparent 72%),
      linear-gradient(180deg, #000, #050606 52%, #000);
  }

  .sword-grid {
    opacity: .08;
    mask-image: radial-gradient(circle at 50% 50%, black, transparent 72%);
  }

  .sword-description {
    top: auto !important;
    left: 20px !important;
    right: 20px !important;
    bottom: 34px !important;
    width: auto !important;
    max-width: 360px;
    transform: none !important;
    opacity: .92;
  }

  .sword-description h2 {
    font-size: clamp(34px, 11vw, 54px);
  }

  .sword-description p:not(.eyebrow) {
    font-size: 13px;
    line-height: 1.56;
  }

  .sword-detail-stage {
    left: 50% !important;
    top: 0;
    width: 92vw !important;
    height: 100%;
    opacity: .50;
    mask-image: linear-gradient(90deg, transparent 0%, black 2%, black 98%, transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, black 2%, black 98%, transparent 100%);
  }

  .sword-detail {
    height: 168vh;
    transform: translate3d(-50%, calc(18vh - var(--sword-detail-progress) * 96vh), 0) !important;
    filter: brightness(.96) contrast(1.05) !important;
  }

  .sword-rotator-stage {
    right: 50% !important;
    top: 39%;
    width: min(78vw, 360px) !important;
    height: min(58vh, 500px);
    opacity: .72;
    transform: translate3d(50%, -50%, 0) scale(.86) !important;
  }

  .sword-rotator-stage::before,
  .sword-rotator-stage::after {
    opacity: .10;
  }

  .sword-rotator-canvas {
    height: min(52vh, 440px);
    transform: none !important;
  }

  .sword-readout {
    display: none;
  }

  .chapter-bridge {
    height: 32svh;
    min-height: 220px;
  }

  .chapter-bridge-title {
    min-width: min(92vw, 520px);
    transform: none;
  }

  .chapter-word {
    font-size: 11px;
  }

  .chapter-project {
    font-size: clamp(18px, 5.4vw, 30px);
  }

  .chapter-bridge-title::before,
  .chapter-bridge-title::after {
    width: clamp(26px, 13vw, 70px);
  }

  .chapter-bridge-title::before {
    right: calc(50% + clamp(88px, 27vw, 150px));
  }

  .chapter-bridge-title::after {
    left: calc(50% + clamp(88px, 27vw, 150px));
  }

  /* STORY — phone gets reliable vertical fullscreen frames, no sticky hijack. */
  .frames.story-cinema {
    height: auto !important;
    margin-top: 0 !important;
    overflow: visible;
  }

  .story-cinema-sticky {
    position: relative;
    top: auto;
    height: auto;
    overflow: visible;
  }

  .story-cinema .story-panel {
    position: relative;
    inset: auto;
    min-height: 100svh;
    height: 100svh;
    opacity: 1;
    pointer-events: auto;
    transform: none;
    transition: none;
  }

  .story-cinema .story-panel img {
    height: 100svh;
    width: 100vw;
    object-fit: contain;
    object-position: center center;
    transform: scale(1.001) !important;
    filter: brightness(1) contrast(1.02) !important;
  }

  .story-cinema .story-panel.is-opening-frame {
    clip-path: none !important;
    -webkit-clip-path: none !important;
  }

  .story-cinema .story-panel.is-opening-frame::before,
  .story-cinema .story-panel.is-opening-frame::after,
  .story-opening-cover,
  .story-cinema-dip,
  .story-thumb-ui {
    display: none !important;
  }

  .story-cinema .frame-index {
    opacity: 1;
    transform: none;
    left: 18px;
    bottom: 18px;
  }

  .end-panel {
    min-height: 72svh;
  }

  /* CONTACT — sticky desktop rail becomes a clean profile page on phone. */
  .contact-profile-layout {
    width: min(100% - 36px, 620px);
    grid-template-columns: 1fr;
    gap: 42px;
    padding: calc(var(--header-h) + 28px) 0 72px;
  }

  .contact-rail {
    min-height: 0;
  }

  .contact-rail-inner {
    position: relative;
    top: auto;
    width: 100%;
    gap: 24px;
  }

  .profile-photo {
    width: min(330px, 82vw);
    min-width: 0;
  }

  .rail-contact {
    width: 100%;
    max-width: 460px;
  }

  .profile-copy {
    padding-top: 0;
  }

  .profile-intro-block {
    margin-bottom: 42px;
  }

  .profile-intro-block h1 {
    font-size: clamp(46px, 15vw, 78px);
  }

  .profile-intro-block .contact-intro {
    font-size: 15px;
    line-height: 1.62;
  }

  .profile-section {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 34px 0;
  }

  .profile-section-title h2 {
    font-size: 26px;
  }

  .profile-experience-row {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 18px 0;
  }
}

@media (max-width: 420px) {
  :root { --header-h: 96px; }
  .site-header { padding-inline: 14px; }
  .nav { gap: 13px; }
  .home-case { height: calc(94svh - var(--header-h)); }
  .home-case-content { bottom: 28px; }
  .home-case-logo { width: min(270px, 76vw); }
  .home-case-copy p:not(.eyebrow) { font-size: 12px; }
  .home-case-action { font-size: 9px; }
  .sword-description { bottom: 26px !important; }
  .sword-description p:not(.eyebrow) { font-size: 12px; }
  .profile-photo { width: min(300px, 86vw); }
}

/* v76 — phone-only project card centering + mobile storyboard strip/fullscreen viewer */
.mobile-rotate-prompt,
.mobile-story-viewer {
  display: none;
}

@media (max-width: 820px) {
  /* Move the character in the first Twój K. project card closer to the phone center. */
  .penance-page .context-art {
    object-position: 47% top !important;
  }

  /* On phone, the storyboard becomes a clean vertical film-strip: full-width images with black bars between. */
  .frames.story-cinema {
    height: auto !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    background: #000;
    overflow: visible !important;
  }

  .story-cinema-sticky {
    position: relative !important;
    height: auto !important;
    min-height: 0 !important;
    top: auto !important;
    overflow: visible !important;
    background: #000;
  }

  .story-cinema .story-panel {
    position: relative !important;
    inset: auto !important;
    display: block;
    height: auto !important;
    min-height: 0 !important;
    padding: 16px 0;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto;
    background: #000;
  }

  .story-cinema .story-panel + .story-panel {
    margin-top: 0;
  }

  .story-cinema .story-panel img {
    display: block;
    width: 100vw !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center center !important;
    transform: none !important;
    filter: brightness(1) contrast(1.02) !important;
  }

  .story-cinema .frame-index {
    left: 14px !important;
    bottom: 20px !important;
    opacity: .72;
  }

  .story-cinema .story-panel.is-opening-frame::before,
  .story-cinema .story-panel.is-opening-frame::after,
  .story-opening-cover,
  .story-cinema-dip,
  .story-thumb-ui {
    display: none !important;
  }

  .mobile-rotate-prompt {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 18px 18px 24px;
    background: #000;
  }

  .mobile-rotate-button {
    appearance: none;
    border: 1px solid rgba(243,240,232,.22);
    border-radius: 4px;
    background: rgba(243,240,232,.035);
    color: rgba(243,240,232,.72);
    font: 600 9px/1 var(--mono);
    letter-spacing: .16em;
    text-transform: uppercase;
    padding: 11px 13px 10px 14px;
    cursor: pointer;
  }

  .mobile-rotate-button::before {
    content: "↻";
    display: inline-block;
    margin-right: 8px;
    color: rgba(243,240,232,.55);
  }

  .mobile-story-viewer {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    background: #000;
    overflow: hidden;
    touch-action: manipulation;
  }

  .mobile-story-viewer.is-open {
    display: block;
  }

  body.mobile-story-open {
    overflow: hidden;
  }

  .mobile-story-stage {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100svh;
    height: 100svw;
    transform: translate(-50%, -50%) rotate(90deg);
    transform-origin: center center;
    display: grid;
    place-items: center;
    background: #000;
  }

  .mobile-story-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center center;
  }

  .mobile-story-nav,
  .mobile-story-close {
    appearance: none;
    border: 0;
    background: transparent;
    color: rgba(243,240,232,.70);
    cursor: pointer;
    z-index: 2;
  }

  .mobile-story-nav {
    position: absolute;
    top: 50%;
    width: 48px;
    height: 72px;
    transform: translateY(-50%);
    font: 300 42px/1 var(--body);
    display: grid;
    place-items: center;
    opacity: .70;
  }

  .mobile-story-prev { left: 4px; }
  .mobile-story-next { right: 4px; }
  .mobile-story-nav:disabled { opacity: .18; }

  .mobile-story-close {
    position: absolute;
    top: 12px;
    right: 14px;
    width: 38px;
    height: 38px;
    font: 300 28px/1 var(--body);
    opacity: .72;
  }

  .mobile-story-counter {
    position: absolute;
    right: 18px;
    bottom: 16px;
    z-index: 2;
    color: rgba(243,240,232,.48);
    font: 600 9px/1 var(--mono);
    letter-spacing: .16em;
  }
}


/* v77 — mobile-only repair: clean strip frames, centered rotate viewer, single sword object, contact at right */
@media (max-width: 820px) {
  /* Keep CONTACT visible on the right side of the phone nav. */
  .site-header .nav {
    gap: 14px;
    align-items: center;
  }
  .site-header .nav a[href="about.html"] {
    margin-left: auto;
    padding-left: 10px;
    text-align: right;
  }

  /* Shift the first Twój K. figure card so the character reads more central on mobile. */
  .penance-page .context-art {
    object-position: 42% top !important;
    transform: scale(1.014) !important;
  }

  /* Mobile sword: remove the zoom-detail layer completely and use the rotating artefact as the main full-screen read. */
  .penance-page .sword-reveal {
    height: 104svh !important;
    min-height: 104svh !important;
  }
  .sword-detail-stage {
    display: none !important;
  }
  .sword-rotator-stage {
    left: 50% !important;
    right: auto !important;
    top: 47% !important;
    width: min(112vw, 560px) !important;
    height: min(82svh, 760px) !important;
    opacity: .94 !important;
    transform: translate3d(-50%, -50%, 0) scale(1) !important;
    z-index: 2;
  }
  .sword-rotator-canvas {
    height: min(80svh, 740px) !important;
    max-width: 100%;
    transform: none !important;
  }
  .sword-description {
    z-index: 3;
    bottom: 22px !important;
    max-width: 320px;
    pointer-events: none;
  }
  .sword-description h2 {
    font-size: clamp(30px, 9vw, 46px);
  }
  .sword-description p:not(.eyebrow) {
    font-size: 12px;
    max-width: 300px;
  }

  /* Put the fullscreen button in the center before the phone storyboard strip. */
  .mobile-rotate-prompt {
    justify-content: center !important;
    padding: 28px 18px 30px !important;
  }

  /* Phone storyboard strip: literal full images, one under another, no artificial full-screen boxes or gaps. */
  .frames.story-cinema {
    height: auto !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    background: #000 !important;
    overflow: visible !important;
  }
  .story-cinema-sticky {
    position: relative !important;
    top: auto !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    background: #000 !important;
  }
  .story-cinema .story-panel {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
    background: #000 !important;
    overflow: hidden;
  }
  .story-cinema .story-panel img {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100vw !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center center !important;
    transform: none !important;
    filter: brightness(1) contrast(1.02) !important;
    background: #000 !important;
  }
  .story-cinema .frame-index {
    left: 12px !important;
    bottom: 10px !important;
    opacity: .48 !important;
    transform: none !important;
    font-size: 8px;
  }
  .story-cinema .story-panel.is-opening-frame,
  .story-cinema .story-panel.is-opening-frame img {
    clip-path: none !important;
    -webkit-clip-path: none !important;
  }
  .story-cinema .story-panel.is-opening-frame::before,
  .story-cinema .story-panel.is-opening-frame::after,
  .story-opening-cover,
  .story-cinema-dip,
  .story-thumb-ui {
    display: none !important;
  }

  /* Fullscreen phone viewer: rotate the storyboard itself. In desktop mobile preview, arrows appear top/bottom;
     on a real phone turned sideways they read as left/right. */
  .mobile-story-viewer {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    background: #000;
    overflow: hidden;
    touch-action: manipulation;
  }
  .mobile-story-viewer.is-open {
    display: block;
  }
  body.mobile-story-open {
    overflow: hidden;
  }
  .mobile-story-stage {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100svh;
    height: 100svw;
    transform: translate(-50%, -50%) rotate(90deg);
    transform-origin: center center;
    display: grid;
    place-items: center;
    background: #000;
    overflow: hidden;
  }
  .mobile-story-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    background: #000;
  }
  .mobile-story-nav,
  .mobile-story-close {
    appearance: none;
    border: 0;
    background: transparent;
    color: rgba(243,240,232,.72);
    cursor: pointer;
    z-index: 3;
  }
  .mobile-story-nav {
    position: absolute;
    top: 50%;
    width: 58px;
    height: 84px;
    transform: translateY(-50%);
    font: 300 46px/1 var(--body);
    display: grid;
    place-items: center;
    opacity: .72;
  }
  .mobile-story-prev { left: 6px; }
  .mobile-story-next { right: 6px; }
  .mobile-story-nav:disabled { opacity: .18; }
  .mobile-story-close {
    position: absolute;
    top: 10px;
    right: 12px;
    width: 38px;
    height: 38px;
    font: 300 28px/1 var(--body);
    opacity: .66;
  }
  .mobile-story-counter {
    position: absolute;
    right: 16px;
    bottom: 14px;
    z-index: 3;
    color: rgba(243,240,232,.50);
    font: 600 9px/1 var(--mono);
    letter-spacing: .16em;
  }
}

/* v78 — mobile home hero: show full landscape Twój K. card */
@media (max-width: 820px) {
  .home-page .home-hero {
    min-height: 0 !important;
    height: auto !important;
    padding-top: var(--header-h) !important;
  }

  .home-page .home-case {
    height: auto !important;
    min-height: 0 !important;
    display: block !important;
    overflow: visible !important;
    background: #000 !important;
    padding: 0 0 36px !important;
  }

  /* On mobile use the full wide landscape frame, not the desktop front-rider crop. */
  .home-page .home-case-art-base {
    display: none !important;
  }

  .home-page .home-case-art-hover {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: none !important;
    opacity: 1 !important;
    object-fit: contain !important;
    object-position: center top !important;
    transform: none !important;
    filter: none !important;
  }

  .home-page .home-case::before,
  .home-page .home-case .case-gradient {
    display: none !important;
    opacity: 0 !important;
  }

  .home-page .home-case-topline {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    width: auto !important;
    margin: 18px 20px 0 !important;
    transform: none !important;
    justify-content: flex-start !important;
    opacity: .56 !important;
  }

  .home-page .home-case-content {
    position: relative !important;
    inset: auto !important;
    width: auto !important;
    max-width: none !important;
    margin: 22px 20px 0 !important;
    transform: none !important;
    filter: none !important;
    text-align: left !important;
  }

  .home-page .home-case-logo {
    width: min(300px, 72vw) !important;
    max-width: 100% !important;
    margin: 0 0 20px !important;
    opacity: .94 !important;
    transform: none !important;
  }

  .home-page .home-case-copy {
    width: min(360px, calc(100vw - 40px)) !important;
    margin: 0 !important;
  }

  .home-page .home-case-copy p:not(.eyebrow) {
    max-width: 340px !important;
  }

  .home-page .home-case-action {
    margin-top: 20px !important;
  }

  .home-page .home-case-hover-zone {
    display: none !important;
  }

  .home-page .home-case.is-logo-hover .home-case-art-hover,
  .home-page .home-case:hover .home-case-art-hover,
  .home-page .home-case.is-logo-hover .home-case-content,
  .home-page .home-case:hover .home-case-content,
  .home-page .home-case.is-logo-hover .home-case-logo,
  .home-page .home-case:hover .home-case-logo {
    transform: none !important;
    filter: none !important;
  }
}


/* v79 — mobile home card: keep the landscape image whole, place Twój K. logo on the right side, copy below */
.mobile-home-card {
  display: none;
}

@media (max-width: 820px) {
  .home-page .home-case {
    padding: 0 0 34px !important;
  }

  /* Hide the previous mobile arrangement; keep desktop untouched. */
  .home-page .home-case > .home-case-art,
  .home-page .home-case > .home-case-topline,
  .home-page .home-case > .home-case-content,
  .home-page .home-case > .case-gradient {
    display: none !important;
  }

  .home-page .mobile-home-card {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0 0 0;
  }

  .mobile-home-card-visual {
    position: relative;
    width: 100%;
    background: #000;
    overflow: hidden;
  }

  .mobile-home-card-art {
    display: block;
    width: 100%;
    height: auto;
    max-width: none;
    object-fit: contain;
    object-position: center top;
    filter: none;
  }

  .mobile-home-card-logo {
    position: absolute;
    right: clamp(16px, 5vw, 26px);
    top: 50%;
    width: min(42vw, 190px);
    height: auto;
    transform: translateY(-50%);
    opacity: .96;
    filter: drop-shadow(0 18px 34px rgba(0,0,0,.72));
    pointer-events: none;
  }

  .mobile-home-card-copy {
    width: min(360px, calc(100vw - 40px));
    margin: 22px 20px 0;
  }

  .mobile-home-card-copy p:not(.eyebrow) {
    max-width: 340px;
    margin: 0;
    color: rgba(243,240,232,.74);
    font-size: 13px;
    line-height: 1.58;
  }

  .mobile-home-card-copy .eyebrow {
    color: rgba(243,240,232,.56);
    margin-bottom: 12px;
  }

  .mobile-home-card-copy .home-case-action {
    margin-top: 20px !important;
  }
}

@media (max-width: 420px) {
  .mobile-home-card-logo {
    width: min(44vw, 165px);
    right: 14px;
  }
}

/* v80 — mobile home original scroll pass: keep the full landscape, but make the card feel alive while scrolling */
@media (max-width: 820px) {
  .home-page .home-case {
    --mobile-home-progress: 0;
    height: 132svh !important;
    min-height: 132svh !important;
    padding: 0 !important;
    overflow: visible !important;
    background: #000 !important;
  }

  .home-page .mobile-home-card {
    position: sticky;
    top: var(--header-h);
    min-height: calc(100svh - var(--header-h));
    display: grid;
    grid-template-rows: auto 1fr;
    align-content: start;
    background: #000;
    overflow: hidden;
    isolation: isolate;
  }

  .mobile-home-card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
    background:
      linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.08) 38%, rgba(0,0,0,.48) 100%),
      radial-gradient(ellipse 80vw 20vh at 74% 30%, rgba(233,238,224,.08), transparent 70%);
    opacity: calc(.28 + (var(--mobile-home-progress) * .24));
    transition: opacity .16s linear;
  }

  .mobile-home-card::after {
    content: "";
    position: absolute;
    right: 18px;
    top: calc(18px + (var(--mobile-home-progress) * 12px));
    width: 1px;
    height: calc(54px + (var(--mobile-home-progress) * 72px));
    background: linear-gradient(180deg, rgba(243,240,232,.46), rgba(243,240,232,0));
    opacity: calc(.24 + (var(--mobile-home-progress) * .28));
    pointer-events: none;
    z-index: 4;
  }

  .mobile-home-card-visual {
    z-index: 1;
    transform: translate3d(0, calc(var(--mobile-home-progress) * -10px), 0);
    transition: transform .10s linear;
  }

  .mobile-home-card-art {
    filter: brightness(calc(.92 + (var(--mobile-home-progress) * .08))) contrast(1.03) saturate(calc(.94 + (var(--mobile-home-progress) * .06)));
    transform: translate3d(0, calc(var(--mobile-home-progress) * -4px), 0);
  }

  .mobile-home-card-logo {
    right: calc(14px + (var(--mobile-home-progress) * 10px));
    transform: translate3d(0, calc(-50% - (var(--mobile-home-progress) * 8px)), 0);
    opacity: calc(.88 + (var(--mobile-home-progress) * .10));
    z-index: 5;
  }

  .mobile-home-card-copy {
    position: relative;
    z-index: 5;
    margin-top: calc(24px - (var(--mobile-home-progress) * 8px));
    transform: translate3d(0, calc((1 - var(--mobile-home-progress)) * 14px), 0);
    opacity: calc(.78 + (var(--mobile-home-progress) * .22));
    transition: transform .10s linear, opacity .10s linear;
  }

  .mobile-home-card-copy .home-case-action {
    position: relative;
    overflow: hidden;
  }

  .mobile-home-card-copy .home-case-action::before {
    content: "";
    position: absolute;
    left: 14px;
    bottom: 8px;
    width: calc(18px + (var(--mobile-home-progress) * 64px));
    height: 1px;
    background: rgba(243,240,232,.42);
    opacity: .55;
    pointer-events: none;
  }
}

@media (max-width: 420px) {
  .home-page .home-case {
    height: 128svh !important;
    min-height: 128svh !important;
  }

  .mobile-home-card-copy {
    margin-left: 18px;
    margin-right: 18px;
  }
}

/* v81 — mobile home card depth pass: logo breaks the image edge, CTA sits on artwork, lower projects become clean stacked image cards */
@media (max-width: 820px) {
  .home-page .home-hero {
    padding-top: var(--header-h) !important;
    background: #000 !important;
  }

  .home-page .home-case {
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: #000 !important;
  }

  .home-page .mobile-home-card {
    position: relative !important;
    top: auto !important;
    min-height: 0 !important;
    display: block !important;
    background: #000 !important;
    overflow: visible !important;
    isolation: isolate;
  }

  .mobile-home-card::before,
  .mobile-home-card::after {
    display: none !important;
  }

  .mobile-home-card-visual {
    position: relative !important;
    width: 100% !important;
    overflow: visible !important;
    background: #000 !important;
    transform: none !important;
    z-index: 2;
  }

  .mobile-home-card-art {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    object-fit: contain !important;
    object-position: center top !important;
    transform: none !important;
    filter: contrast(1.02) saturate(.98) brightness(.96) !important;
  }

  .mobile-home-card-logo {
    position: absolute !important;
    right: clamp(12px, 4.2vw, 22px) !important;
    top: auto !important;
    bottom: clamp(-28px, -7vw, -18px) !important;
    width: min(48vw, 190px) !important;
    height: auto !important;
    transform: none !important;
    opacity: .97 !important;
    z-index: 6 !important;
    filter: drop-shadow(0 18px 34px rgba(0,0,0,.74)) !important;
    pointer-events: none;
  }

  .mobile-home-image-action {
    position: absolute !important;
    left: clamp(14px, 4.8vw, 22px) !important;
    bottom: clamp(12px, 4vw, 18px) !important;
    z-index: 7 !important;
    margin: 0 !important;
    background: rgba(0,0,0,.18) !important;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }

  .mobile-home-card-copy {
    position: relative !important;
    z-index: 1 !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: clamp(36px, 9vw, 54px) 20px 30px !important;
    transform: none !important;
    opacity: 1 !important;
    background: #000 !important;
  }

  .mobile-home-card-copy .eyebrow {
    margin-bottom: 10px !important;
  }

  .mobile-home-card-copy p:not(.eyebrow) {
    max-width: 360px !important;
  }

  .home-page .home-duo {
    display: block !important;
    width: 100vw !important;
    min-height: 0 !important;
    height: auto !important;
    background: #000 !important;
    overflow: visible !important;
    border-top: 1px solid rgba(243,240,232,.24);
  }

  .home-page .home-duo::before {
    display: none !important;
  }

  .home-page .home-duo-panel {
    width: 100vw !important;
    min-height: 0 !important;
    height: auto !important;
    aspect-ratio: 21 / 9;
    display: block !important;
    position: relative !important;
    overflow: hidden !important;
    border-bottom: 1px solid rgba(243,240,232,.22);
    background: #000 !important;
  }

  .home-page .home-duo-panel img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center center !important;
    transform: none !important;
    opacity: 1 !important;
    filter: brightness(.82) contrast(1.03) saturate(.92) !important;
  }

  .home-page .home-duo-panel::after {
    opacity: .38 !important;
    background: linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.22) 72%, rgba(0,0,0,.52)) !important;
  }

  .home-duo-copy {
    left: 16px !important;
    bottom: 14px !important;
    font-size: 8px !important;
    color: rgba(243,240,232,.66) !important;
  }

  .home-duo-copy span {
    margin-bottom: 7px !important;
  }

  .work-index-v74 {
    padding-top: 70px !important;
  }
}

@media (max-width: 420px) {
  .mobile-home-card-logo {
    width: min(50vw, 170px) !important;
    bottom: -22px !important;
  }

  .mobile-home-card-copy {
    padding-top: 42px !important;
  }
}

/* v82 — mobile lower project cards: clearer click affordance without adding heavy UI */
.home-duo-panel {
  cursor: pointer;
}

.home-duo-action {
  position: absolute;
  z-index: 4;
  right: clamp(16px, 3vw, 42px);
  bottom: clamp(16px, 3vw, 38px);
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 34px;
  padding: 10px 14px 9px;
  border: 1px solid rgba(243,240,232,.22);
  color: rgba(243,240,232,.62);
  font-family: var(--mono);
  font-size: 9px;
  line-height: 1;
  letter-spacing: .13em;
  text-transform: uppercase;
  background: rgba(0,0,0,.12);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  transition:
    border-color .32s cubic-bezier(.2,.8,.2,1),
    color .32s cubic-bezier(.2,.8,.2,1),
    background .32s cubic-bezier(.2,.8,.2,1),
    transform .32s cubic-bezier(.2,.8,.2,1),
    opacity .32s cubic-bezier(.2,.8,.2,1);
}

.home-duo-action::after {
  content: "↗";
  display: inline-block;
  font-size: 10px;
  line-height: 1;
  transform: translateY(-1px);
  opacity: .74;
}

.home-duo-panel:hover .home-duo-action,
.home-duo-panel:focus-within .home-duo-action {
  color: rgba(243,240,232,.92);
  border-color: rgba(243,240,232,.46);
  background: rgba(0,0,0,.20);
  transform: translate3d(-2px, -2px, 0);
}

@media (max-width: 820px) {
  .home-page .home-duo-panel {
    cursor: pointer;
  }

  .home-page .home-duo-panel::before {
    content: "";
    position: absolute;
    z-index: 4;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: rgba(243,240,232,.42);
    opacity: .72;
    pointer-events: none;
  }

  .home-page .home-duo-action {
    right: 14px !important;
    bottom: 12px !important;
    padding: 9px 12px 8px !important;
    min-height: 31px !important;
    border-color: rgba(243,240,232,.34) !important;
    color: rgba(243,240,232,.80) !important;
    background: rgba(0,0,0,.24) !important;
    font-size: 8px !important;
    letter-spacing: .12em !important;
    opacity: .92;
  }

  .home-page .home-duo-panel img {
    filter: brightness(.76) contrast(1.04) saturate(.92) !important;
    transition: filter .28s cubic-bezier(.2,.8,.2,1), transform .38s cubic-bezier(.2,.8,.2,1) !important;
  }

  .home-page .home-duo-panel:active img {
    filter: brightness(.98) contrast(1.03) saturate(1) !important;
    transform: scale(1.012) !important;
  }

  .home-page .home-duo-panel:active .home-duo-action {
    color: rgba(243,240,232,.98) !important;
    border-color: rgba(243,240,232,.58) !important;
    transform: translate3d(-1px, -1px, 0) !important;
  }
}

/* v84 — Works / Personal Art structure + left-side portfolio navigation */
.site-header {
  gap: clamp(18px, 3vw, 42px);
}
.brand-cluster {
  display: flex;
  align-items: center;
  gap: clamp(18px, 2.8vw, 34px);
  min-width: 0;
}
.brand-nav {
  color: rgba(243,240,232,.58);
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: 10px;
  line-height: 1;
  transition: color .22s ease, opacity .22s ease;
  white-space: nowrap;
}
.brand-nav:hover,
.brand-nav.is-active {
  color: rgba(243,240,232,.94);
}
.brand-nav.is-active::after {
  content: "";
  display: block;
  height: 1px;
  width: 100%;
  margin-top: 5px;
  background: rgba(243,240,232,.42);
}
.nav-right {
  margin-left: auto;
}
.home-duo-panel:focus-visible,
.work-directory-row:focus-visible,
.brand-nav:focus-visible {
  outline: 1px solid rgba(243,240,232,.42);
  outline-offset: 4px;
}

/* Portfolio subpages */
.portfolio-page {
  background: #000;
}
.portfolio-main {
  background:
    radial-gradient(ellipse 72vw 28vh at 50% 0%, rgba(243,240,232,.035), transparent 72%),
    linear-gradient(180deg, #000 0%, #030303 44%, #000 100%);
}
.portfolio-intro {
  width: min(1220px, 90vw);
  margin: 0 auto;
  padding: clamp(136px, 20vh, 220px) 0 clamp(70px, 11vh, 130px);
}
.portfolio-intro h1 {
  color: rgba(243,240,232,.94);
  font-size: clamp(62px, 10vw, 176px);
  letter-spacing: -.075em;
}
.portfolio-intro p:not(.eyebrow) {
  width: min(680px, 92vw);
  margin: clamp(28px, 4vh, 48px) 0 0;
  color: rgba(243,240,232,.65);
  font-size: clamp(15px, 1.15vw, 19px);
  line-height: 1.62;
}
.portfolio-subnav {
  position: sticky;
  top: var(--header-h);
  z-index: 30;
  display: flex;
  gap: clamp(16px, 2.8vw, 42px);
  width: 100%;
  padding: 14px clamp(20px, 4vw, 72px);
  border-top: 1px solid rgba(243,240,232,.08);
  border-bottom: 1px solid rgba(243,240,232,.08);
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  overflow-x: auto;
  scrollbar-width: none;
}
.portfolio-subnav::-webkit-scrollbar { display: none; }
.portfolio-subnav a {
  flex: 0 0 auto;
  color: rgba(243,240,232,.58);
  font: 600 10px/1 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: color .24s ease;
}
.portfolio-subnav a:hover { color: rgba(243,240,232,.94); }
.portfolio-subnav span {
  display: inline-block;
  margin-right: 10px;
  color: rgba(243,240,232,.28);
}
.portfolio-case-block {
  width: min(1480px, 94vw);
  margin: 0 auto;
  padding: clamp(92px, 15vh, 190px) 0;
  border-top: 1px solid rgba(243,240,232,.11);
}
.portfolio-case-head {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(300px, .68fr);
  gap: clamp(34px, 7vw, 120px);
  align-items: end;
  margin-bottom: clamp(44px, 8vh, 98px);
}
.portfolio-case-head span {
  display: block;
  margin-bottom: 18px;
  color: rgba(243,240,232,.34);
  font: 600 10px/1 var(--mono);
  letter-spacing: .17em;
  text-transform: uppercase;
}
.portfolio-case-head h2 {
  color: rgba(243,240,232,.92);
  font-size: clamp(44px, 7vw, 126px);
  letter-spacing: -.07em;
}
.portfolio-case-head p {
  margin: 0;
  color: rgba(243,240,232,.58);
  font-size: clamp(14px, 1vw, 17px);
  line-height: 1.65;
}
.portfolio-hero-image,
.editorial-grid figure,
.masonry-gallery figure {
  margin: 0;
  position: relative;
  overflow: hidden;
  background: #040404;
}
.portfolio-hero-image img,
.editorial-grid img,
.masonry-gallery img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  filter: brightness(.92) contrast(1.04) saturate(.94);
  transition: filter .4s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1);
}
.portfolio-hero-image {
  height: min(78vh, 900px);
}
.portfolio-hero-image.is-contained img,
.personal-feature img {
  object-fit: contain;
  background: #000;
}
.portfolio-hero-image::after,
.editorial-grid figure::after,
.masonry-gallery figure::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.04), transparent 56%, rgba(0,0,0,.58));
  opacity: .72;
}
.portfolio-hero-image:hover img,
.editorial-grid figure:hover img,
.masonry-gallery figure:hover img {
  filter: brightness(1) contrast(1.03) saturate(1);
  transform: scale(1.012);
}
.portfolio-hero-image figcaption,
.editorial-grid figcaption,
.masonry-gallery figcaption {
  position: absolute;
  z-index: 2;
  left: clamp(16px, 2.5vw, 42px);
  bottom: clamp(14px, 2.5vw, 34px);
  display: flex;
  gap: 14px;
  align-items: center;
  color: rgba(243,240,232,.68);
  font: 600 9px/1.4 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.portfolio-hero-image figcaption em {
  color: rgba(243,240,232,.34);
  font-style: normal;
}
.editorial-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(10px, 1.35vw, 20px);
  margin-top: clamp(10px, 1.35vw, 20px);
}
.editorial-grid figure {
  min-height: clamp(280px, 38vw, 620px);
  grid-column: span 6;
}
.editorial-grid figure.wide { grid-column: span 12; min-height: clamp(320px, 48vw, 760px); }
.editorial-grid figure.tall { min-height: clamp(500px, 60vw, 900px); }
.masonry-gallery {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-flow: dense;
  gap: clamp(10px, 1.35vw, 20px);
}
.masonry-gallery figure {
  grid-column: span 4;
  min-height: clamp(280px, 34vw, 520px);
}
.masonry-gallery figure.wide { grid-column: span 8; }
.masonry-gallery figure.large { grid-column: span 7; min-height: clamp(420px, 48vw, 760px); }
.masonry-gallery figure.tall { grid-column: span 5; min-height: clamp(520px, 62vw, 920px); }
.personal-gallery figure:nth-child(2n) img { object-position: center top; }

/* make lower home cards read like section entries, not literal project buttons */
.home-duo-action {
  min-width: 0;
}
.home-duo-action::after {
  content: "↗";
}

@media (max-width: 900px) {
  .site-header {
    flex-direction: row;
    align-items: flex-start;
  }
  .brand-cluster {
    max-width: calc(100vw - 130px);
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    gap: 16px;
    padding-bottom: 4px;
  }
  .brand-cluster::-webkit-scrollbar { display: none; }
  .brand-nav { font-size: 9px; }
  .nav-right {
    width: auto !important;
    margin-left: auto;
    justify-content: flex-end;
    gap: 12px;
  }
  .nav-right .lang-switch { display: none; }
  .portfolio-intro {
    width: min(100% - 36px, 680px);
    padding-top: calc(var(--header-h) + 58px);
  }
  .portfolio-case-block {
    width: min(100% - 24px, 760px);
    padding: 76px 0;
  }
  .portfolio-case-head {
    grid-template-columns: 1fr;
    gap: 22px;
  }
  .portfolio-hero-image {
    height: auto;
    aspect-ratio: 21 / 9;
  }
  .editorial-grid,
  .masonry-gallery {
    display: block;
  }
  .editorial-grid figure,
  .editorial-grid figure.wide,
  .editorial-grid figure.tall,
  .masonry-gallery figure,
  .masonry-gallery figure.wide,
  .masonry-gallery figure.large,
  .masonry-gallery figure.tall {
    min-height: auto;
    height: auto;
    aspect-ratio: 21 / 9;
    margin-top: 10px;
  }
  .editorial-grid figure.tall,
  .masonry-gallery figure.tall {
    aspect-ratio: 4 / 5;
  }
  .editorial-grid img,
  .masonry-gallery img {
    position: absolute;
    inset: 0;
  }
  .portfolio-subnav {
    top: var(--header-h);
    padding: 12px 18px;
  }
}

@media (max-width: 820px) {
  .site-header {
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
  .brand-cluster {
    flex: 1 1 auto;
    max-width: calc(100vw - 90px);
  }
  .nav-right {
    flex: 0 0 auto;
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
    overflow: visible !important;
  }
  .nav-right a[href="about.html"] {
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
  .nav-right .lang-switch { display: none !important; }
  .portfolio-intro h1 {
    font-size: clamp(52px, 17vw, 94px);
  }
  .portfolio-subnav {
    top: var(--header-h);
  }
  .portfolio-case-head h2 {
    font-size: clamp(40px, 13vw, 72px);
  }
  .home-page .home-duo-action {
    font-size: 8px !important;
    padding: 8px 10px 7px !important;
  }
}

/* v85 — Personal Art page pass */
.personal-art-redesign .personal-main {
  background:
    linear-gradient(180deg, #000 0%, #020202 42%, #000 100%);
}
.personal-art-redesign .personal-title-strip {
  min-height: clamp(150px, 22vh, 250px);
  padding-top: calc(var(--header-h) + clamp(20px, 3vh, 44px));
  border-bottom: 1px solid rgba(243,240,232,.1);
  background:
    radial-gradient(ellipse 80vw 16vh at 50% 100%, rgba(243,240,232,.032), transparent 72%),
    #000;
}
.personal-art-redesign .personal-title-inner {
  width: min(1440px, 92vw);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(220px, .34fr) minmax(260px, .56fr) minmax(280px, .62fr);
  gap: clamp(18px, 4vw, 68px);
  align-items: end;
}
.personal-art-redesign .personal-title-inner h1 {
  margin: 0;
  color: rgba(243,240,232,.92);
  font-size: clamp(34px, 5vw, 84px);
  line-height: .9;
  letter-spacing: -.065em;
}
.personal-art-redesign .personal-title-inner > p:last-child {
  margin: 0 0 .3em;
  color: rgba(243,240,232,.58);
  font-size: clamp(13px, .9vw, 16px);
  line-height: 1.58;
  max-width: 540px;
}
.personal-art-redesign .personal-hero-stage {
  position: relative;
  width: 100%;
  min-height: calc(100svh - var(--header-h));
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(ellipse 70vw 44vh at 50% 50%, rgba(243,240,232,.025), transparent 68%),
    #000;
}
.personal-art-redesign .personal-hero-stage img {
  width: 100%;
  height: calc(100svh - var(--header-h));
  object-fit: contain;
  object-position: center center;
  filter: brightness(.96) contrast(1.02) saturate(.96);
}
.personal-art-redesign .personal-hero-stage::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 26vh;
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(0,0,0,.68));
}
.personal-art-redesign .personal-hero-caption,
.personal-art-redesign .personal-editorial-grid figcaption {
  position: absolute;
  z-index: 2;
  left: clamp(18px, 3vw, 52px);
  bottom: clamp(16px, 3vw, 42px);
  display: flex;
  gap: 14px;
  align-items: center;
  color: rgba(243,240,232,.64);
  font: 600 9px/1.3 var(--mono);
  letter-spacing: .15em;
  text-transform: uppercase;
}
.personal-art-redesign .personal-hero-caption span,
.personal-art-redesign .personal-editorial-grid figcaption span {
  color: rgba(243,240,232,.28);
}
.personal-art-redesign .personal-hero-caption strong {
  color: rgba(243,240,232,.82);
  font-weight: 600;
}
.personal-art-redesign .personal-hero-caption em,
.personal-art-redesign .personal-editorial-grid figcaption em {
  color: rgba(243,240,232,.38);
  font-style: normal;
}
.personal-art-redesign .personal-gallery-section {
  width: min(1500px, 94vw);
  margin: 0 auto;
  padding: clamp(70px, 12vh, 150px) 0 clamp(90px, 14vh, 180px);
}
.personal-art-redesign .personal-section-head {
  display: grid;
  grid-template-columns: minmax(160px, .26fr) minmax(260px, .5fr) minmax(280px, .62fr);
  gap: clamp(18px, 4vw, 70px);
  align-items: end;
  margin-bottom: clamp(34px, 7vh, 82px);
  border-top: 1px solid rgba(243,240,232,.1);
  padding-top: clamp(28px, 5vh, 56px);
}
.personal-art-redesign .personal-section-head h2 {
  margin: 0;
  color: rgba(243,240,232,.9);
  font-size: clamp(32px, 4.8vw, 78px);
  letter-spacing: -.06em;
  line-height: .95;
}
.personal-art-redesign .personal-section-head p:last-child {
  margin: 0;
  color: rgba(243,240,232,.54);
  font-size: clamp(13px, .9vw, 16px);
  line-height: 1.62;
  max-width: 520px;
}
.personal-art-redesign .personal-editorial-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(10px, 1.45vw, 22px);
  align-items: start;
}
.personal-art-redesign .personal-editorial-grid figure {
  margin: 0;
  position: relative;
  overflow: hidden;
  background: #040404;
}
.personal-art-redesign .personal-editorial-grid img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center center;
  filter: brightness(.92) contrast(1.03) saturate(.94);
  transition: transform .7s cubic-bezier(.2,.8,.2,1), filter .35s ease;
}
.personal-art-redesign .personal-editorial-grid figure::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.02), transparent 58%, rgba(0,0,0,.56));
}
.personal-art-redesign .personal-editorial-grid figure:hover img {
  transform: scale(1.012);
  filter: brightness(1) contrast(1.025) saturate(1);
}
.personal-art-redesign .personal-tall {
  grid-column: span 6;
  height: clamp(620px, 74vw, 1040px);
}
.personal-art-redesign .personal-wide {
  grid-column: span 12;
  height: clamp(320px, 42vw, 720px);
}
.personal-art-redesign .personal-soft img { object-position: center center; }
.personal-art-redesign .personal-hard img { object-position: center center; }
.personal-art-redesign .personal-offset {
  grid-column: 3 / span 6;
  height: clamp(640px, 78vw, 1080px);
}
.personal-art-redesign .personal-empty-slot {
  min-height: clamp(260px, 30vw, 460px);
  display: grid;
  place-items: center;
  border: 1px solid rgba(243,240,232,.1);
  background:
    radial-gradient(ellipse 60vw 24vh at 50% 50%, rgba(243,240,232,.036), transparent 70%),
    #020202;
}
.personal-art-redesign .personal-empty-slot::after { display: none; }
.personal-art-redesign .personal-empty-slot div {
  width: min(420px, 72vw);
  color: rgba(243,240,232,.56);
}
.personal-art-redesign .personal-empty-slot span {
  display: block;
  margin-bottom: 18px;
  color: rgba(243,240,232,.26);
  font: 600 9px/1 var(--mono);
  letter-spacing: .16em;
}
.personal-art-redesign .personal-empty-slot strong {
  display: block;
  color: rgba(243,240,232,.84);
  font-size: clamp(24px, 3vw, 44px);
  letter-spacing: -.05em;
  margin-bottom: 12px;
}
.personal-art-redesign .personal-empty-slot p {
  margin: 0;
  line-height: 1.55;
  font-size: 14px;
}

@media (max-width: 900px) {
  .personal-art-redesign .personal-title-strip {
    min-height: auto;
    padding: calc(var(--header-h) + 44px) 18px 34px;
  }
  .personal-art-redesign .personal-title-inner,
  .personal-art-redesign .personal-section-head {
    width: auto;
    display: block;
  }
  .personal-art-redesign .personal-title-inner h1 {
    font-size: clamp(44px, 15vw, 70px);
    margin-top: 18px;
  }
  .personal-art-redesign .personal-title-inner > p:last-child,
  .personal-art-redesign .personal-section-head p:last-child {
    margin-top: 18px;
  }
  .personal-art-redesign .personal-hero-stage {
    min-height: auto;
    padding: 0;
  }
  .personal-art-redesign .personal-hero-stage img {
    height: auto;
    width: 100%;
    display: block;
    object-fit: contain;
  }
  .personal-art-redesign .personal-gallery-section {
    width: 100%;
    padding: 62px 0 90px;
  }
  .personal-art-redesign .personal-section-head {
    padding: 34px 18px 0;
    margin-bottom: 24px;
  }
  .personal-art-redesign .personal-editorial-grid {
    display: block;
  }
  .personal-art-redesign .personal-editorial-grid figure,
  .personal-art-redesign .personal-tall,
  .personal-art-redesign .personal-wide,
  .personal-art-redesign .personal-offset {
    width: 100%;
    height: auto;
    min-height: 0;
    margin: 0;
  }
  .personal-art-redesign .personal-editorial-grid img {
    height: auto;
    object-fit: contain;
  }
  .personal-art-redesign .personal-empty-slot {
    min-height: 280px;
    margin-top: 0;
  }
}

/* v86 — Personal Art gallery + refined Works layout */
html:has(body.personal-art-v86),
html:has(body.works-v86) {
  scroll-snap-type: none;
}

/* Personal Art v86 */
.personal-art-v86 .personal-v86-main {
  background: #000;
}
.personal-art-v86 .personal-v86-hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  background: #000;
}
.personal-art-v86 .personal-v86-hero > img {
  width: 100%;
  height: 100svh;
  object-fit: cover;
  object-position: center center;
  filter: brightness(.96) contrast(1.02) saturate(.98);
}
.personal-art-v86 .personal-v86-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.5) 0%, transparent 26%, transparent 62%, rgba(0,0,0,.42) 100%),
    linear-gradient(180deg, rgba(0,0,0,.28) 0%, transparent 30%, rgba(0,0,0,.74) 100%);
}
.personal-art-v86 .personal-v86-hero-note {
  position: absolute;
  z-index: 2;
  right: clamp(22px, 5vw, 86px);
  top: 48%;
  width: min(360px, 34vw);
  transform: translateY(-50%);
  color: rgba(243,240,232,.72);
}
.personal-art-v86 .personal-v86-hero-note span {
  display: block;
  margin-bottom: 14px;
  color: rgba(243,240,232,.38);
  font: 600 9px/1 var(--mono);
  text-transform: uppercase;
  letter-spacing: .17em;
}
.personal-art-v86 .personal-v86-hero-note h2 {
  margin: 0 0 16px;
  color: rgba(243,240,232,.92);
  font-size: clamp(34px, 4.2vw, 76px);
  line-height: .92;
  letter-spacing: -.055em;
}
.personal-art-v86 .personal-v86-hero-note p {
  margin: 0;
  color: rgba(243,240,232,.58);
  font-size: clamp(13px, .86vw, 15px);
  line-height: 1.62;
}
.personal-art-v86 .personal-v86-intro {
  width: min(1460px, 94vw);
  margin: 0 auto;
  padding: clamp(26px, 4vh, 52px) 0 clamp(38px, 7vh, 86px);
  display: grid;
  grid-template-columns: minmax(140px, .24fr) minmax(250px, .42fr) minmax(330px, .8fr);
  gap: clamp(18px, 4vw, 72px);
  align-items: end;
  border-bottom: 1px solid rgba(243,240,232,.1);
}
.personal-art-v86 .personal-v86-intro h1 {
  margin: 0;
  color: rgba(243,240,232,.9);
  font-size: clamp(28px, 3.2vw, 52px);
  line-height: .96;
  letter-spacing: -.045em;
  white-space: nowrap;
}
.personal-art-v86 .personal-v86-intro > p:last-child {
  margin: 0 0 .15em;
  color: rgba(243,240,232,.55);
  max-width: 620px;
  font-size: clamp(13px, .88vw, 15px);
  line-height: 1.6;
}
.personal-art-v86 .personal-v86-gallery-section {
  width: min(1500px, 94vw);
  margin: 0 auto;
  padding: clamp(42px, 8vh, 110px) 0 clamp(84px, 14vh, 160px);
}
.personal-art-v86 .personal-v86-section-head {
  display: grid;
  grid-template-columns: minmax(130px, .22fr) minmax(180px, .32fr) minmax(320px, .7fr);
  gap: clamp(18px, 4vw, 68px);
  align-items: end;
  margin-bottom: clamp(20px, 4vh, 42px);
}
.personal-art-v86 .personal-v86-section-head h2 {
  margin: 0;
  color: rgba(243,240,232,.86);
  font-size: clamp(24px, 2.8vw, 44px);
  line-height: .96;
  letter-spacing: -.04em;
}
.personal-art-v86 .personal-v86-section-head p:last-child {
  margin: 0;
  color: rgba(243,240,232,.5);
  font-size: clamp(12px, .82vw, 14px);
  line-height: 1.58;
  max-width: 560px;
}
.personal-art-v86 .personal-v86-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1px;
  background: rgba(243,240,232,.16);
  border-top: 1px solid rgba(243,240,232,.16);
  border-bottom: 1px solid rgba(243,240,232,.16);
}
.personal-art-v86 .gallery-item {
  margin: 0;
  position: relative;
  overflow: hidden;
  background: #000;
  min-height: 260px;
}
.personal-art-v86 .gallery-item button {
  appearance: none;
  border: 0;
  padding: clamp(8px, .9vw, 14px);
  margin: 0;
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  background: #020202;
  cursor: zoom-in;
}
.personal-art-v86 .gallery-item img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: brightness(.9) contrast(1.025) saturate(.96);
  transition: filter .3s ease, transform .55s cubic-bezier(.2,.8,.2,1);
}
.personal-art-v86 .gallery-item:hover img {
  filter: brightness(1) contrast(1.02) saturate(1);
  transform: scale(1.01);
}
.personal-art-v86 .gallery-item::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 56%, rgba(0,0,0,.52));
  opacity: .55;
}
.personal-art-v86 .gallery-item figcaption {
  position: absolute;
  z-index: 2;
  left: 14px;
  bottom: 12px;
  display: flex;
  gap: 10px;
  align-items: center;
  color: rgba(243,240,232,.58);
  font: 600 8px/1.2 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.personal-art-v86 .gallery-item figcaption span { color: rgba(243,240,232,.28); }
.personal-art-v86 .gallery-item figcaption em { font-style: normal; color: rgba(243,240,232,.45); }
.personal-art-v86 .gallery-item.is-square { grid-column: span 4; aspect-ratio: 1 / 1; }
.personal-art-v86 .gallery-item.is-portrait { grid-column: span 4; aspect-ratio: 4 / 5; }
.personal-art-v86 .gallery-item.is-wide { grid-column: span 12; aspect-ratio: 21 / 9; }
.personal-viewer {
  position: fixed;
  inset: 0;
  z-index: 160;
  display: grid;
  place-items: center;
  background: rgba(0,0,0,.94);
  opacity: 0;
  pointer-events: none;
  transition: opacity .24s ease;
}
.personal-viewer.is-open {
  opacity: 1;
  pointer-events: auto;
}
body.viewer-open { overflow: hidden; }
.personal-viewer .viewer-image {
  max-width: min(94vw, 1600px);
  max-height: 88svh;
  object-fit: contain;
  filter: brightness(.98) contrast(1.015);
}
.viewer-back,
.viewer-arrow,
.viewer-count {
  position: fixed;
  z-index: 162;
  font: 600 10px/1 var(--mono);
  letter-spacing: .15em;
  text-transform: uppercase;
  color: rgba(243,240,232,.72);
}
.viewer-back,
.viewer-arrow {
  appearance: none;
  border: 1px solid rgba(243,240,232,.18);
  background: rgba(0,0,0,.22);
  cursor: pointer;
  transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.viewer-back:hover,
.viewer-arrow:hover {
  color: rgba(243,240,232,.95);
  border-color: rgba(243,240,232,.36);
  background: rgba(243,240,232,.05);
}
.viewer-back {
  left: clamp(18px, 3vw, 42px);
  top: clamp(18px, 3vw, 38px);
  padding: 10px 14px;
}
.viewer-arrow {
  top: 50%;
  width: 44px;
  height: 64px;
  transform: translateY(-50%);
  font-size: 30px;
  line-height: 1;
}
.viewer-prev { left: clamp(12px, 2vw, 32px); }
.viewer-next { right: clamp(12px, 2vw, 32px); }
.viewer-count {
  right: clamp(18px, 3vw, 42px);
  bottom: clamp(18px, 3vw, 38px);
  color: rgba(243,240,232,.38);
}

/* Works v86 */
.works-v86 .works-v86-main {
  background:
    linear-gradient(180deg, #000 0%, #020202 44%, #000 100%);
}
.works-v86 .works-v86-intro {
  width: min(1480px, 94vw);
  margin: 0 auto;
  padding: calc(var(--header-h) + clamp(42px, 8vh, 92px)) 0 clamp(34px, 6vh, 78px);
  display: grid;
  grid-template-columns: minmax(140px, .24fr) minmax(250px, .44fr) minmax(340px, .8fr);
  gap: clamp(18px, 4vw, 76px);
  align-items: end;
  border-bottom: 1px solid rgba(243,240,232,.1);
}
.works-v86 .works-v86-intro h1 {
  margin: 0;
  color: rgba(243,240,232,.92);
  font-size: clamp(34px, 4.4vw, 72px);
  line-height: .94;
  letter-spacing: -.055em;
}
.works-v86 .works-v86-intro > p:last-child {
  margin: 0 0 .2em;
  color: rgba(243,240,232,.55);
  font-size: clamp(13px, .9vw, 15px);
  line-height: 1.6;
  max-width: 620px;
}
.works-v86 .works-v86-layout {
  width: min(1480px, 94vw);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(150px, 210px) minmax(0, 1fr);
  gap: clamp(28px, 5vw, 82px);
  align-items: start;
}
.works-v86 .works-v86-rail {
  position: sticky;
  top: calc(var(--header-h) + 28px);
  min-height: calc(100svh - var(--header-h) - 56px);
  padding: clamp(52px, 10vh, 110px) 0 28px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  border-right: 1px solid rgba(243,240,232,.1);
}
.works-v86 .works-v86-rail a {
  width: max-content;
  max-width: 170px;
  color: rgba(243,240,232,.5);
  font: 600 10px/1.35 var(--mono);
  letter-spacing: .13em;
  text-transform: uppercase;
  transition: color .2s ease, transform .2s ease;
}
.works-v86 .works-v86-rail a:hover {
  color: rgba(243,240,232,.94);
  transform: translateX(4px);
}
.works-v86 .works-v86-rail span {
  display: block;
  margin-bottom: 7px;
  color: rgba(243,240,232,.24);
}
.works-v86 .works-v86-content {
  min-width: 0;
}
.works-v86 .works-v86-case {
  padding: clamp(58px, 11vh, 130px) 0 clamp(72px, 13vh, 150px);
  border-bottom: 1px solid rgba(243,240,232,.1);
  scroll-margin-top: calc(var(--header-h) + 34px);
}
.works-v86 .works-v86-case-head {
  display: grid;
  grid-template-columns: minmax(250px, .58fr) minmax(320px, .72fr);
  gap: clamp(26px, 5vw, 86px);
  align-items: end;
  margin-bottom: clamp(24px, 5vh, 58px);
}
.works-v86 .works-v86-case-head p {
  margin: 0 0 16px;
  color: rgba(243,240,232,.34);
  font: 600 9px/1 var(--mono);
  letter-spacing: .16em;
  text-transform: uppercase;
}
.works-v86 .works-v86-case-head h2 {
  margin: 0;
  color: rgba(243,240,232,.9);
  font-size: clamp(32px, 4.6vw, 72px);
  line-height: .96;
  letter-spacing: -.058em;
}
.works-v86 .works-v86-case-head small {
  display: block;
  margin: 0 0 .35em;
  color: rgba(243,240,232,.55);
  font-size: clamp(13px, .9vw, 15px);
  line-height: 1.58;
  max-width: 620px;
}
.works-v86 .works-v86-hero,
.works-v86 .works-v86-grid figure,
.works-v86 .works-v86-masonry figure {
  position: relative;
  margin: 0;
  overflow: hidden;
  background: #030303;
}
.works-v86 .works-v86-hero {
  height: min(74vh, 820px);
}
.works-v86 .works-v86-hero.contained img {
  object-fit: contain;
  background: #000;
}
.works-v86 .works-v86-hero img,
.works-v86 .works-v86-grid img,
.works-v86 .works-v86-masonry img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  filter: brightness(.92) contrast(1.035) saturate(.94);
  transition: filter .35s ease, transform .65s cubic-bezier(.2,.8,.2,1);
}
.works-v86 figure:hover img {
  filter: brightness(1) contrast(1.025) saturate(1);
  transform: scale(1.01);
}
.works-v86 figcaption {
  position: absolute;
  z-index: 2;
  left: clamp(14px, 2vw, 32px);
  bottom: clamp(12px, 2vw, 28px);
  color: rgba(243,240,232,.56);
  font: 600 8px/1.3 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.works-v86 .works-v86-grid,
.works-v86 .works-v86-masonry {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(8px, 1vw, 14px);
  margin-top: clamp(8px, 1vw, 14px);
}
.works-v86 .works-v86-grid figure {
  grid-column: span 6;
  min-height: clamp(260px, 34vw, 560px);
}
.works-v86 .works-v86-grid figure.wide { grid-column: span 12; min-height: clamp(300px, 42vw, 700px); }
.works-v86 .works-v86-grid figure.tall { min-height: clamp(460px, 54vw, 760px); }
.works-v86 .works-v86-masonry figure {
  grid-column: span 4;
  min-height: clamp(260px, 30vw, 500px);
}
.works-v86 .works-v86-masonry figure.large { grid-column: span 7; min-height: clamp(360px, 44vw, 680px); }
.works-v86 .works-v86-masonry figure.wide { grid-column: span 8; }
.works-v86 .works-v86-masonry figure.tall { grid-column: span 5; min-height: clamp(480px, 58vw, 820px); }

@media (max-width: 900px) {
  .personal-art-v86 .personal-v86-hero { min-height: auto; }
  .personal-art-v86 .personal-v86-hero > img {
    height: auto;
    object-fit: contain;
    padding-top: var(--header-h);
  }
  .personal-art-v86 .personal-v86-hero-note {
    position: relative;
    right: auto;
    top: auto;
    transform: none;
    width: auto;
    padding: 24px 18px 34px;
  }
  .personal-art-v86 .personal-v86-hero::after { display: none; }
  .personal-art-v86 .personal-v86-intro,
  .personal-art-v86 .personal-v86-section-head,
  .works-v86 .works-v86-intro,
  .works-v86 .works-v86-case-head {
    width: auto;
    display: block;
  }
  .personal-art-v86 .personal-v86-intro {
    padding: 28px 18px 36px;
  }
  .personal-art-v86 .personal-v86-intro h1,
  .works-v86 .works-v86-intro h1 {
    white-space: normal;
    margin-top: 14px;
  }
  .personal-art-v86 .personal-v86-intro > p:last-child,
  .personal-art-v86 .personal-v86-section-head p:last-child,
  .works-v86 .works-v86-intro > p:last-child,
  .works-v86 .works-v86-case-head small {
    margin-top: 16px;
  }
  .personal-art-v86 .personal-v86-gallery-section {
    width: 100%;
    padding: 42px 0 90px;
  }
  .personal-art-v86 .personal-v86-section-head {
    padding: 0 18px;
  }
  .personal-art-v86 .personal-v86-grid {
    display: block;
    border: 0;
  }
  .personal-art-v86 .gallery-item,
  .personal-art-v86 .gallery-item.is-square,
  .personal-art-v86 .gallery-item.is-portrait,
  .personal-art-v86 .gallery-item.is-wide {
    aspect-ratio: auto;
    min-height: 0;
    border-top: 1px solid rgba(243,240,232,.13);
  }
  .personal-art-v86 .gallery-item button {
    height: auto;
  }
  .personal-art-v86 .gallery-item img {
    width: 100%;
    height: auto;
  }
  .works-v86 .works-v86-intro {
    padding: calc(var(--header-h) + 44px) 18px 42px;
  }
  .works-v86 .works-v86-layout {
    width: 100%;
    display: block;
  }
  .works-v86 .works-v86-rail {
    position: sticky;
    top: var(--header-h);
    z-index: 20;
    min-height: 0;
    padding: 12px 18px;
    display: flex;
    flex-direction: row;
    gap: 18px;
    border-right: 0;
    border-top: 1px solid rgba(243,240,232,.09);
    border-bottom: 1px solid rgba(243,240,232,.09);
    background: rgba(0,0,0,.72);
    backdrop-filter: blur(12px);
    overflow-x: auto;
    scrollbar-width: none;
  }
  .works-v86 .works-v86-rail::-webkit-scrollbar { display: none; }
  .works-v86 .works-v86-rail a {
    flex: 0 0 auto;
    max-width: none;
    white-space: nowrap;
  }
  .works-v86 .works-v86-rail span { display: inline-block; margin: 0 8px 0 0; }
  .works-v86 .works-v86-content {
    width: calc(100% - 24px);
    margin: 0 auto;
  }
  .works-v86 .works-v86-case {
    padding: 62px 0 82px;
  }
  .works-v86 .works-v86-hero {
    height: auto;
    aspect-ratio: 21 / 9;
  }
  .works-v86 .works-v86-grid,
  .works-v86 .works-v86-masonry {
    display: block;
  }
  .works-v86 .works-v86-grid figure,
  .works-v86 .works-v86-grid figure.wide,
  .works-v86 .works-v86-grid figure.tall,
  .works-v86 .works-v86-masonry figure,
  .works-v86 .works-v86-masonry figure.large,
  .works-v86 .works-v86-masonry figure.wide,
  .works-v86 .works-v86-masonry figure.tall {
    min-height: 0;
    height: auto;
    aspect-ratio: 21 / 9;
    margin-top: 8px;
  }
  .works-v86 .works-v86-grid figure.tall,
  .works-v86 .works-v86-masonry figure.tall {
    aspect-ratio: 4 / 5;
  }
  .works-v86 .works-v86-grid img,
  .works-v86 .works-v86-masonry img {
    position: absolute;
    inset: 0;
  }
}

/* v87 — cleaner adaptive Personal Art masonry + quieter Works typography */
/* Personal Art: smaller hero, no white grid lines, natural masonry that adapts to mixed image ratios. */
.personal-art-v86 .personal-v86-main {
  background: #000;
}

.personal-art-v86 .personal-v86-hero {
  min-height: 0 !important;
  height: clamp(440px, 68svh, 760px) !important;
  overflow: hidden;
  background: #000;
}
.personal-art-v86 .personal-v86-hero > img {
  display: block;
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  object-position: center 42%;
  padding-top: 0 !important;
  filter: brightness(.98) contrast(1.015) saturate(.98);
}
.personal-art-v86 .personal-v86-hero::after {
  background:
    linear-gradient(90deg, rgba(0,0,0,.10) 0%, transparent 34%, transparent 62%, rgba(0,0,0,.42) 100%),
    linear-gradient(180deg, rgba(0,0,0,.08) 0%, transparent 44%, rgba(0,0,0,.50) 100%);
}
.personal-art-v86 .personal-v86-hero-note {
  right: clamp(22px, 4.8vw, 82px);
  top: auto;
  bottom: clamp(26px, 5.2vh, 64px);
  width: min(330px, 34vw);
  transform: none;
}
.personal-art-v86 .personal-v86-hero-note span,
.personal-art-v86 .personal-v86-section-head .eyebrow,
.personal-art-v86 .personal-v86-intro .eyebrow,
.works-v86 .works-v86-intro .eyebrow,
.works-v86 .works-v86-case-head p {
  font-family: var(--mono);
  letter-spacing: .18em;
  font-weight: 600;
}
.personal-art-v86 .personal-v86-hero-note h2 {
  font-family: var(--mono);
  font-size: clamp(14px, 1.26vw, 20px);
  letter-spacing: .20em;
  text-transform: uppercase;
  line-height: 1.1;
  color: rgba(243,240,232,.86);
  margin-bottom: 14px;
}
.personal-art-v86 .personal-v86-hero-note p {
  max-width: 310px;
  color: rgba(243,240,232,.56);
  font-size: clamp(12px, .82vw, 14px);
}
.personal-art-v86 .personal-v86-intro {
  width: min(1480px, 94vw);
  padding: clamp(20px, 3vh, 36px) 0 clamp(36px, 6vh, 78px);
  grid-template-columns: minmax(120px, .20fr) minmax(260px, .35fr) minmax(340px, .82fr);
  border-bottom: 0;
}
.personal-art-v86 .personal-v86-intro h1,
.personal-art-v86 .personal-v86-section-head h2,
.works-v86 .works-v86-intro h1,
.works-v86 .works-v86-case-head h2 {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .17em;
  font-weight: 600;
  color: rgba(243,240,232,.86);
}
.personal-art-v86 .personal-v86-intro h1 {
  font-size: clamp(15px, 1.35vw, 22px);
  line-height: 1.15;
  white-space: nowrap;
}
.personal-art-v86 .personal-v86-intro > p:last-child {
  max-width: 600px;
  font-size: clamp(12px, .82vw, 14px);
  color: rgba(243,240,232,.48);
}
.personal-art-v86 .personal-v86-gallery-section {
  width: min(1520px, 94vw);
  padding: clamp(26px, 5vh, 68px) 0 clamp(90px, 14vh, 170px);
}
.personal-art-v86 .personal-v86-section-head {
  display: grid;
  grid-template-columns: minmax(120px, .20fr) minmax(220px, .34fr) minmax(330px, .78fr);
  margin-bottom: clamp(18px, 3vh, 34px);
  align-items: end;
}
.personal-art-v86 .personal-v86-section-head h2 {
  font-size: clamp(13px, 1.1vw, 18px);
  line-height: 1.2;
}
.personal-art-v86 .personal-v86-section-head p:last-child {
  font-size: clamp(12px, .8vw, 13px);
  color: rgba(243,240,232,.42);
}
.personal-art-v86 .personal-v86-grid {
  display: block !important;
  columns: 3 260px;
  column-gap: clamp(10px, 1vw, 16px);
  background: #000 !important;
  border: 0 !important;
}
.personal-art-v86 .gallery-item,
.personal-art-v86 .gallery-item.is-square,
.personal-art-v86 .gallery-item.is-portrait,
.personal-art-v86 .gallery-item.is-wide {
  display: inline-block;
  width: 100%;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  margin: 0 0 clamp(10px, 1vw, 16px);
  overflow: hidden;
  background: #030303;
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  border: 0 !important;
  box-shadow: none !important;
}
.personal-art-v86 .gallery-item button {
  display: block;
  padding: 0 !important;
  height: auto !important;
  background: #000 !important;
}
.personal-art-v86 .gallery-item img {
  display: block;
  width: 100% !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain;
  filter: brightness(.92) contrast(1.02) saturate(.96);
}
.personal-art-v86 .gallery-item::after {
  opacity: .34;
  background: linear-gradient(180deg, transparent 64%, rgba(0,0,0,.66));
}
.personal-art-v86 .gallery-item figcaption {
  opacity: .78;
}

/* Works: quieter case-study typography and tighter opening. */
.works-v86 .works-v86-intro {
  padding: calc(var(--header-h) + clamp(24px, 5vh, 58px)) 0 clamp(26px, 5vh, 54px);
  grid-template-columns: minmax(120px, .20fr) minmax(220px, .34fr) minmax(360px, .86fr);
  border-bottom-color: rgba(243,240,232,.08);
}
.works-v86 .works-v86-intro h1 {
  font-size: clamp(16px, 1.55vw, 26px);
  line-height: 1.15;
  letter-spacing: .18em;
}
.works-v86 .works-v86-intro > p:last-child {
  max-width: 650px;
  font-size: clamp(12px, .82vw, 14px);
  color: rgba(243,240,232,.50);
}
.works-v86 .works-v86-layout {
  grid-template-columns: minmax(140px, 190px) minmax(0, 1fr);
  gap: clamp(28px, 4.5vw, 70px);
}
.works-v86 .works-v86-rail {
  padding-top: clamp(38px, 7vh, 82px);
  border-right-color: rgba(243,240,232,.075);
}
.works-v86 .works-v86-rail a {
  font-size: 9px;
  letter-spacing: .15em;
  color: rgba(243,240,232,.44);
}
.works-v86 .works-v86-case {
  padding: clamp(46px, 8vh, 96px) 0 clamp(76px, 12vh, 140px);
}
.works-v86 .works-v86-case-head {
  grid-template-columns: minmax(250px, .48fr) minmax(340px, .78fr);
  margin-bottom: clamp(20px, 4vh, 46px);
}
.works-v86 .works-v86-case-head h2 {
  font-size: clamp(15px, 1.55vw, 26px);
  letter-spacing: .17em;
  line-height: 1.16;
}
.works-v86 .works-v86-case-head small {
  max-width: 650px;
  color: rgba(243,240,232,.49);
  font-size: clamp(12px, .82vw, 14px);
}
.works-v86 .works-v86-hero {
  height: min(66vh, 760px);
}
.works-v86 .works-v86-grid,
.works-v86 .works-v86-masonry {
  gap: clamp(10px, 1vw, 16px);
  margin-top: clamp(10px, 1vw, 16px);
}
.works-v86 .works-v86-hero,
.works-v86 .works-v86-grid figure,
.works-v86 .works-v86-masonry figure {
  background: #000;
}

@media (max-width: 900px) {
  .personal-art-v86 .personal-v86-hero {
    height: auto !important;
    padding-top: var(--header-h);
  }
  .personal-art-v86 .personal-v86-hero > img {
    height: auto !important;
    object-fit: contain;
  }
  .personal-art-v86 .personal-v86-hero-note {
    position: absolute;
    right: 18px;
    bottom: 18px;
    width: min(260px, 60vw);
    padding: 0 !important;
  }
  .personal-art-v86 .personal-v86-hero-note h2 {
    font-size: 12px;
  }
  .personal-art-v86 .personal-v86-hero-note p {
    display: none;
  }
  .personal-art-v86 .personal-v86-intro,
  .personal-art-v86 .personal-v86-section-head,
  .works-v86 .works-v86-intro,
  .works-v86 .works-v86-case-head {
    display: block;
  }
  .personal-art-v86 .personal-v86-intro {
    padding: 22px 18px 42px;
  }
  .personal-art-v86 .personal-v86-intro h1,
  .works-v86 .works-v86-intro h1,
  .works-v86 .works-v86-case-head h2 {
    margin-top: 12px;
    white-space: normal;
    font-size: 13px;
    letter-spacing: .16em;
  }
  .personal-art-v86 .personal-v86-gallery-section {
    width: calc(100% - 24px);
    padding: 30px 0 90px;
  }
  .personal-art-v86 .personal-v86-section-head {
    padding: 0 0 18px;
  }
  .personal-art-v86 .personal-v86-grid {
    columns: 1;
    column-gap: 0;
  }
  .personal-art-v86 .gallery-item,
  .personal-art-v86 .gallery-item.is-square,
  .personal-art-v86 .gallery-item.is-portrait,
  .personal-art-v86 .gallery-item.is-wide {
    margin-bottom: 10px;
  }
  .works-v86 .works-v86-intro {
    padding: calc(var(--header-h) + 26px) 18px 34px;
  }
  .works-v86 .works-v86-rail {
    padding: 10px 18px;
  }
  .works-v86 .works-v86-case {
    padding: 46px 0 78px;
  }
  .works-v86 .works-v86-hero {
    height: auto;
    aspect-ratio: 21 / 9;
  }
}

/* v88 — professional Works / Personal Art layout pass */
html:has(body.personal-art-v88),
html:has(body.works-v88) {
  scroll-snap-type: none;
  background: #000;
}

.section-kicker,
.personal-v88-hero-note .eyebrow,
.works-v88 .case-meta,
.works-v88-case-number,
.works-v88 figcaption,
.works-v88-rail,
.personal-v88-grid figcaption {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .16em;
}

/* Personal Art v88 */
.personal-art-v88 {
  background: #000;
}
.personal-v88-main {
  background:
    radial-gradient(ellipse at 74% 8%, rgba(255,255,255,.045), transparent 24vw),
    linear-gradient(180deg, #000 0%, #020202 46%, #000 100%);
}
.personal-v88-hero {
  position: relative;
  min-height: clamp(560px, 80svh, 900px);
  padding: calc(var(--header-h) + clamp(20px, 3vw, 42px)) clamp(18px, 4vw, 70px) clamp(20px, 3vw, 48px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  gap: clamp(28px, 5vw, 92px);
  align-items: end;
  overflow: hidden;
  isolation: isolate;
}
.personal-v88-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(0,0,0,.15), transparent 26%, rgba(0,0,0,.62) 100%),
    radial-gradient(ellipse at 42% 48%, rgba(255,255,255,.06), transparent 34vw);
}
.personal-v88-hero-media {
  position: relative;
  z-index: 1;
  height: clamp(460px, 70svh, 780px);
  display: flex;
  align-items: center;
  justify-content: center;
  background: #000;
  overflow: hidden;
}
.personal-v88-hero-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
  filter: brightness(.93) contrast(1.025) saturate(.96);
}
.personal-v88-hero-note {
  position: relative;
  z-index: 2;
  padding: 0 0 clamp(16px, 4vh, 56px);
  color: rgba(243,240,232,.72);
}
.personal-v88-hero-note .eyebrow {
  margin-bottom: 18px;
  color: rgba(243,240,232,.38);
  font-size: 9px;
  line-height: 1.35;
}
.personal-v88-hero-note h2 {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .19em;
  font-weight: 600;
  font-size: clamp(15px, 1.25vw, 22px);
  line-height: 1.2;
  color: rgba(243,240,232,.90);
  margin: 0 0 18px;
}
.personal-v88-hero-note p:not(.eyebrow) {
  margin: 0;
  max-width: 350px;
  color: rgba(243,240,232,.55);
  font-size: clamp(12px, .84vw, 14px);
  line-height: 1.65;
}
.personal-v88-intro,
.personal-v88-section-head {
  width: min(1360px, 92vw);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(120px, 180px) minmax(230px, 360px) minmax(320px, 620px);
  gap: clamp(22px, 4vw, 72px);
  align-items: baseline;
}
.personal-v88-intro {
  padding: clamp(30px, 6vh, 76px) 0 clamp(40px, 8vh, 90px);
  border-top: 1px solid rgba(243,240,232,.07);
}
.section-kicker {
  color: rgba(243,240,232,.32);
  font-size: 9px;
  font-weight: 600;
  line-height: 1.4;
}
.personal-v88-intro h1,
.personal-v88-section-head h2 {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .17em;
  font-weight: 600;
  color: rgba(243,240,232,.88);
  line-height: 1.22;
  white-space: nowrap;
}
.personal-v88-intro h1 { font-size: clamp(14px, 1.25vw, 20px); }
.personal-v88-section-head h2 { font-size: clamp(13px, 1.05vw, 17px); }
.personal-v88-intro p,
.personal-v88-section-head p {
  margin: 0;
  color: rgba(243,240,232,.50);
  font-size: clamp(12px, .82vw, 14px);
  line-height: 1.65;
}
.personal-v88-gallery-section {
  width: min(1420px, 92vw);
  margin: 0 auto;
  padding: 0 0 clamp(95px, 15vh, 170px);
}
.personal-v88-section-head {
  width: 100%;
  margin-bottom: clamp(18px, 3.4vh, 38px);
}
.adaptive-gallery.personal-v88-grid {
  --gallery-gap: clamp(8px, .78vw, 14px);
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
  grid-auto-rows: 8px;
  grid-auto-flow: dense;
  gap: var(--gallery-gap);
  align-items: start;
  background: #000;
}
.personal-v88-grid .gallery-item {
  position: relative;
  margin: 0;
  overflow: hidden;
  background: #050505;
  min-width: 0;
  transform: translateZ(0);
}
.personal-v88-grid .gallery-item.is-landscape {
  grid-column: span 2;
}
.personal-v88-grid .gallery-item button {
  appearance: none;
  border: 0;
  padding: 0;
  margin: 0;
  width: 100%;
  display: block;
  background: #000;
  cursor: zoom-in;
}
.personal-v88-grid .gallery-item img {
  display: block;
  width: 100%;
  height: auto;
  max-width: none;
  filter: brightness(.91) contrast(1.025) saturate(.96);
  transition: transform .55s cubic-bezier(.2,.8,.2,1), filter .3s ease;
}
.personal-v88-grid .gallery-item:hover img {
  transform: scale(1.012);
  filter: brightness(1) contrast(1.02) saturate(1);
}
.personal-v88-grid .gallery-item::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .46;
  background: linear-gradient(180deg, transparent 58%, rgba(0,0,0,.66));
  transition: opacity .3s ease;
}
.personal-v88-grid .gallery-item:hover::after { opacity: .22; }
.personal-v88-grid figcaption {
  position: absolute;
  z-index: 2;
  left: 13px;
  bottom: 12px;
  display: flex;
  align-items: center;
  gap: 9px;
  color: rgba(243,240,232,.48);
  font-size: 8px;
  line-height: 1.2;
}
.personal-v88-grid figcaption span { color: rgba(243,240,232,.25); }
.personal-v88-grid figcaption em { font-style: normal; color: rgba(243,240,232,.48); }

/* Works v88 */
.works-v88 {
  background: #000;
}
.works-v88-main {
  background:
    radial-gradient(ellipse at 34% 8%, rgba(255,255,255,.04), transparent 28vw),
    linear-gradient(180deg, #000 0%, #020202 52%, #000 100%);
}
.works-v88-intro {
  width: min(1380px, 92vw);
  margin: 0 auto;
  padding: calc(var(--header-h) + clamp(34px, 6vh, 78px)) 0 clamp(36px, 6vh, 72px);
  display: grid;
  grid-template-columns: minmax(120px, 180px) minmax(210px, 340px) minmax(360px, 670px);
  gap: clamp(22px, 4vw, 72px);
  align-items: baseline;
  border-bottom: 1px solid rgba(243,240,232,.075);
}
.works-v88-intro h1 {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .18em;
  font-weight: 600;
  color: rgba(243,240,232,.9);
  font-size: clamp(16px, 1.45vw, 24px);
  line-height: 1.2;
  white-space: nowrap;
}
.works-v88-intro p {
  margin: 0;
  color: rgba(243,240,232,.52);
  font-size: clamp(12px, .82vw, 14px);
  line-height: 1.65;
  max-width: 650px;
}
.works-v88-layout {
  width: min(1380px, 92vw);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(130px, 180px) minmax(0, 1fr);
  gap: clamp(26px, 4.6vw, 72px);
  align-items: start;
}
.works-v88-rail {
  position: sticky;
  top: calc(var(--header-h) + 28px);
  min-height: calc(100svh - var(--header-h) - 56px);
  padding-top: clamp(46px, 9vh, 94px);
  border-right: 1px solid rgba(243,240,232,.075);
  color: rgba(243,240,232,.44);
}
.works-v88-rail p {
  margin: 0 0 24px;
  color: rgba(243,240,232,.25);
  font-size: 8px;
}
.works-v88-rail a {
  display: block;
  max-width: 150px;
  margin: 0 0 20px;
  font-size: 9px;
  line-height: 1.35;
  letter-spacing: .14em;
  transition: color .22s ease, transform .22s ease;
}
.works-v88-rail a span {
  display: block;
  margin-bottom: 7px;
  color: rgba(243,240,232,.22);
}
.works-v88-rail a:hover {
  color: rgba(243,240,232,.88);
  transform: translateX(4px);
}
.works-v88-content {
  min-width: 0;
}
.works-v88-case {
  padding: clamp(46px, 8vh, 96px) 0 clamp(86px, 14vh, 170px);
  border-bottom: 1px solid rgba(243,240,232,.075);
  scroll-margin-top: calc(var(--header-h) + 28px);
}
.works-v88-case-head {
  display: grid;
  grid-template-columns: 52px minmax(230px, 360px) minmax(320px, 640px);
  gap: clamp(20px, 3vw, 54px);
  align-items: end;
  margin-bottom: clamp(22px, 4.5vh, 52px);
}
.works-v88-case-number {
  color: rgba(243,240,232,.22);
  font-size: 9px;
  line-height: 1.3;
  padding-bottom: .35em;
}
.works-v88 .case-meta {
  margin: 0 0 12px;
  color: rgba(243,240,232,.34);
  font-size: 8.5px;
  font-weight: 600;
  line-height: 1.4;
}
.works-v88-case-head h2 {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .16em;
  font-weight: 600;
  color: rgba(243,240,232,.88);
  font-size: clamp(15px, 1.28vw, 22px);
  line-height: 1.22;
  margin: 0;
}
.works-v88 .case-desc {
  margin: 0;
  color: rgba(243,240,232,.50);
  font-size: clamp(12px, .82vw, 14px);
  line-height: 1.65;
  max-width: 650px;
}
.works-v88 figure {
  margin: 0;
  position: relative;
  overflow: hidden;
  background: #050505;
}
.works-v88-hero {
  height: min(62vh, 720px);
  min-height: 420px;
}
.works-v88-hero.contained img { object-fit: contain; background: #000; }
.works-v88 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  filter: brightness(.92) contrast(1.03) saturate(.95);
  transition: transform .65s cubic-bezier(.2,.8,.2,1), filter .35s ease;
}
.works-v88 figure:hover img {
  transform: scale(1.008);
  filter: brightness(1) contrast(1.02) saturate(1);
}
.works-v88 figcaption {
  position: absolute;
  z-index: 2;
  left: clamp(14px, 1.8vw, 28px);
  bottom: clamp(12px, 1.8vw, 24px);
  color: rgba(243,240,232,.52);
  font-size: 8px;
  line-height: 1.25;
}
.works-v88-gallery,
.works-v88-mosaic {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(8px, .8vw, 14px);
  margin-top: clamp(8px, .8vw, 14px);
}
.works-v88-gallery figure {
  grid-column: span 6;
  height: clamp(300px, 34vw, 540px);
}
.works-v88-gallery figure.wide {
  grid-column: span 12;
  height: clamp(320px, 45vw, 720px);
}
.works-v88-mosaic figure {
  grid-column: span 4;
  height: clamp(280px, 30vw, 500px);
}
.works-v88-mosaic figure.large {
  grid-column: span 7;
  height: clamp(360px, 44vw, 680px);
}
.works-v88-mosaic figure.wide {
  grid-column: span 8;
  height: clamp(280px, 33vw, 560px);
}
.works-v88-mosaic figure.tall {
  grid-column: span 5;
  height: clamp(440px, 52vw, 760px);
}

@media (max-width: 980px) {
  .personal-v88-hero {
    min-height: 0;
    padding: calc(var(--header-h) + 18px) 16px 32px;
    display: block;
  }
  .personal-v88-hero-media {
    height: auto;
    min-height: 0;
  }
  .personal-v88-hero-media img {
    width: 100%;
    height: auto;
  }
  .personal-v88-hero-note {
    padding: 22px 0 0;
  }
  .personal-v88-hero-note p:not(.eyebrow) {
    max-width: 100%;
  }
  .personal-v88-intro,
  .personal-v88-section-head,
  .works-v88-intro,
  .works-v88-case-head {
    width: auto;
    display: block;
  }
  .personal-v88-intro {
    padding: 28px 18px 42px;
  }
  .personal-v88-intro h1,
  .personal-v88-section-head h2,
  .works-v88-intro h1,
  .works-v88-case-head h2 {
    margin: 12px 0 14px;
    white-space: normal;
    font-size: 14px;
  }
  .personal-v88-gallery-section {
    width: calc(100% - 24px);
    padding-bottom: 90px;
  }
  .adaptive-gallery.personal-v88-grid {
    grid-template-columns: 1fr;
    display: block;
  }
  .personal-v88-grid .gallery-item {
    margin-bottom: 10px;
  }
  .personal-v88-grid .gallery-item.is-landscape {
    grid-column: auto;
  }
  .works-v88-intro {
    padding: calc(var(--header-h) + 26px) 18px 34px;
  }
  .works-v88-layout {
    width: 100%;
    display: block;
  }
  .works-v88-rail {
    position: sticky;
    top: var(--header-h);
    z-index: 20;
    min-height: 0;
    padding: 11px 18px;
    border-right: 0;
    border-top: 1px solid rgba(243,240,232,.08);
    border-bottom: 1px solid rgba(243,240,232,.08);
    display: flex;
    gap: 18px;
    overflow-x: auto;
    background: rgba(0,0,0,.78);
    backdrop-filter: blur(12px);
    scrollbar-width: none;
  }
  .works-v88-rail::-webkit-scrollbar { display: none; }
  .works-v88-rail p { display: none; }
  .works-v88-rail a {
    flex: 0 0 auto;
    margin: 0;
    max-width: none;
    white-space: nowrap;
  }
  .works-v88-rail a span { display: inline-block; margin: 0 8px 0 0; }
  .works-v88-content {
    width: calc(100% - 24px);
    margin: 0 auto;
  }
  .works-v88-case {
    padding: 48px 0 82px;
  }
  .works-v88-case-number { display: none; }
  .works-v88-hero {
    height: auto;
    min-height: 0;
    aspect-ratio: 21 / 9;
  }
  .works-v88-gallery,
  .works-v88-mosaic {
    display: block;
  }
  .works-v88-gallery figure,
  .works-v88-gallery figure.wide,
  .works-v88-mosaic figure,
  .works-v88-mosaic figure.large,
  .works-v88-mosaic figure.wide,
  .works-v88-mosaic figure.tall {
    height: auto;
    aspect-ratio: 21 / 9;
    margin-top: 10px;
  }
  .works-v88-mosaic figure.tall {
    aspect-ratio: 4 / 5;
  }
  .works-v88-gallery img,
  .works-v88-mosaic img {
    position: absolute;
    inset: 0;
  }
}

/* v89 — pro layout tuning for Works + Personal Art
   Goal: same structure, cleaner spatial rhythm, stronger left-side use, more deliberate Personal Art hero/gallery. */

/* ---------- WORKS: stronger layout grid, rail moved left, larger case titles ---------- */
.works-v88-main {
  background:
    radial-gradient(ellipse at 22% 6%, rgba(255,255,255,.032), transparent 30vw),
    linear-gradient(180deg, #000 0%, #020202 48%, #000 100%);
}

.works-v88-intro,
.works-v88-layout {
  width: min(1640px, 96vw);
}

.works-v88-intro {
  padding: calc(var(--header-h) + clamp(26px, 4.6vh, 58px)) 0 clamp(28px, 5vh, 58px);
  grid-template-columns: minmax(110px, 180px) minmax(260px, 420px) minmax(520px, 760px);
  gap: clamp(28px, 5vw, 92px);
}

.works-v88-intro h1 {
  font-size: clamp(18px, 1.75vw, 30px);
  letter-spacing: .20em;
}

.works-v88-layout {
  grid-template-columns: minmax(210px, 270px) minmax(0, 1fr);
  gap: clamp(34px, 5.2vw, 96px);
}

.works-v88-rail {
  padding-top: clamp(54px, 10vh, 118px);
  padding-left: 0;
  border-right-color: rgba(243,240,232,.055);
}

.works-v88-rail p {
  margin-bottom: 30px;
}

.works-v88-rail a {
  max-width: 210px;
  margin-bottom: 25px;
  font-size: 10px;
  letter-spacing: .16em;
  color: rgba(243,240,232,.50);
}

.works-v88-rail a span {
  margin-bottom: 8px;
}

.works-v88-case {
  padding: clamp(58px, 9vh, 112px) 0 clamp(96px, 15vh, 184px);
}

.works-v88-case-head {
  grid-template-columns: minmax(160px, 240px) minmax(300px, 470px) minmax(420px, 700px);
  gap: clamp(28px, 4.5vw, 78px);
  align-items: end;
  margin-bottom: clamp(28px, 5vh, 62px);
}

.works-v88-case-number {
  font-size: 10px;
  color: rgba(243,240,232,.26);
}

.works-v88 .case-meta {
  margin-bottom: 14px;
  font-size: 9px;
  color: rgba(243,240,232,.36);
}

.works-v88-case-head h2 {
  font-size: clamp(24px, 2.35vw, 42px);
  letter-spacing: .18em;
  line-height: 1.04;
  color: rgba(243,240,232,.92);
}

.works-v88 .case-desc {
  align-self: end;
  max-width: 680px;
  color: rgba(243,240,232,.52);
}

.works-v88-hero {
  height: min(68vh, 780px);
  min-height: 470px;
}

.works-v88-gallery,
.works-v88-mosaic {
  gap: clamp(10px, .9vw, 18px);
  margin-top: clamp(10px, .9vw, 18px);
}

/* ---------- PERSONAL ART: quieter title, better hero rhythm, true adaptive masonry ---------- */
.personal-v88-main {
  background:
    radial-gradient(ellipse at 74% 6%, rgba(255,255,255,.032), transparent 25vw),
    linear-gradient(180deg, #000 0%, #010101 58%, #000 100%);
}

.personal-v88-hero {
  width: min(1640px, 96vw);
  margin: 0 auto;
  min-height: 0;
  padding: calc(var(--header-h) + clamp(14px, 2.2vh, 30px)) 0 0;
  display: block;
  overflow: visible;
}

.personal-v88-hero::before {
  display: none;
}

.personal-v88-hero-media {
  width: 100%;
  height: clamp(430px, 64svh, 710px);
  max-height: 760px;
  background: #000;
  overflow: hidden;
  position: relative;
}

.personal-v88-hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.14) 0%, transparent 36%, transparent 61%, rgba(0,0,0,.44) 100%),
    linear-gradient(180deg, rgba(0,0,0,.07) 0%, transparent 50%, rgba(0,0,0,.42) 100%);
}

.personal-v88-hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 46%;
  filter: brightness(.96) contrast(1.02) saturate(.98);
}

.personal-v88-hero-note {
  position: absolute;
  right: clamp(32px, 6vw, 112px);
  bottom: clamp(30px, 7vh, 80px);
  z-index: 3;
  width: min(360px, 28vw);
  padding: 0;
}

.personal-v88-hero-note .eyebrow {
  margin: 0 0 12px;
  font-size: 9px;
  color: rgba(243,240,232,.40);
}

.personal-v88-hero-note h2 {
  font-size: clamp(22px, 2.25vw, 42px);
  letter-spacing: .20em;
  color: rgba(243,240,232,.92);
  margin: 0 0 13px;
}

.personal-v88-hero-note p:not(.eyebrow) {
  max-width: 360px;
  font-size: clamp(12px, .82vw, 14px);
  line-height: 1.65;
  color: rgba(243,240,232,.58);
}

.personal-v88-intro,
.personal-v88-section-head,
.personal-v88-gallery-section {
  width: min(1500px, 92vw);
}

.personal-v88-intro {
  padding: clamp(24px, 4.4vh, 54px) 0 clamp(42px, 7vh, 86px);
  grid-template-columns: minmax(110px, 170px) minmax(290px, 430px) minmax(460px, 720px);
  gap: clamp(28px, 5vw, 92px);
  border-top: 0;
}

.personal-v88-intro h1 {
  font-size: clamp(16px, 1.55vw, 27px);
  letter-spacing: .19em;
  white-space: nowrap;
}

.personal-v88-intro p {
  max-width: 680px;
}

.personal-v88-gallery-section {
  padding-bottom: clamp(105px, 16vh, 190px);
}

.personal-v88-section-head {
  grid-template-columns: minmax(110px, 170px) minmax(220px, 330px) minmax(460px, 680px);
  gap: clamp(28px, 5vw, 92px);
  margin-bottom: clamp(22px, 4.4vh, 48px);
}

.personal-v88-section-head h2 {
  font-size: clamp(15px, 1.25vw, 22px);
  letter-spacing: .18em;
}

.adaptive-gallery.personal-v88-grid {
  display: block;
  columns: 3 280px;
  column-gap: clamp(10px, .9vw, 16px);
  background: #000;
}

.personal-v88-grid .gallery-item,
.personal-v88-grid .gallery-item.is-landscape,
.personal-v88-grid .gallery-item.is-portrait {
  display: inline-block;
  width: 100%;
  grid-column: auto;
  grid-row-end: auto !important;
  margin: 0 0 clamp(10px, .9vw, 16px);
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  background: #020202;
}

.personal-v88-grid .gallery-item button {
  height: auto;
}

.personal-v88-grid .gallery-item img {
  width: 100%;
  height: auto;
  object-fit: contain;
  filter: brightness(.92) contrast(1.018) saturate(.96);
}

.personal-v88-grid figcaption {
  opacity: .55;
  left: 12px;
  bottom: 11px;
}

.personal-v88-grid .gallery-item:hover figcaption {
  opacity: .9;
}

@media (max-width: 980px) {
  .works-v88-intro,
  .works-v88-layout,
  .personal-v88-hero,
  .personal-v88-intro,
  .personal-v88-gallery-section,
  .personal-v88-section-head {
    width: auto;
  }
  .works-v88-case-head {
    grid-template-columns: none;
  }
  .works-v88-case-head h2 {
    font-size: 18px;
    letter-spacing: .16em;
  }
  .works-v88-rail {
    padding-left: 18px;
  }
  .personal-v88-hero {
    padding: calc(var(--header-h) + 14px) 12px 0;
  }
  .personal-v88-hero-media {
    height: auto;
  }
  .personal-v88-hero-media img {
    height: auto;
    object-fit: contain;
  }
  .personal-v88-hero-note {
    position: relative;
    right: auto;
    bottom: auto;
    width: auto;
    padding: 18px 6px 0;
  }
  .personal-v88-hero-note h2 {
    font-size: 17px;
  }
  .personal-v88-hero-note p:not(.eyebrow) {
    display: block;
  }
  .personal-v88-intro {
    padding: 24px 18px 42px;
  }
  .personal-v88-intro h1,
  .personal-v88-section-head h2 {
    font-size: 16px;
    white-space: normal;
  }
  .personal-v88-gallery-section {
    width: calc(100% - 24px);
  }
  .adaptive-gallery.personal-v88-grid {
    columns: 1;
  }
}

/* v90 — layout correction pass requested after v89.
   Push Works rail to real page edge, left-align case titles, simplify Personal Art structure,
   and make homepage lower entries point to the actual sections instead of generic placeholders. */

/* TOP NAV: tighter left brand row after Twój K. / Works swap */
.brand-cluster {
  gap: clamp(18px, 2.35vw, 32px);
}

/* HOME: make lower entries read as real section doors */
.home-duo-panel img[src*="personal-lajkonik"] {
  object-position: center 42%;
}
.home-duo-panel img[src*="personal-water-env"] {
  object-position: center center;
}

/* WORKS v90 */
.works-v88-intro,
.works-v88-layout {
  width: 100%;
  max-width: none;
  padding-left: clamp(28px, 3.6vw, 70px);
  padding-right: clamp(28px, 4vw, 82px);
}

.works-v88-intro {
  display: grid;
  grid-template-columns: minmax(190px, 260px) minmax(260px, 420px) minmax(430px, 760px);
  gap: clamp(30px, 4.4vw, 76px);
  align-items: baseline;
}

.works-v88-layout {
  grid-template-columns: minmax(190px, 260px) minmax(0, 1fr);
  gap: clamp(30px, 4.4vw, 76px);
}

.works-v88-rail {
  padding-top: clamp(44px, 8vh, 96px);
  padding-right: 28px;
  border-right: 1px solid rgba(243,240,232,.06);
}

.works-v88-rail p,
.works-v88-rail a span,
.works-v88-case-number {
  display: none !important;
}

.works-v88-rail a {
  max-width: none;
  margin-bottom: 22px;
  color: rgba(243,240,232,.48);
  font-size: 10px;
  letter-spacing: .15em;
}

.works-v88-content {
  max-width: 1280px;
  min-width: 0;
}

.works-v88-case-head {
  display: grid;
  grid-template-columns: minmax(320px, 470px) minmax(420px, 720px);
  gap: clamp(34px, 5vw, 86px);
  align-items: end;
  margin-bottom: clamp(28px, 5vh, 58px);
}

.works-v88-case-head h2 {
  text-align: left;
  font-size: clamp(30px, 2.75vw, 54px);
  letter-spacing: .15em;
  line-height: 1.03;
}

.works-v88 .case-meta {
  margin-bottom: 16px;
}

.works-v88 .case-desc {
  max-width: 720px;
}

.works-v88-hero {
  height: min(68vh, 790px);
  min-height: 480px;
}

/* PERSONAL ART v90: intro first, hero image uncropped, cleaner gallery block */
.personal-v88-main {
  background:
    radial-gradient(ellipse at 68% 8%, rgba(255,255,255,.028), transparent 28vw),
    linear-gradient(180deg, #000 0%, #010101 60%, #000 100%);
}

.personal-v88-intro {
  width: 100%;
  max-width: none;
  padding: calc(var(--header-h) + clamp(28px, 5vh, 62px)) clamp(28px, 3.8vw, 72px) clamp(28px, 5vh, 56px);
  margin: 0;
  display: grid;
  grid-template-columns: minmax(260px, 420px) minmax(420px, 720px);
  gap: clamp(34px, 5vw, 92px);
  align-items: baseline;
  border: 0;
}

.personal-v88-intro .section-kicker {
  display: none;
}

.personal-v88-intro h1 {
  grid-column: 1;
  font-size: clamp(22px, 2.25vw, 42px);
  letter-spacing: .15em;
  line-height: 1.05;
  white-space: nowrap;
  text-align: left;
}

.personal-v88-intro p {
  grid-column: 2;
  max-width: 720px;
  margin: 0;
  color: rgba(243,240,232,.52);
}

.personal-v88-hero {
  width: calc(100% - clamp(56px, 7.6vw, 144px));
  max-width: 1500px;
  margin: 0 auto clamp(52px, 8vh, 96px);
  min-height: 0;
  padding: 0;
  display: block;
  overflow: visible;
}

.personal-v88-hero-media {
  width: 100%;
  height: auto;
  max-height: none;
  display: block;
  background: #000;
  overflow: visible;
  position: relative;
}

.personal-v88-hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.07) 0%, transparent 34%, transparent 68%, rgba(0,0,0,.34) 100%),
    linear-gradient(180deg, rgba(0,0,0,.04) 0%, transparent 58%, rgba(0,0,0,.30) 100%);
}

.personal-v88-hero-media img {
  width: 100%;
  height: auto;
  max-height: min(74svh, 780px);
  object-fit: contain;
  object-position: center center;
  filter: brightness(.96) contrast(1.018) saturate(.98);
  background: #000;
}

.personal-v88-hero-note {
  position: absolute;
  right: clamp(22px, 4.5vw, 76px);
  bottom: clamp(22px, 4.6vw, 74px);
  z-index: 3;
  width: min(380px, 30vw);
  padding: 0;
}

.personal-v88-hero-note .eyebrow {
  display: none;
}

.personal-v88-hero-note h2 {
  margin: 0 0 12px;
  font-size: clamp(24px, 2.45vw, 48px);
  letter-spacing: .17em;
  line-height: 1.05;
}

.personal-v88-hero-note p:not(.eyebrow) {
  max-width: 360px;
  color: rgba(243,240,232,.57);
}

.personal-v88-gallery-section {
  width: 100%;
  max-width: none;
  padding: 0 clamp(28px, 3.8vw, 72px) clamp(105px, 16vh, 190px);
  margin: 0;
}

.personal-v88-section-head {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(260px, 420px) minmax(420px, 720px);
  gap: clamp(34px, 5vw, 92px);
  align-items: baseline;
  margin: 0 0 clamp(24px, 4vh, 46px);
}

.personal-v88-section-head .section-kicker {
  display: none;
}

.personal-v88-section-head h2 {
  grid-column: 1;
  font-size: clamp(19px, 1.8vw, 32px);
  letter-spacing: .15em;
  line-height: 1.05;
  text-align: left;
}

.personal-v88-section-head p {
  grid-column: 2;
  max-width: 720px;
  color: rgba(243,240,232,.48);
}

.adaptive-gallery.personal-v88-grid {
  columns: 3 300px;
  column-gap: clamp(10px, .95vw, 18px);
  width: 100%;
}

.personal-v88-grid .gallery-item {
  margin-bottom: clamp(10px, .95vw, 18px);
  background: #000;
}

.personal-v88-grid figcaption span {
  display: none;
}

/* Less random labels, more exhibition-like */
.personal-v88-grid figcaption {
  opacity: .50;
}

/* Mobile keeps the simpler stacked version. */
@media (max-width: 980px) {
  .works-v88-intro,
  .works-v88-layout,
  .personal-v88-intro,
  .personal-v88-gallery-section,
  .personal-v88-section-head {
    width: auto;
    max-width: none;
    padding-left: 18px;
    padding-right: 18px;
  }

  .works-v88-intro,
  .works-v88-layout,
  .works-v88-case-head,
  .personal-v88-intro,
  .personal-v88-section-head {
    display: block;
  }

  .works-v88-rail {
    padding: 10px 18px;
  }

  .works-v88-content {
    max-width: none;
    width: calc(100% - 24px);
    margin: 0 auto;
  }

  .works-v88-case-head h2 {
    font-size: 18px;
  }

  .works-v88-hero {
    height: auto;
    min-height: 0;
    aspect-ratio: 21 / 9;
  }

  .personal-v88-intro {
    padding-top: calc(var(--header-h) + 26px);
    padding-bottom: 28px;
  }

  .personal-v88-intro h1,
  .personal-v88-section-head h2 {
    font-size: 17px;
    white-space: normal;
    margin: 0 0 16px;
  }

  .personal-v88-hero {
    width: calc(100% - 24px);
    margin-bottom: 42px;
  }

  .personal-v88-hero-media img {
    max-height: none;
  }

  .personal-v88-hero-note {
    position: relative;
    right: auto;
    bottom: auto;
    width: auto;
    padding: 18px 0 0;
  }

  .personal-v88-hero-note h2 {
    font-size: 18px;
  }

  .adaptive-gallery.personal-v88-grid {
    columns: 1;
  }
}

/* v91 — rebuild Works + Personal Art layout after v90.
   Intent: keep the same content structure, but restore a professional editorial rhythm:
   centered content, a small sticky works index on the far-left side, no random scattered labels,
   and Personal Art as a clean exhibition page rather than a pasted image sheet. */

/* shared title language for the portfolio pages */
.works-v91 .works-v91-kicker,
.works-v91 .works-v91-meta,
.works-v91 figcaption,
.personal-v91 .personal-v91-intro h1,
.personal-v91 .personal-v91-section-head h2,
.personal-v91 .personal-v91-hero-note h2 {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .17em;
}

/* hide old v88/v90 content rules from affecting the rebuilt structure */
.works-v91 .works-v88-main,
.personal-v91 .personal-v88-main { display: none !important; }

/* ---------------- WORKS v91 ---------------- */
.works-v91-main {
  min-height: 100vh;
  padding-bottom: clamp(90px, 14vh, 180px);
  background:
    radial-gradient(ellipse at 50% 0%, rgba(255,255,255,.032), transparent 34vw),
    linear-gradient(180deg, #000 0%, #020202 48%, #000 100%);
}

.works-v91-intro {
  width: min(1380px, calc(100vw - 112px));
  margin: 0 auto;
  padding: calc(var(--header-h) + clamp(30px, 5vh, 70px)) 0 clamp(42px, 6vh, 78px);
  display: grid;
  grid-template-columns: minmax(150px, 220px) minmax(260px, 390px) minmax(430px, 680px);
  gap: clamp(34px, 5.6vw, 108px);
  align-items: baseline;
  border-bottom: 1px solid rgba(243,240,232,.07);
}

.works-v91-kicker {
  margin: 0;
  font-size: 9px;
  color: rgba(243,240,232,.32);
}

.works-v91-intro h1 {
  margin: 0;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: clamp(22px, 2.05vw, 38px);
  line-height: 1;
  color: rgba(243,240,232,.91);
}

.works-v91-intro p:not(.works-v91-kicker) {
  margin: 0;
  max-width: 650px;
  color: rgba(243,240,232,.52);
  font-size: clamp(12px, .82vw, 14px);
  line-height: 1.65;
}

.works-v91-layout {
  width: min(1380px, calc(100vw - 112px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr);
  gap: clamp(64px, 7vw, 132px);
}

.works-v91-rail {
  position: sticky;
  top: calc(var(--header-h) + 66px);
  align-self: start;
  padding-top: clamp(76px, 11vh, 132px);
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: 9px;
  line-height: 1.6;
  color: rgba(243,240,232,.30);
}

.works-v91-rail a {
  display: block;
  margin-bottom: 18px;
  color: rgba(243,240,232,.38);
  transition: color .22s ease, transform .22s ease;
}

.works-v91-rail a:hover {
  color: rgba(243,240,232,.86);
  transform: translateX(4px);
}

.works-v91-content {
  width: min(100%, 1120px);
  margin: 0 auto;
}

.works-v91-case {
  padding: clamp(78px, 11vh, 138px) 0 clamp(98px, 16vh, 190px);
  border-bottom: 1px solid rgba(243,240,232,.065);
}

.works-v91-case:last-child { border-bottom: 0; }

.works-v91-case-head {
  display: grid;
  grid-template-columns: minmax(320px, 480px) minmax(330px, 520px);
  gap: clamp(38px, 6vw, 96px);
  align-items: end;
  margin: 0 0 clamp(34px, 5vh, 64px);
}

.works-v91-meta {
  margin: 0 0 15px;
  font-size: 9px;
  color: rgba(243,240,232,.34);
}

.works-v91-case-head h2 {
  margin: 0;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .17em;
  font-size: clamp(31px, 3vw, 58px);
  line-height: 1.04;
  color: rgba(243,240,232,.92);
}

.works-v91-desc {
  margin: 0;
  max-width: 520px;
  color: rgba(243,240,232,.54);
  font-size: clamp(12px, .84vw, 14px);
  line-height: 1.66;
}

.works-v91 figure {
  margin: 0;
  position: relative;
  background: #000;
  overflow: hidden;
}

.works-v91 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(.92) contrast(1.02) saturate(.96);
  transition: filter .35s ease, transform .55s ease;
}

.works-v91 figure:hover img {
  filter: brightness(1) contrast(1.035) saturate(1);
  transform: scale(1.012);
}

.works-v91 figcaption {
  position: absolute;
  left: 18px;
  bottom: 16px;
  z-index: 2;
  font-size: 8px;
  color: rgba(243,240,232,.45);
  pointer-events: none;
}

.works-v91-hero {
  height: min(70vh, 760px);
  min-height: 440px;
}

.works-v91-hero-contained img {
  object-fit: contain;
  background: #000;
}

.works-v91-gallery,
.works-v91-mosaic {
  display: grid;
  gap: clamp(10px, .85vw, 16px);
  margin-top: clamp(10px, .85vw, 16px);
}

.works-v91-gallery-a,
.works-v91-gallery-b {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.works-v91-gallery figure { min-height: 360px; }
.works-v91-gallery figure.wide { grid-column: 1 / -1; height: min(48vh, 520px); }

.works-v91-mosaic {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-rows: clamp(140px, 15vw, 240px);
}
.works-v91-mosaic figure { grid-column: span 3; grid-row: span 2; }
.works-v91-mosaic figure.large { grid-column: span 4; grid-row: span 3; }
.works-v91-mosaic figure.wide { grid-column: span 6; grid-row: span 2; }
.works-v91-mosaic figure.tall { grid-column: span 2; grid-row: span 3; }

/* ---------------- PERSONAL ART v91 ---------------- */
.personal-v91-main {
  min-height: 100vh;
  padding-bottom: clamp(90px, 14vh, 180px);
  background:
    radial-gradient(ellipse at 58% 2%, rgba(255,255,255,.035), transparent 34vw),
    linear-gradient(180deg, #000 0%, #010101 54%, #000 100%);
}

.personal-v91-intro {
  width: min(1340px, calc(100vw - 112px));
  margin: 0 auto;
  padding: calc(var(--header-h) + clamp(32px, 5vh, 72px)) 0 clamp(26px, 4vh, 54px);
  display: grid;
  grid-template-columns: minmax(300px, 470px) minmax(420px, 690px);
  gap: clamp(46px, 7vw, 130px);
  align-items: baseline;
}

.personal-v91-intro h1 {
  margin: 0;
  font-size: clamp(22px, 2.05vw, 38px);
  line-height: 1.08;
  color: rgba(243,240,232,.91);
  white-space: nowrap;
}

.personal-v91-intro p {
  margin: 0;
  max-width: 670px;
  color: rgba(243,240,232,.52);
  font-size: clamp(12px, .82vw, 14px);
  line-height: 1.65;
}

.personal-v91-hero {
  width: min(1340px, calc(100vw - 112px));
  margin: 0 auto clamp(76px, 11vh, 142px);
}

.personal-v91-hero-figure {
  margin: 0;
  position: relative;
  background: #000;
  overflow: hidden;
  box-shadow: 0 40px 110px rgba(0,0,0,.48);
}

.personal-v91-hero-figure::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.10) 0%, transparent 40%, rgba(0,0,0,.38) 100%),
    linear-gradient(180deg, rgba(0,0,0,.02) 0%, transparent 60%, rgba(0,0,0,.44) 100%);
}

.personal-v91-hero-figure img {
  width: 100%;
  height: auto;
  max-height: min(74svh, 780px);
  object-fit: contain;
  background: #000;
  filter: brightness(.95) contrast(1.018) saturate(.98);
}

.personal-v91-hero-note {
  position: absolute;
  z-index: 2;
  right: clamp(28px, 5vw, 86px);
  bottom: clamp(26px, 5vw, 76px);
  width: min(390px, 34vw);
}

.personal-v91-hero-note h2 {
  margin: 0 0 12px;
  font-size: clamp(26px, 2.5vw, 50px);
  line-height: 1.05;
  color: rgba(243,240,232,.94);
}

.personal-v91-hero-note p {
  margin: 0;
  color: rgba(243,240,232,.60);
  font-size: clamp(12px, .82vw, 14px);
  line-height: 1.62;
}

.personal-v91-gallery-section {
  width: min(1340px, calc(100vw - 112px));
  margin: 0 auto;
}

.personal-v91-section-head {
  display: grid;
  grid-template-columns: minmax(300px, 470px) minmax(420px, 690px);
  gap: clamp(46px, 7vw, 130px);
  align-items: baseline;
  margin: 0 0 clamp(28px, 4.2vh, 54px);
}

.personal-v91-section-head h2 {
  margin: 0;
  font-size: clamp(20px, 1.75vw, 34px);
  line-height: 1.08;
  color: rgba(243,240,232,.88);
}

.personal-v91-section-head p {
  margin: 0;
  max-width: 660px;
  color: rgba(243,240,232,.48);
  font-size: clamp(12px, .8vw, 14px);
  line-height: 1.62;
}

.adaptive-gallery.personal-v91-grid {
  display: block;
  columns: 3 300px;
  column-gap: clamp(10px, .9vw, 16px);
  background: #000;
}

.personal-v91-grid .gallery-item {
  display: inline-block;
  width: 100%;
  margin: 0 0 clamp(10px, .9vw, 16px);
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  background: #000;
  position: relative;
  overflow: hidden;
}

.personal-v91-grid .gallery-item button {
  display: block;
  width: 100%;
  height: auto;
  padding: 0;
  border: 0;
  appearance: none;
  background: transparent;
  cursor: zoom-in;
}

.personal-v91-grid .gallery-item img {
  width: 100%;
  height: auto;
  object-fit: contain;
  filter: brightness(.91) contrast(1.02) saturate(.96);
  transition: filter .32s ease, transform .48s ease;
}

.personal-v91-grid .gallery-item:hover img {
  filter: brightness(1) contrast(1.035) saturate(1);
  transform: scale(1.012);
}

.personal-v91-grid figcaption { display: none !important; }

@media (max-width: 1100px) {
  .works-v91-intro,
  .works-v91-layout,
  .personal-v91-intro,
  .personal-v91-hero,
  .personal-v91-gallery-section {
    width: calc(100% - 36px);
  }
  .works-v91-intro,
  .personal-v91-intro,
  .personal-v91-section-head,
  .works-v91-case-head {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .works-v91-layout {
    display: block;
  }
  .works-v91-rail {
    position: relative;
    top: auto;
    display: flex;
    gap: 20px;
    overflow-x: auto;
    padding: 28px 0 0;
    margin-bottom: 18px;
    white-space: nowrap;
  }
  .works-v91-content { width: 100%; }
  .works-v91-case-head h2 { font-size: 25px; }
  .works-v91-hero { min-height: 260px; height: auto; }
  .works-v91-hero img { height: auto; object-fit: contain; }
  .works-v91-gallery,
  .works-v91-gallery-a,
  .works-v91-gallery-b,
  .works-v91-mosaic {
    display: block;
  }
  .works-v91-gallery figure,
  .works-v91-gallery figure.wide,
  .works-v91-mosaic figure,
  .works-v91-mosaic figure.large,
  .works-v91-mosaic figure.wide,
  .works-v91-mosaic figure.tall {
    height: auto;
    min-height: 0;
    margin-bottom: 12px;
  }
  .works-v91-gallery img,
  .works-v91-mosaic img { height: auto; object-fit: contain; }
  .personal-v91-hero-note {
    position: relative;
    right: auto;
    bottom: auto;
    width: auto;
    padding: 18px 2px 0;
  }
  .personal-v91-hero-figure::after { display: none; }
  .adaptive-gallery.personal-v91-grid { columns: 1; }
}

/* v92 — full rebuild of Works + Personal Art only.
   Direction: Works as a professional production archive / case-study system;
   Personal Art as a clean black exhibition with a masonry gallery. Homepage, Twój K. and Contact are untouched. */

.works-v92,
.personal-v92 {
  background: #000;
}

.works-v92-main,
.personal-v92-main {
  min-height: 100vh;
  background:
    radial-gradient(ellipse 80vw 28vh at 50% -4%, rgba(243,240,232,.032), transparent 70%),
    linear-gradient(180deg, #000 0%, #020202 46%, #000 100%);
}

.works-v92-kicker,
.works-v92-meta,
.works-v92-facts,
.works-v92 figcaption,
.personal-v92-intro h1,
.personal-v92-feature-caption,
.personal-v92-gallery-section h2 {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .16em;
}

/* ---------------- WORKS v92 ---------------- */
.works-v92-rail {
  position: fixed;
  z-index: 16;
  left: clamp(22px, 3.2vw, 64px);
  top: 36vh;
  display: grid;
  gap: 18px;
  width: 150px;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: 9px;
  line-height: 1.45;
  color: rgba(243,240,232,.32);
}

.works-v92-rail::before {
  content: "";
  width: 28px;
  height: 1px;
  margin-bottom: 2px;
  background: rgba(243,240,232,.22);
}

.works-v92-rail a {
  color: rgba(243,240,232,.38);
  transition: color .22s ease, transform .22s ease;
}

.works-v92-rail a:hover {
  color: rgba(243,240,232,.92);
  transform: translateX(5px);
}

.works-v92-intro,
.works-v92-content {
  width: min(1120px, calc(100vw - 260px));
  margin: 0 auto;
}

.works-v92-intro {
  padding: calc(var(--header-h) + clamp(44px, 7.5vh, 92px)) 0 clamp(52px, 8vh, 96px);
  display: grid;
  grid-template-columns: minmax(240px, 420px) minmax(380px, 1fr);
  gap: clamp(44px, 7vw, 120px);
  align-items: end;
  border-bottom: 1px solid rgba(243,240,232,.075);
}

.works-v92-kicker {
  margin: 0 0 15px;
  color: rgba(243,240,232,.34);
  font-size: 9px;
}

.works-v92-intro h1 {
  margin: 0;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .17em;
  font-size: clamp(30px, 3.3vw, 58px);
  line-height: 1;
  color: rgba(243,240,232,.93);
}

.works-v92-intro-copy {
  margin: 0;
  max-width: 660px;
  color: rgba(243,240,232,.55);
  font-size: clamp(12px, .86vw, 14px);
  line-height: 1.68;
}

.works-v92-case {
  padding: clamp(86px, 13vh, 162px) 0 clamp(110px, 16vh, 198px);
  border-bottom: 1px solid rgba(243,240,232,.07);
}
.works-v92-case:last-child { border-bottom: 0; }

.works-v92-case-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 330px);
  gap: clamp(42px, 6vw, 92px);
  align-items: end;
  margin-bottom: clamp(20px, 3.5vh, 36px);
}

.works-v92-meta {
  margin: 0 0 16px;
  color: rgba(243,240,232,.36);
  font-size: 9px;
}

.works-v92-titleblock h2 {
  margin: 0;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: clamp(42px, 5.4vw, 86px);
  line-height: .96;
  color: rgba(243,240,232,.93);
}

.works-v92-facts {
  margin: 0;
  display: grid;
  gap: 18px;
  padding-top: 8px;
}

.works-v92-facts div {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: 18px;
  align-items: baseline;
  border-top: 1px solid rgba(243,240,232,.08);
  padding-top: 12px;
}

.works-v92-facts dt {
  color: rgba(243,240,232,.30);
  font-size: 8px;
}

.works-v92-facts dd {
  margin: 0;
  color: rgba(243,240,232,.58);
  font-size: 9px;
  line-height: 1.55;
}

.works-v92-desc {
  margin: 0 0 clamp(34px, 5vh, 64px);
  width: min(650px, 72%);
  color: rgba(243,240,232,.56);
  font-size: clamp(12px, .86vw, 14px);
  line-height: 1.72;
}

.works-v92 figure {
  margin: 0;
  position: relative;
  overflow: hidden;
  background: #000;
}

.works-v92 img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(.90) contrast(1.035) saturate(.95);
  transition: filter .38s ease, transform .7s cubic-bezier(.16,1,.3,1);
}

.works-v92 figure:hover img {
  filter: brightness(1) contrast(1.045) saturate(1);
  transform: scale(1.014);
}

.works-v92 figcaption {
  position: absolute;
  left: 18px;
  bottom: 16px;
  z-index: 2;
  color: rgba(243,240,232,.46);
  font-size: 8px;
  line-height: 1.4;
  pointer-events: none;
}

.works-v92-hero-frame {
  height: min(73vh, 800px);
  min-height: 460px;
  box-shadow: 0 42px 110px rgba(0,0,0,.38);
}

.works-v92-hero-contained img,
.works-v92 .contain img {
  object-fit: contain;
  background: #000;
}

.works-v92-grid {
  display: grid;
  gap: clamp(10px, .88vw, 16px);
  margin-top: clamp(10px, .88vw, 16px);
}

.works-v92-grid-controlled {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.asset-card {
  min-height: clamp(280px, 31vw, 470px);
}

.asset-card.span-wide {
  grid-column: 1 / -1;
  height: min(48vh, 560px);
}

.works-v92-mosaic {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-rows: clamp(92px, 8.8vw, 150px);
  gap: clamp(10px, .88vw, 16px);
}

.works-v92-mosaic .asset-card { min-height: 0; }
.works-v92-mosaic .asset-card.large { grid-column: span 7; grid-row: span 5; }
.works-v92-mosaic .asset-card:not(.large):not(.wide):not(.tall) { grid-column: span 5; grid-row: span 3; }
.works-v92-mosaic .asset-card.wide { grid-column: span 7; grid-row: span 3; }
.works-v92-mosaic .asset-card.tall { grid-column: 8 / span 5; grid-row: span 5; }

/* ---------------- PERSONAL ART v92 ---------------- */
.personal-v92-main {
  padding-bottom: clamp(100px, 15vh, 190px);
}

.personal-v92-intro,
.personal-v92-feature,
.personal-v92-gallery-section {
  width: min(1280px, calc(100vw - 112px));
  margin: 0 auto;
}

.personal-v92-intro {
  padding: calc(var(--header-h) + clamp(38px, 6vh, 76px)) 0 clamp(28px, 4.2vh, 52px);
  display: grid;
  grid-template-columns: minmax(260px, 390px) minmax(420px, 690px);
  gap: clamp(48px, 7.6vw, 138px);
  align-items: baseline;
}

.personal-v92-intro h1 {
  margin: 0;
  color: rgba(243,240,232,.91);
  font-size: clamp(24px, 2.4vw, 42px);
  line-height: 1.05;
  white-space: nowrap;
}

.personal-v92-intro p {
  margin: 0;
  max-width: 700px;
  color: rgba(243,240,232,.54);
  font-size: clamp(12px, .86vw, 14px);
  line-height: 1.68;
}

.personal-v92-feature {
  margin-bottom: clamp(88px, 13vh, 170px);
}

.personal-v92-feature-frame {
  position: relative;
  margin: 0;
  display: grid;
  place-items: center;
  min-height: clamp(520px, 72vh, 820px);
  background:
    radial-gradient(ellipse 62% 44% at 58% 50%, rgba(243,240,232,.035), transparent 66%),
    #000;
  overflow: hidden;
  box-shadow: 0 44px 120px rgba(0,0,0,.46);
}

.personal-v92-feature-frame img {
  width: 100%;
  height: 100%;
  max-height: clamp(520px, 72vh, 820px);
  object-fit: contain;
  filter: brightness(.96) contrast(1.025) saturate(.98);
}

.personal-v92-feature-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.08), transparent 34%, transparent 66%, rgba(0,0,0,.28)),
    linear-gradient(180deg, rgba(0,0,0,.02), transparent 72%, rgba(0,0,0,.36));
}

.personal-v92-feature-caption {
  position: absolute;
  z-index: 2;
  right: clamp(26px, 5.2vw, 86px);
  bottom: clamp(28px, 5.6vw, 86px);
  text-align: left;
}

.personal-v92-feature-caption p {
  margin: 0 0 12px;
  color: rgba(243,240,232,.36);
  font-size: 8px;
}

.personal-v92-feature-caption h2 {
  margin: 0;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .15em;
  font-size: clamp(34px, 4.2vw, 76px);
  line-height: .98;
  color: rgba(243,240,232,.94);
}

.personal-v92-feature-desc {
  width: min(520px, 62%);
  margin: clamp(22px, 3.6vh, 42px) 0 0 auto;
  color: rgba(243,240,232,.54);
  font-size: clamp(12px, .84vw, 14px);
  line-height: 1.68;
}

.personal-v92-gallery-section h2 {
  margin: 0 0 clamp(26px, 4vh, 52px);
  color: rgba(243,240,232,.88);
  font-size: clamp(22px, 2.2vw, 42px);
  line-height: 1;
}

.personal-v92-masonry {
  columns: 3 270px;
  column-gap: clamp(12px, 1.1vw, 18px);
}

.personal-v92-masonry .gallery-item {
  display: inline-block;
  width: 100%;
  margin: 0 0 clamp(12px, 1.1vw, 18px);
  break-inside: avoid;
  background: #000;
  overflow: hidden;
}

.personal-v92-masonry button {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
}

.personal-v92-masonry img {
  display: block;
  width: 100%;
  height: auto;
  filter: brightness(.91) contrast(1.035) saturate(.96);
  transition: filter .32s ease, transform .55s cubic-bezier(.16,1,.3,1);
}

.personal-v92-masonry button:hover img {
  filter: brightness(1) contrast(1.04) saturate(1);
  transform: scale(1.012);
}

@media (max-width: 1180px) {
  .works-v92-rail {
    position: sticky;
    top: var(--header-h);
    left: auto;
    width: auto;
    display: flex;
    gap: 22px;
    padding: 14px 18px;
    margin: 0;
    background: rgba(0,0,0,.78);
    border-top: 1px solid rgba(243,240,232,.07);
    border-bottom: 1px solid rgba(243,240,232,.07);
    overflow-x: auto;
    white-space: nowrap;
  }
  .works-v92-rail::before { display: none; }
  .works-v92-intro,
  .works-v92-content,
  .personal-v92-intro,
  .personal-v92-feature,
  .personal-v92-gallery-section {
    width: calc(100% - 36px);
  }
  .works-v92-intro,
  .works-v92-case-head,
  .personal-v92-intro {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .works-v92-desc,
  .personal-v92-feature-desc {
    width: 100%;
    margin-left: 0;
  }
  .works-v92-hero-frame {
    min-height: 0;
    height: auto;
  }
  .works-v92-hero-frame img {
    height: auto;
    object-fit: contain;
  }
  .works-v92-grid-controlled,
  .works-v92-mosaic {
    display: block;
  }
  .asset-card,
  .asset-card.span-wide,
  .works-v92-mosaic .asset-card,
  .works-v92-mosaic .asset-card.large,
  .works-v92-mosaic .asset-card.wide,
  .works-v92-mosaic .asset-card.tall {
    height: auto;
    min-height: 0;
    margin-bottom: 12px;
  }
  .works-v92-grid img,
  .works-v92-mosaic img {
    height: auto;
    object-fit: contain;
  }
  .personal-v92-feature-frame {
    min-height: 0;
  }
  .personal-v92-feature-frame img {
    height: auto;
    max-height: none;
  }
  .personal-v92-feature-caption {
    right: 18px;
    bottom: 18px;
  }
  .personal-v92-masonry {
    columns: 2 240px;
  }
}

@media (max-width: 640px) {
  .works-v92-intro {
    padding-top: calc(var(--header-h) + 30px);
  }
  .works-v92-titleblock h2 {
    font-size: clamp(30px, 11vw, 48px);
  }
  .works-v92-facts div {
    grid-template-columns: 74px 1fr;
  }
  .works-v92-case {
    padding: 64px 0 86px;
  }
  .personal-v92-intro {
    padding-top: calc(var(--header-h) + 30px);
  }
  .personal-v92-intro h1 {
    white-space: normal;
  }
  .personal-v92-feature-caption h2 {
    font-size: clamp(30px, 12vw, 52px);
  }
  .personal-v92-masonry {
    columns: 1;
  }
}

/* v93 — Personal Art carousel + wider adaptive gallery. Homepage, Twój K., Works and Contact are untouched. */
.personal-v93 {
  background: #000;
}

.personal-v93-main {
  min-height: 100vh;
  padding-bottom: clamp(96px, 14vh, 180px);
  background:
    radial-gradient(ellipse 92vw 30vh at 50% -8%, rgba(243,240,232,.035), transparent 72%),
    linear-gradient(180deg, #000 0%, #020202 42%, #000 100%);
}

.pa93-opener {
  padding-top: calc(var(--header-h) + clamp(28px, 4.6vh, 64px));
}

.pa93-opener-copy {
  width: min(1540px, calc(100vw - clamp(44px, 7vw, 140px)));
  margin: 0 auto clamp(26px, 4.5vh, 54px);
  display: grid;
  grid-template-columns: minmax(230px, 390px) minmax(320px, 620px);
  gap: clamp(40px, 8vw, 160px);
  align-items: end;
}

.pa93-opener-copy h1,
.pa93-gallery-section h2,
.pa93-feature-kind,
.pa93-feature-title {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .155em;
}

.pa93-opener-copy h1 {
  margin: 0;
  font-size: clamp(24px, 2.25vw, 40px);
  line-height: 1;
  color: rgba(243,240,232,.92);
}

.pa93-opener-copy p {
  margin: 0 0 2px;
  max-width: 620px;
  color: rgba(243,240,232,.52);
  font-size: clamp(12px, .84vw, 14px);
  line-height: 1.66;
}

.pa93-carousel {
  position: relative;
  min-height: clamp(560px, 78vh, 900px);
  width: 100vw;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,.16) 100%),
    #000;
}

.pa93-carousel::before,
.pa93-carousel::after {
  content: "";
  position: absolute;
  z-index: 4;
  top: 0;
  bottom: 0;
  width: 25vw;
  pointer-events: none;
}

.pa93-carousel::before {
  left: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.86), rgba(0,0,0,.40) 46%, transparent);
}

.pa93-carousel::after {
  right: 0;
  background: linear-gradient(270deg, rgba(0,0,0,.86), rgba(0,0,0,.40) 46%, transparent);
}

.pa93-feature-frame {
  position: relative;
  z-index: 3;
  width: min(76vw, 1260px);
  height: clamp(500px, 74vh, 850px);
  margin: 0;
  display: grid;
  place-items: center;
  background:
    radial-gradient(ellipse 62% 48% at 50% 52%, rgba(243,240,232,.032), transparent 70%),
    #000;
  overflow: hidden;
  box-shadow: 0 48px 150px rgba(0,0,0,.70);
}

.pa93-feature-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.22), transparent 22%, transparent 70%, rgba(0,0,0,.40)),
    linear-gradient(180deg, rgba(0,0,0,.05), transparent 54%, rgba(0,0,0,.54));
}

.pa93-feature-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: brightness(.96) contrast(1.035) saturate(.98);
  transform: scale(1.001);
  transition: opacity .34s ease, transform .58s cubic-bezier(.16,1,.3,1), filter .34s ease;
}

.pa93-feature-caption {
  position: absolute;
  z-index: 6;
  right: clamp(28px, 5.2vw, 92px);
  bottom: clamp(28px, 5.4vw, 92px);
  width: min(390px, 38vw);
  color: rgba(243,240,232,.90);
  text-shadow: 0 12px 52px rgba(0,0,0,.80);
  transition: opacity .28s ease, transform .48s cubic-bezier(.16,1,.3,1);
}

.pa93-feature-kind {
  margin: 0 0 12px;
  color: rgba(243,240,232,.35);
  font-size: 8px;
}

.pa93-feature-title {
  margin: 0;
  font-size: clamp(36px, 4.4vw, 82px);
  line-height: .94;
  color: rgba(243,240,232,.95);
}

.pa93-feature-desc {
  margin: 18px 0 0;
  color: rgba(243,240,232,.56);
  font-size: clamp(11px, .78vw, 13px);
  line-height: 1.62;
}

.pa93-carousel.is-changing .pa93-feature-img {
  opacity: .30;
  transform: scale(.985);
  filter: brightness(.78) contrast(1.05) saturate(.90);
}

.pa93-carousel.is-changing .pa93-feature-caption {
  opacity: .16;
  transform: translateY(8px);
}

.pa93-side {
  appearance: none;
  border: 0;
  padding: 0;
  position: absolute;
  z-index: 2;
  top: 50%;
  width: min(28vw, 420px);
  height: min(64vh, 700px);
  transform: translateY(-50%);
  background: #000;
  overflow: hidden;
  cursor: pointer;
  opacity: .48;
  transition: opacity .32s ease, filter .32s ease, transform .48s cubic-bezier(.16,1,.3,1);
}

.pa93-side-left {
  left: 0;
  transform: translate(-15%, -50%) scale(.96);
}

.pa93-side-right {
  right: 0;
  transform: translate(15%, -50%) scale(.96);
}

.pa93-side img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(.34) contrast(1.08) saturate(.72);
  transition: filter .32s ease, transform .62s cubic-bezier(.16,1,.3,1);
}

.pa93-side::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.18), transparent 42%, rgba(0,0,0,.50)),
    linear-gradient(90deg, rgba(0,0,0,.62), transparent 50%, rgba(0,0,0,.62));
  pointer-events: none;
}

.pa93-side:hover {
  z-index: 5;
  opacity: .78;
}

.pa93-side-left:hover {
  transform: translate(-8%, -50%) scale(1.005) rotateY(-2.5deg);
}

.pa93-side-right:hover {
  transform: translate(8%, -50%) scale(1.005) rotateY(2.5deg);
}

.pa93-side:hover img {
  filter: brightness(.62) contrast(1.05) saturate(.92);
  transform: scale(1.035);
}

.pa93-arrow {
  appearance: none;
  position: absolute;
  z-index: 8;
  top: 50%;
  width: 38px;
  height: 54px;
  border: 1px solid rgba(243,240,232,.16);
  background: rgba(0,0,0,.18);
  color: rgba(243,240,232,.68);
  font-size: 31px;
  line-height: 1;
  transform: translateY(-50%);
  cursor: pointer;
  transition: color .22s ease, border-color .22s ease, background .22s ease, transform .22s ease;
}

.pa93-arrow:hover {
  color: rgba(243,240,232,.96);
  border-color: rgba(243,240,232,.34);
  background: rgba(243,240,232,.055);
}

.pa93-arrow-left { left: clamp(18px, 3vw, 56px); }
.pa93-arrow-right { right: clamp(18px, 3vw, 56px); }

.pa93-gallery-section {
  width: min(1680px, calc(100vw - clamp(28px, 4vw, 76px)));
  margin: clamp(80px, 13vh, 168px) auto 0;
}

.pa93-gallery-section h2 {
  margin: 0 0 clamp(24px, 4vh, 48px);
  font-size: clamp(23px, 2.1vw, 40px);
  line-height: 1;
  color: rgba(243,240,232,.88);
}

.pa93-gallery {
  columns: 4 240px;
  column-gap: clamp(10px, .95vw, 16px);
}

.pa93-gallery .gallery-item {
  display: inline-block;
  width: 100%;
  margin: 0 0 clamp(10px, .95vw, 16px);
  break-inside: avoid;
  background: #000;
  overflow: hidden;
}

.pa93-gallery button {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
}

.pa93-gallery img {
  display: block;
  width: 100%;
  height: auto;
  filter: brightness(.90) contrast(1.035) saturate(.96);
  transition: filter .32s ease, transform .56s cubic-bezier(.16,1,.3,1);
}

.pa93-gallery button:hover img {
  filter: brightness(1) contrast(1.04) saturate(1);
  transform: scale(1.014);
}

@media (max-width: 1180px) {
  .pa93-opener-copy {
    width: calc(100vw - 36px);
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .pa93-carousel {
    min-height: auto;
    padding: 0 0 56px;
    overflow: visible;
  }
  .pa93-carousel::before,
  .pa93-carousel::after,
  .pa93-side,
  .pa93-arrow {
    display: none;
  }
  .pa93-feature-frame {
    width: calc(100vw - 36px);
    height: auto;
    min-height: 0;
    margin: 0 auto;
  }
  .pa93-feature-img {
    height: auto;
  }
  .pa93-feature-caption {
    position: relative;
    right: auto;
    bottom: auto;
    width: 100%;
    padding: 18px 0 0;
    text-shadow: none;
  }
  .pa93-feature-frame::after {
    background: linear-gradient(180deg, transparent 64%, rgba(0,0,0,.42));
  }
  .pa93-gallery-section {
    width: calc(100vw - 36px);
    margin-top: 48px;
  }
}

@media (max-width: 720px) {
  .pa93-opener {
    padding-top: calc(var(--header-h) + 26px);
  }
  .pa93-opener-copy h1 {
    font-size: clamp(23px, 7.4vw, 34px);
  }
  .pa93-feature-title {
    font-size: clamp(30px, 10vw, 48px);
  }
  .pa93-gallery {
    columns: 2 150px;
    column-gap: 9px;
  }
  .pa93-gallery .gallery-item {
    margin-bottom: 9px;
  }
}

/* v94 — Personal Art film-strip hero + image metadata overlays. */
.personal-v94 .pa93-opener {
  padding-top: calc(var(--header-h) + clamp(26px, 4.2vh, 58px));
}

.personal-v94 .pa93-opener-copy {
  margin-bottom: clamp(20px, 3.5vh, 42px);
}

.personal-v94 .pa94-carousel {
  position: relative;
  width: 100vw;
  min-height: clamp(620px, 82vh, 940px);
  overflow: hidden;
  background:
    radial-gradient(ellipse 72vw 18vh at 50% 50%, rgba(243,240,232,.035), transparent 72%),
    linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.38) 100%),
    #000;
  isolation: isolate;
}

.personal-v94 .pa94-carousel::before,
.personal-v94 .pa94-carousel::after {
  content: "";
  position: absolute;
  z-index: 5;
  top: 0;
  bottom: 0;
  width: min(21vw, 360px);
  pointer-events: none;
}

.personal-v94 .pa94-carousel::before {
  left: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.95), rgba(0,0,0,.54) 50%, transparent);
}

.personal-v94 .pa94-carousel::after {
  right: 0;
  background: linear-gradient(270deg, rgba(0,0,0,.95), rgba(0,0,0,.54) 50%, transparent);
}

.personal-v94 .pa94-track-wrap {
  position: relative;
  height: clamp(430px, 68vh, 780px);
  width: 100vw;
  margin-top: clamp(12px, 2vh, 28px);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
  perspective: 1400px;
}

.personal-v94 .pa94-track {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 2.2vw, 42px);
  height: 100%;
  transform: translateX(0);
  transition: transform .46s cubic-bezier(.16,1,.3,1), opacity .22s ease;
}

.personal-v94 .pa94-carousel.is-moving-next .pa94-track { transform: translateX(-7vw); opacity: .64; }
.personal-v94 .pa94-carousel.is-moving-prev .pa94-track { transform: translateX(7vw); opacity: .64; }
.personal-v94 .pa94-carousel.is-settling .pa94-track { animation: pa94Settle .26s cubic-bezier(.16,1,.3,1) both; }

@keyframes pa94Settle {
  from { transform: translateY(5px) scale(.992); opacity: .72; }
  to { transform: translateY(0) scale(1); opacity: 1; }
}

.personal-v94 .pa94-slide {
  appearance: none;
  flex: 0 0 auto;
  height: clamp(360px, 61vh, 700px);
  max-width: 82vw;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  opacity: .32;
  filter: brightness(.38) contrast(1.05) saturate(.78);
  transform: scale(.92) translateY(14px);
  transition:
    opacity .32s ease,
    filter .32s ease,
    transform .48s cubic-bezier(.16,1,.3,1);
}

.personal-v94 .pa94-slide img {
  display: block;
  height: 100%;
  width: auto;
  max-width: 82vw;
  object-fit: contain;
  box-shadow: 0 42px 120px rgba(0,0,0,.62);
}

.personal-v94 .pa94-slide.is-active {
  cursor: default;
  opacity: 1;
  filter: brightness(1) contrast(1.035) saturate(.98);
  transform: scale(1) translateY(0);
  z-index: 4;
}

.personal-v94 .pa94-slide:not(.is-active):hover {
  opacity: .74;
  filter: brightness(.70) contrast(1.06) saturate(.92);
  transform: scale(.96) translateY(2px) rotateY(var(--hover-tilt, 0deg));
}

.personal-v94 .pa94-slide[data-offset="-1"] { --hover-tilt: -3deg; }
.personal-v94 .pa94-slide[data-offset="1"] { --hover-tilt: 3deg; }

.personal-v94 .pa94-arrow {
  appearance: none;
  position: absolute;
  z-index: 10;
  top: 50%;
  width: 40px;
  height: 58px;
  border: 1px solid rgba(243,240,232,.16);
  background: rgba(0,0,0,.18);
  color: rgba(243,240,232,.68);
  font-size: 31px;
  line-height: 1;
  transform: translateY(-50%);
  cursor: pointer;
  transition: color .22s ease, border-color .22s ease, background .22s ease, transform .22s ease;
}

.personal-v94 .pa94-arrow:hover {
  color: rgba(243,240,232,.96);
  border-color: rgba(243,240,232,.34);
  background: rgba(243,240,232,.055);
  transform: translateY(-50%) scale(1.04);
}

.personal-v94 .pa94-arrow-left { left: clamp(18px, 3vw, 56px); }
.personal-v94 .pa94-arrow-right { right: clamp(18px, 3vw, 56px); }

.personal-v94 .pa94-active-copy {
  position: relative;
  z-index: 6;
  width: min(1120px, calc(100vw - clamp(42px, 8vw, 160px)));
  margin: clamp(18px, 3.5vh, 38px) auto 0;
  display: grid;
  grid-template-columns: minmax(180px, 330px) minmax(260px, 560px);
  gap: clamp(28px, 7vw, 120px);
  align-items: start;
}

.personal-v94 .pa94-feature-kind,
.personal-v94 .pa94-feature-title {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .155em;
}

.personal-v94 .pa94-feature-kind {
  margin: 0 0 10px;
  color: rgba(243,240,232,.36);
  font-size: 8px;
}

.personal-v94 .pa94-feature-title {
  grid-column: 1;
  margin: 0;
  color: rgba(243,240,232,.92);
  font-size: clamp(30px, 3.2vw, 58px);
  line-height: .98;
}

.personal-v94 .pa94-feature-desc {
  grid-column: 2;
  grid-row: 1 / span 2;
  margin: 18px 0 0;
  max-width: 560px;
  color: rgba(243,240,232,.54);
  font-size: clamp(11px, .78vw, 13px);
  line-height: 1.66;
}

.personal-v94 .pa93-gallery-section {
  width: min(1840px, calc(100vw - clamp(18px, 2.4vw, 44px)));
  margin-top: clamp(86px, 12vh, 160px);
}

.personal-v94 .pa93-gallery {
  columns: 5 230px;
  column-gap: clamp(10px, .75vw, 14px);
}

.personal-v94 .pa93-gallery .gallery-item {
  position: relative;
  background: #000;
}

.personal-v94 .pa93-gallery button {
  position: relative;
}

.personal-v94 .pa93-gallery .gallery-item figcaption {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 34px 13px 12px;
  color: rgba(243,240,232,.84);
  font: 600 9px/1.25 var(--mono);
  letter-spacing: .13em;
  text-transform: uppercase;
  background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.78));
  opacity: 0;
  transform: translateY(8px);
  pointer-events: none;
  transition: opacity .24s ease, transform .32s cubic-bezier(.16,1,.3,1);
}

.personal-v94 .pa93-gallery .gallery-item figcaption em {
  font-style: normal;
  color: rgba(243,240,232,.44);
}

.personal-v94 .pa93-gallery .gallery-item:hover figcaption,
.personal-v94 .pa93-gallery .gallery-item:focus-within figcaption {
  opacity: 1;
  transform: translateY(0);
}

.personal-v94 .viewer-artwork-wrap {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  justify-items: center;
  align-items: center;
  width: min(94vw, 1760px);
  max-height: 92svh;
  gap: clamp(14px, 2.4vh, 26px);
}

.personal-v94 .personal-viewer .viewer-image {
  max-width: min(94vw, 1760px);
  max-height: 74svh;
}

.personal-v94 .viewer-meta {
  width: min(760px, 82vw);
  text-align: center;
  color: rgba(243,240,232,.62);
}

.personal-v94 .viewer-meta-kicker,
.personal-v94 .viewer-title {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .15em;
}

.personal-v94 .viewer-meta-kicker {
  margin: 0 0 10px;
  font-size: 8px;
  color: rgba(243,240,232,.35);
}

.personal-v94 .viewer-title {
  margin: 0;
  font-size: clamp(14px, 1.2vw, 22px);
  color: rgba(243,240,232,.88);
}

.personal-v94 .viewer-desc {
  margin: 12px auto 0;
  max-width: 620px;
  font-size: 12px;
  line-height: 1.55;
  color: rgba(243,240,232,.48);
}

@media (max-width: 1180px) {
  .personal-v94 .pa94-carousel {
    min-height: auto;
    padding: 0 0 48px;
  }
  .personal-v94 .pa94-carousel::before,
  .personal-v94 .pa94-carousel::after {
    width: 16vw;
  }
  .personal-v94 .pa94-track-wrap {
    height: clamp(320px, 54vh, 540px);
  }
  .personal-v94 .pa94-slide {
    height: clamp(280px, 50vh, 500px);
  }
  .personal-v94 .pa94-active-copy {
    grid-template-columns: 1fr;
    gap: 0;
    width: calc(100vw - 36px);
  }
  .personal-v94 .pa94-feature-desc {
    grid-column: 1;
    grid-row: auto;
    margin-top: 14px;
  }
  .personal-v94 .pa93-gallery {
    columns: 3 180px;
  }
}

@media (max-width: 720px) {
  .personal-v94 .pa94-track-wrap {
    height: 360px;
  }
  .personal-v94 .pa94-slide {
    height: 320px;
    max-width: 84vw;
  }
  .personal-v94 .pa94-arrow {
    width: 34px;
    height: 48px;
    font-size: 24px;
  }
  .personal-v94 .pa93-gallery {
    columns: 2 140px;
    column-gap: 8px;
  }
  .personal-v94 .pa93-gallery .gallery-item figcaption {
    font-size: 8px;
    padding: 28px 10px 10px;
  }
  .personal-v94 .personal-viewer .viewer-image {
    max-height: 68svh;
  }
  .personal-v94 .viewer-meta {
    width: calc(100vw - 52px);
  }
}

/* v95 — correct Personal Art filmstrip: one continuous strip, active image locked to visual center. */
.personal-v95 .pa94-carousel {
  min-height: clamp(600px, 78vh, 900px);
  padding-top: clamp(8px, 1.4vh, 18px);
  background:
    radial-gradient(ellipse 88vw 16vh at 50% 49%, rgba(243,240,232,.024), transparent 72%),
    linear-gradient(180deg, rgba(0,0,0,0) 8%, rgba(0,0,0,.34) 100%),
    #000;
}
.personal-v95 .pa94-track-wrap {
  height: clamp(420px, 62vh, 720px);
  margin-top: clamp(8px, 1.6vh, 22px);
  justify-content: flex-start;
  overflow: hidden;
  perspective: 1800px;
}
.personal-v95 .pa94-track {
  justify-content: flex-start;
  gap: clamp(20px, 2.4vw, 46px);
  padding: 0;
  height: 100%;
  will-change: transform;
}
.personal-v95 .pa94-carousel.is-moving-next .pa94-track,
.personal-v95 .pa94-carousel.is-moving-prev .pa94-track {
  opacity: 1;
}
.personal-v95 .pa94-slide {
  height: clamp(390px, 58vh, 680px);
  max-width: none;
  opacity: .24;
  filter: brightness(.24) contrast(1.07) saturate(.72);
  transform: translateY(10px);
  transform-origin: center center;
}
.personal-v95 .pa94-slide img {
  height: 100%;
  width: auto;
  max-width: none;
  object-fit: contain;
  box-shadow: 0 46px 130px rgba(0,0,0,.70);
}
.personal-v95 .pa94-slide.is-active {
  opacity: 1;
  filter: brightness(1) contrast(1.035) saturate(.98);
  transform: translateY(0);
  z-index: 4;
}
.personal-v95 .pa94-slide:not(.is-active):hover {
  opacity: .78;
  filter: brightness(.72) contrast(1.07) saturate(.92);
  transform: translateY(-8px) scale(1.012) rotateY(var(--hover-tilt, 0deg));
}
.personal-v95 .pa94-active-copy {
  margin-top: clamp(16px, 2.4vh, 28px);
}
.personal-v95 .pa94-feature-title {
  font-size: clamp(24px, 2.5vw, 44px);
  letter-spacing: .18em;
}
.personal-v95 .pa94-feature-desc {
  margin-top: 12px;
}

@media (max-width: 1180px) {
  .personal-v95 .pa94-track-wrap { height: clamp(330px, 52vh, 560px); }
  .personal-v95 .pa94-slide { height: clamp(290px, 48vh, 500px); }
}
@media (max-width: 720px) {
  .personal-v95 .pa94-track-wrap { height: 340px; }
  .personal-v95 .pa94-slide { height: 290px; }
  .personal-v95 .pa94-slide img { max-width: none; }
}


/* v96 — bigger Personal Art filmstrip, title on active image, gallery label + refined lightbox metadata. */
.personal-v96 .pa94-carousel {
  min-height: clamp(720px, 88vh, 1040px);
  padding-top: clamp(10px, 1.6vh, 22px);
}
.personal-v96 .pa94-track-wrap {
  height: clamp(540px, 72vh, 850px);
  margin-top: clamp(6px, 1vh, 16px);
}
.personal-v96 .pa94-slide {
  position: relative;
  height: clamp(500px, 69vh, 800px);
  filter: brightness(.22) contrast(1.07) saturate(.72);
  opacity: .22;
}
.personal-v96 .pa94-slide img {
  height: 100%;
  width: auto;
  max-width: none;
}
.personal-v96 .pa94-slide.is-active {
  filter: brightness(1) contrast(1.035) saturate(.98);
  opacity: 1;
}
.personal-v96 .pa94-slide:not(.is-active):hover {
  opacity: .84;
  filter: brightness(.80) contrast(1.065) saturate(.93);
  transform: translateY(-9px) scale(1.014) rotateY(var(--hover-tilt, 0deg));
}
.personal-v96 .pa94-slide-title {
  position: absolute;
  z-index: 6;
  left: clamp(22px, 2.6vw, 48px);
  bottom: clamp(22px, 3vw, 52px);
  display: grid;
  gap: 10px;
  max-width: min(72%, 760px);
  opacity: 0;
  transform: translateY(14px);
  color: rgba(243,240,232,.92);
  text-align: left;
  pointer-events: none;
  transition: opacity .42s ease, transform .58s cubic-bezier(.16,1,.3,1);
}
.personal-v96 .pa94-slide-title::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: -28px;
  right: -58px;
  bottom: -34px;
  height: 190px;
  background: radial-gradient(ellipse 90% 70% at 28% 75%, rgba(0,0,0,.70), rgba(0,0,0,.28) 46%, rgba(0,0,0,0) 76%);
  opacity: .72;
}
.personal-v96 .pa94-slide-title em,
.personal-v96 .pa94-slide-title strong {
  font-family: var(--mono);
  text-transform: uppercase;
  font-style: normal;
}
.personal-v96 .pa94-slide-title em {
  font-size: clamp(8px, .58vw, 10px);
  letter-spacing: .18em;
  color: rgba(243,240,232,.44);
}
.personal-v96 .pa94-slide-title strong {
  font-size: clamp(42px, 5.2vw, 104px);
  line-height: .88;
  letter-spacing: .18em;
  color: rgba(243,240,232,.95);
  text-shadow: 0 28px 90px rgba(0,0,0,.82);
}
.personal-v96 .pa94-slide.is-active .pa94-slide-title {
  opacity: 1;
  transform: translateY(0);
}
.personal-v96 .pa94-active-copy {
  margin-top: clamp(18px, 3vh, 34px);
  grid-template-columns: minmax(120px, 260px) minmax(280px, 640px);
}
.personal-v96 .pa94-active-copy .pa94-feature-title {
  display: none;
}
.personal-v96 .pa94-feature-kind {
  margin-top: 2px;
}
.personal-v96 .pa94-feature-desc {
  grid-column: 2;
  grid-row: 1;
  margin-top: 0;
}
.personal-v96 .pa93-gallery-section h2 {
  font-size: clamp(22px, 2vw, 40px);
}
.personal-v96 .personal-viewer .viewer-image {
  max-height: 73svh;
}
.personal-v96 .viewer-meta {
  width: min(920px, 84vw);
  text-align: left;
}
.personal-v96 .viewer-meta-kicker { display: none; }
.personal-v96 .viewer-meta-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 28px;
  border-top: 1px solid rgba(243,240,232,.12);
  padding-top: 15px;
}
.personal-v96 .viewer-title,
.personal-v96 .viewer-year {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .16em;
}
.personal-v96 .viewer-title {
  margin: 0;
  font-size: clamp(15px, 1.05vw, 22px);
  color: rgba(243,240,232,.90);
}
.personal-v96 .viewer-year {
  flex: 0 0 auto;
  font-size: clamp(9px, .62vw, 11px);
  color: rgba(243,240,232,.48);
}
.personal-v96 .viewer-desc {
  margin: 12px 0 0;
  max-width: 660px;
  font-size: 12px;
  line-height: 1.65;
  color: rgba(243,240,232,.52);
}

@media (max-width: 1180px) {
  .personal-v96 .pa94-carousel { min-height: auto; padding-bottom: 56px; }
  .personal-v96 .pa94-track-wrap { height: clamp(420px, 62vh, 650px); }
  .personal-v96 .pa94-slide { height: clamp(380px, 58vh, 600px); }
  .personal-v96 .pa94-slide-title strong { font-size: clamp(34px, 6vw, 72px); }
  .personal-v96 .pa94-active-copy { grid-template-columns: 1fr; }
  .personal-v96 .pa94-feature-desc { grid-column: 1; }
}
@media (max-width: 720px) {
  .personal-v96 .pa94-track-wrap { height: 430px; }
  .personal-v96 .pa94-slide { height: 380px; }
  .personal-v96 .pa94-slide-title { left: 18px; bottom: 18px; }
  .personal-v96 .pa94-slide-title strong { font-size: clamp(28px, 10vw, 44px); }
  .personal-v96 .viewer-meta-head { gap: 18px; }
}

/* v97 — Personal Art carousel correction: larger filmstrip, smaller on-image text, centered arrows, gallery/lightbox metadata polish. */
.personal-v97 .pa94-carousel {
  min-height: clamp(760px, 92vh, 1100px);
  padding-top: clamp(8px, 1.2vh, 18px);
}

.personal-v97 .pa94-track-wrap {
  height: clamp(600px, 80vh, 930px);
  margin-top: 0;
}

.personal-v97 .pa94-track {
  gap: clamp(18px, 2.1vw, 40px);
}

.personal-v97 .pa94-slide {
  height: clamp(555px, 75vh, 870px);
  opacity: .24;
  filter: brightness(.24) contrast(1.07) saturate(.74);
  transform: translateY(6px) scale(.90);
}

.personal-v97 .pa94-slide img {
  height: 100%;
  width: auto;
  max-width: none;
}

.personal-v97 .pa94-slide.is-active {
  opacity: 1;
  filter: brightness(1) contrast(1.035) saturate(.98);
  transform: translateY(0) scale(1);
  z-index: 6;
}

.personal-v97 .pa94-slide:not(.is-active):hover {
  opacity: .82;
  filter: brightness(.80) contrast(1.065) saturate(.92);
  transform: translateY(-8px) scale(.95) rotateY(var(--hover-tilt, 0deg));
  z-index: 5;
}

.personal-v97 .pa94-slide-title {
  left: clamp(20px, 2.3vw, 42px);
  bottom: clamp(20px, 2.6vw, 46px);
  gap: 8px;
  max-width: min(58%, 520px);
}

.personal-v97 .pa94-slide-title::before {
  left: -26px;
  right: -54px;
  bottom: -30px;
  height: 178px;
  opacity: .64;
  background: radial-gradient(ellipse 95% 72% at 28% 74%, rgba(0,0,0,.72), rgba(0,0,0,.30) 46%, rgba(0,0,0,0) 76%);
}

.personal-v97 .pa94-slide-title em {
  font-size: clamp(7px, .52vw, 9px);
  letter-spacing: .17em;
  color: rgba(243,240,232,.42);
}

.personal-v97 .pa94-slide-title strong {
  font-size: clamp(22px, 2.25vw, 46px);
  line-height: .98;
  letter-spacing: .17em;
  color: rgba(243,240,232,.90);
  text-shadow: 0 20px 70px rgba(0,0,0,.84);
}

.personal-v97 .pa94-slide-title small {
  display: block;
  max-width: min(360px, 100%);
  margin-top: 2px;
  font: 400 clamp(10px, .72vw, 13px)/1.55 var(--font-main);
  letter-spacing: 0;
  text-transform: none;
  color: rgba(243,240,232,.58);
}

.personal-v97 .pa94-active-copy {
  display: none;
}

.personal-v97 .pa94-arrow {
  top: calc(clamp(8px, 1.2vh, 18px) + clamp(600px, 80vh, 930px) / 2);
  width: 38px;
  height: 54px;
  font-size: 29px;
}

.personal-v97 .pa94-arrow-left { left: clamp(84px, 11vw, 220px); }
.personal-v97 .pa94-arrow-right { right: clamp(84px, 11vw, 220px); }

.personal-v97 .pa93-gallery-section h2 {
  font-size: clamp(20px, 1.85vw, 34px);
  letter-spacing: .16em;
}

.personal-v97 .personal-viewer .viewer-image {
  max-height: 73svh;
  width: auto;
  max-width: min(94vw, 1760px);
}

.personal-v97 .viewer-meta {
  max-width: min(94vw, 1760px);
  min-width: min(360px, 88vw);
  text-align: left;
}

.personal-v97 .viewer-meta-head {
  border-top: 0;
  padding-top: 0;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 28px;
  width: 100%;
}

.personal-v97 .viewer-desc {
  max-width: 100%;
  margin-top: 10px;
}

@media (max-width: 1180px) {
  .personal-v97 .pa94-carousel { min-height: auto; padding-bottom: 42px; }
  .personal-v97 .pa94-track-wrap { height: clamp(460px, 66vh, 690px); }
  .personal-v97 .pa94-slide { height: clamp(400px, 61vh, 630px); }
  .personal-v97 .pa94-arrow { top: calc(clamp(460px, 66vh, 690px) / 2); }
  .personal-v97 .pa94-arrow-left { left: 34px; }
  .personal-v97 .pa94-arrow-right { right: 34px; }
}

@media (max-width: 720px) {
  .personal-v97 .pa94-track-wrap { height: 440px; }
  .personal-v97 .pa94-slide { height: 390px; }
  .personal-v97 .pa94-slide-title {
    left: 18px;
    bottom: 18px;
    max-width: 72%;
  }
  .personal-v97 .pa94-slide-title strong { font-size: clamp(22px, 7vw, 34px); }
  .personal-v97 .pa94-slide-title small { font-size: 10px; line-height: 1.45; }
  .personal-v97 .pa94-arrow {
    top: 220px;
    width: 32px;
    height: 46px;
    font-size: 23px;
  }
  .personal-v97 .pa94-arrow-left { left: 14px; }
  .personal-v97 .pa94-arrow-right { right: 14px; }
}

/* v98 — Personal Art filmstrip refinements: centered default, proportional strip, quieter side hover, controls under image. */
.personal-v98 .pa94-carousel {
  position: relative;
  min-height: clamp(720px, 90vh, 1040px);
  padding-top: clamp(8px, 1.2vh, 18px);
  padding-bottom: clamp(80px, 9vh, 120px);
  background:
    radial-gradient(ellipse 52vw 12vh at 50% 70%, rgba(214,221,222,.055), transparent 68%),
    linear-gradient(90deg, #000 0%, rgba(0,0,0,.40) 12%, transparent 31%, transparent 69%, rgba(0,0,0,.40) 88%, #000 100%),
    linear-gradient(180deg, rgba(0,0,0,0) 4%, rgba(0,0,0,.20) 76%, #000 100%),
    #000;
}
.personal-v98 .pa94-carousel::before,
.personal-v98 .pa94-carousel::after {
  content: "";
  position: absolute;
  z-index: 7;
  top: 0;
  bottom: 0;
  width: 16vw;
  pointer-events: none;
}
.personal-v98 .pa94-carousel::before {
  left: 0;
  background: linear-gradient(90deg, #000 5%, rgba(0,0,0,.70) 46%, transparent 100%);
}
.personal-v98 .pa94-carousel::after {
  right: 0;
  background: linear-gradient(270deg, #000 5%, rgba(0,0,0,.70) 46%, transparent 100%);
}
.personal-v98 .pa94-track-wrap {
  --hero-h: clamp(580px, 75vh, 820px);
  height: var(--hero-h);
  margin-top: clamp(4px, .8vh, 12px);
  overflow: hidden;
  align-items: center;
}
.personal-v98 .pa94-track {
  height: var(--hero-h);
  gap: clamp(20px, 2.3vw, 44px);
  align-items: center;
}
.personal-v98 .pa94-slide {
  flex: 0 0 auto;
  width: calc(var(--hero-h) * var(--ar, 1));
  height: var(--hero-h);
  opacity: .38;
  filter: brightness(.36) contrast(1.06) saturate(.78);
  transform: translateY(8px) scale(.90);
  transition:
    opacity .36s ease,
    filter .36s ease,
    transform .48s cubic-bezier(.16,1,.3,1);
}
.personal-v98 .pa94-slide.is-wide-feature {
  width: calc(var(--hero-h) * .74 * var(--ar, 1));
  height: calc(var(--hero-h) * .74);
}
.personal-v98 .pa94-slide img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  box-shadow: 0 50px 140px rgba(0,0,0,.74);
}
.personal-v98 .pa94-slide.is-active {
  opacity: 1;
  filter: brightness(1) contrast(1.035) saturate(.98);
  transform: translateY(0) scale(1);
  z-index: 6;
}
.personal-v98 .pa94-slide.is-active::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: 8%;
  right: 8%;
  bottom: -8%;
  height: 22%;
  background: radial-gradient(ellipse 50% 85% at 50% 50%, rgba(218,224,222,.075), rgba(96,110,110,.035) 42%, transparent 74%);
  filter: blur(18px);
  pointer-events: none;
}
.personal-v98 .pa94-slide:not(.is-active):hover {
  opacity: .64;
  filter: brightness(.56) contrast(1.065) saturate(.88);
  transform: translateY(-5px) scale(.95) rotateY(var(--hover-tilt, 0deg));
  z-index: 5;
}
.personal-v98 .pa94-slide-title {
  left: clamp(18px, 2vw, 38px);
  bottom: clamp(18px, 2.2vw, 40px);
  max-width: min(52%, 440px);
  gap: 5px;
}
.personal-v98 .pa94-slide-title::before {
  height: 146px;
  opacity: .58;
  background: radial-gradient(ellipse 95% 72% at 28% 74%, rgba(0,0,0,.72), rgba(0,0,0,.30) 46%, rgba(0,0,0,0) 76%);
}
.personal-v98 .pa94-slide-title em {
  font-size: clamp(6px, .45vw, 8px);
}
.personal-v98 .pa94-slide-title strong {
  font-size: clamp(18px, 1.8vw, 36px);
  letter-spacing: .17em;
}
.personal-v98 .pa94-slide-title small {
  max-width: min(330px, 100%);
  font-size: clamp(9px, .62vw, 11px);
  line-height: 1.45;
  color: rgba(243,240,232,.54);
}
.personal-v98 .pa94-controls {
  position: absolute;
  z-index: 12;
  left: 50%;
  bottom: clamp(28px, 5.2vh, 64px);
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(12px, 1.4vw, 22px);
  pointer-events: auto;
}
.personal-v98 .pa94-controls .pa94-arrow,
.personal-v98 .pa94-zoom {
  position: static;
  inset: auto;
  transform: none;
  width: auto;
  height: 34px;
  min-width: 34px;
  border: 1px solid rgba(243,240,232,.16);
  background: rgba(0,0,0,.30);
  color: rgba(243,240,232,.76);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: 9px;
  transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease;
}
.personal-v98 .pa94-controls .pa94-arrow {
  font-size: 22px;
  line-height: 1;
  padding: 0 11px;
}
.personal-v98 .pa94-zoom {
  padding: 0 17px;
}
.personal-v98 .pa94-controls .pa94-arrow:hover,
.personal-v98 .pa94-zoom:hover {
  color: rgba(255,255,255,.94);
  border-color: rgba(243,240,232,.32);
  background: rgba(243,240,232,.055);
  transform: translateY(-1px);
}
.personal-v98 .pa94-active-copy { display: none; }

@media (max-width: 1180px) {
  .personal-v98 .pa94-carousel { min-height: auto; padding-bottom: 88px; }
  .personal-v98 .pa94-track-wrap { --hero-h: clamp(420px, 64vh, 640px); }
}
@media (max-width: 720px) {
  .personal-v98 .pa94-track-wrap { --hero-h: 390px; }
  .personal-v98 .pa94-slide-title {
    left: 16px;
    bottom: 16px;
    max-width: 72%;
  }
  .personal-v98 .pa94-slide-title strong { font-size: clamp(18px, 6vw, 30px); }
  .personal-v98 .pa94-slide-title small { font-size: 10px; line-height: 1.42; }
  .personal-v98 .pa94-controls { bottom: 26px; }
  .personal-v98 .pa94-carousel::before,
  .personal-v98 .pa94-carousel::after { width: 12vw; }
}


/* v99 — Personal Art: larger filmstrip, softer background glow, clearer gallery separation. */
.personal-v99 .pa94-carousel {
  min-height: clamp(780px, 94vh, 1120px);
  padding-top: clamp(6px, 1vh, 14px);
  padding-bottom: clamp(96px, 10vh, 138px);
  background:
    radial-gradient(ellipse 80vw 22vh at 50% 58%, rgba(185,196,194,.085), rgba(92,106,106,.038) 38%, transparent 72%),
    radial-gradient(ellipse 48vw 14vh at 50% 78%, rgba(243,240,232,.045), transparent 72%),
    linear-gradient(90deg, #000 0%, rgba(0,0,0,.52) 10%, transparent 30%, transparent 70%, rgba(0,0,0,.52) 90%, #000 100%),
    linear-gradient(180deg, rgba(0,0,0,0) 4%, rgba(0,0,0,.18) 72%, #000 100%),
    #000;
}

.personal-v99 .pa94-track-wrap {
  --hero-h: clamp(640px, 82vh, 900px);
  margin-top: clamp(2px, .5vh, 8px);
}

.personal-v99 .pa94-track-wrap::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  width: min(82vw, 1360px);
  height: min(28vh, 280px);
  transform: translate(-50%, -35%);
  background: radial-gradient(ellipse 50% 50% at 50% 50%, rgba(210,220,218,.105), rgba(110,125,124,.045) 42%, rgba(0,0,0,0) 74%);
  filter: blur(26px);
  pointer-events: none;
}

.personal-v99 .pa94-track {
  position: relative;
  z-index: 2;
}

.personal-v99 .pa94-slide.is-active::after {
  left: 2%;
  right: 2%;
  bottom: -9%;
  height: 26%;
  background: radial-gradient(ellipse 55% 90% at 50% 50%, rgba(218,226,224,.105), rgba(96,112,112,.048) 42%, transparent 76%);
  filter: blur(22px);
}

.personal-v99 .pa94-slide:not(.is-active) {
  opacity: .40;
  filter: brightness(.39) contrast(1.06) saturate(.80);
}

.personal-v99 .pa94-slide:not(.is-active):hover {
  opacity: .60;
  filter: brightness(.50) contrast(1.06) saturate(.86);
}

.personal-v99 .pa93-gallery-section {
  position: relative;
  margin-top: clamp(104px, 14vh, 190px);
  padding-top: clamp(42px, 6vh, 82px);
}

.personal-v99 .pa93-gallery-section::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(243,240,232,.12) 18%, rgba(243,240,232,.20) 50%, rgba(243,240,232,.12) 82%, transparent 100%);
}

.personal-v99 .pa93-gallery-section h2 {
  margin-bottom: clamp(28px, 4.4vh, 58px);
}

@media (max-width: 1180px) {
  .personal-v99 .pa94-carousel { padding-bottom: 94px; }
  .personal-v99 .pa94-track-wrap { --hero-h: clamp(470px, 68vh, 690px); }
}

@media (max-width: 720px) {
  .personal-v99 .pa94-track-wrap { --hero-h: 420px; }
  .personal-v99 .pa94-carousel { padding-bottom: 84px; }
  .personal-v99 .pa93-gallery-section { margin-top: 68px; padding-top: 34px; }
}


/* v100 — nav separation + Personal Art title moved below the filmstrip */
.site-header .brand-cluster {
  gap: clamp(14px, 1.65vw, 26px);
}
.site-header .brand {
  margin-right: clamp(20px, 3.4vw, 58px);
}

.personal-v100 .pa93-opener {
  padding-top: calc(var(--header-h) + clamp(18px, 3vh, 42px));
}

.personal-v100 .pa93-opener-copy {
  margin-top: clamp(38px, 6.2vh, 88px);
  margin-bottom: clamp(52px, 8vh, 116px);
  padding-top: clamp(18px, 2.8vh, 34px);
  border-top: 1px solid rgba(243,240,232,.085);
  align-items: start;
}

.personal-v100 .pa93-opener-copy h1 {
  font-size: clamp(20px, 1.65vw, 31px);
  letter-spacing: .18em;
}

.personal-v100 .pa93-opener-copy p {
  max-width: 680px;
  padding-top: 1px;
}

@media (max-width: 720px) {
  .site-header .brand { margin-right: 18px; }
  .personal-v100 .pa93-opener-copy {
    width: calc(100vw - 36px);
    grid-template-columns: 1fr;
    gap: 14px;
    margin-top: 36px;
    margin-bottom: 54px;
  }
}


/* v102 — revert gallery takeover; polish Personal Work carousel, nav separator and Works rail. */
/* More explicit home identity separator in the fixed nav. */
.site-header .brand {
  position: relative;
  margin-right: clamp(24px, 3.6vw, 62px);
}
.site-header .brand::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  margin-left: clamp(18px, 2.4vw, 38px);
  transform: translateY(1px);
  background: rgba(243,240,232,.20);
}
.site-header .brand-cluster {
  gap: clamp(15px, 1.7vw, 28px);
}

/* Personal Work: clean filmstrip opener without the failed takeover behavior. */
.personal-v102 .pa93-opener {
  padding-top: calc(var(--header-h) + clamp(12px, 2.2vh, 34px));
}
.personal-v102 .pa93-opener-copy {
  display: none;
}
.personal-v102 .pa94-carousel {
  min-height: clamp(720px, 86vh, 1010px);
  padding-top: clamp(8px, 1.1vh, 18px);
  padding-bottom: clamp(58px, 6.8vh, 96px);
  background:
    radial-gradient(ellipse 86vw 23vh at 50% 56%, rgba(183,196,194,.095), rgba(84,100,101,.038) 42%, transparent 74%),
    radial-gradient(ellipse 58vw 13vh at 50% 73%, rgba(243,240,232,.047), transparent 72%),
    linear-gradient(90deg, #000 0%, rgba(0,0,0,.48) 10%, transparent 29%, transparent 71%, rgba(0,0,0,.48) 90%, #000 100%),
    linear-gradient(180deg, rgba(0,0,0,0) 3%, rgba(0,0,0,.17) 73%, #000 100%),
    #000;
}
.personal-v102 .pa94-track-wrap {
  --hero-h: clamp(665px, 83vh, 930px);
  margin-top: 0;
}
.personal-v102 .pa94-slide:not(.is-active) {
  opacity: .45;
  filter: brightness(.43) contrast(1.06) saturate(.82);
}
.personal-v102 .pa94-slide:not(.is-active):hover {
  opacity: .62;
  filter: brightness(.50) contrast(1.06) saturate(.86);
  transform: translateY(-5px) scale(.945) rotateY(var(--hover-tilt, 0deg));
}
.personal-v102 .pa94-slide-title strong {
  font-size: clamp(14px, 1.35vw, 28px);
}
.personal-v102 .pa102-cue {
  position: absolute;
  z-index: 13;
  left: clamp(18px, 4vw, 72px);
  bottom: clamp(18px, 2.6vh, 34px);
  margin: 0;
  color: rgba(243,240,232,.33);
  font-family: var(--mono);
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: .20em;
  pointer-events: none;
}
.personal-v102 .pa93-gallery-section {
  margin-top: clamp(22px, 3.2vh, 48px);
  padding-top: clamp(24px, 3.6vh, 46px);
}
.personal-v102 .pa93-gallery-section h2 {
  margin-bottom: clamp(20px, 3vh, 38px);
}

/* Works: only the rail moves/changes; the content remains centered. */
.works-v102 .works-v92-rail {
  left: clamp(24px, 3.8vw, 68px);
  width: clamp(132px, 12vw, 220px);
}
.works-v102 .works-v92-rail a {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: baseline;
  padding-left: 14px;
  color: rgba(243,240,232,.38);
  font-size: clamp(10px, .72vw, 13px);
  letter-spacing: .16em;
}
.works-v102 .works-v92-rail a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 4px;
  height: 4px;
  border-radius: 4px;
  background: rgba(243,240,232,0);
  transform: translateY(-50%);
  transition: background .22s ease, box-shadow .22s ease;
}
.works-v102 .works-v92-rail a em {
  color: rgba(243,240,232,.25);
  font-style: normal;
  font-size: .82em;
  letter-spacing: .12em;
  transition: color .22s ease;
}
.works-v102 .works-v92-rail a:hover,
.works-v102 .works-v92-rail a.is-active {
  color: rgba(243,240,232,.92);
}
.works-v102 .works-v92-rail a.is-active::before {
  background: rgba(243,240,232,.82);
  box-shadow: 0 0 18px rgba(243,240,232,.18);
}
.works-v102 .works-v92-rail a.is-active em {
  color: rgba(243,240,232,.48);
}

@media (max-width: 1180px) {
  .personal-v102 .pa94-carousel { min-height: auto; padding-bottom: 82px; }
  .personal-v102 .pa94-track-wrap { --hero-h: clamp(470px, 70vh, 700px); }
  .works-v102 .works-v92-rail {
    left: auto;
    width: auto;
  }
}
@media (max-width: 720px) {
  .site-header .brand::after { display: none; }
  .site-header .brand { margin-right: 18px; }
  .personal-v102 .pa94-track-wrap { --hero-h: 430px; }
  .personal-v102 .pa102-cue { bottom: 14px; left: 18px; }
  .personal-v102 .pa93-gallery-section { margin-top: 24px; }
}


/* v103 — requested polish: nav balance, Personal Art filmstrip cleanup, Professional Works rail interaction. */
/* Top nav: make Jakub Mirocha read as home, with a clean separator and tighter section buttons. */
.site-header .brand-cluster {
  gap: clamp(16px, 2.0vw, 34px);
}
.site-header .brand {
  margin-right: 0;
}
.site-header .brand::after {
  height: 10px;
  margin-left: clamp(18px, 2.0vw, 30px);
  background: rgba(243,240,232,.22);
}
.site-header .brand-nav:first-of-type {
  margin-left: 0;
}

/* Personal Art: remove explicit controls; navigation is by clicking side images. */
.personal-v103 .pa94-controls {
  display: none !important;
}
.personal-v103 .pa94-carousel {
  padding-bottom: clamp(44px, 5.8vh, 78px);
}
.personal-v103 .pa94-track {
  gap: clamp(8px, 1.0vw, 20px); /* at least twice tighter than v102 */
}
.personal-v103 .pa94-track-wrap {
  --hero-h: clamp(675px, 84vh, 940px);
}
.personal-v103 .pa94-slide {
  transform: translateY(6px) scale(.91);
}
.personal-v103 .pa94-slide:not(.is-active) {
  opacity: .43;
  filter: brightness(.38) contrast(1.055) saturate(.80);
}
.personal-v103 .pa94-slide:not(.is-active):hover {
  opacity: .56;
  filter: brightness(.45) contrast(1.055) saturate(.84);
  transform: translateY(-4px) scale(.94) rotateY(var(--hover-tilt, 0deg));
}
.personal-v103 .pa94-slide.is-active {
  transform: translateY(0) scale(1);
}
.personal-v103 .pa94-slide-title {
  left: clamp(18px, 1.8vw, 34px);
  bottom: clamp(18px, 2vw, 36px);
  max-width: min(50%, 400px);
  gap: 4px;
}
.personal-v103 .pa94-slide-title::before {
  left: -22px;
  right: -42px;
  bottom: -26px;
  height: 128px;
  opacity: .50;
}
.personal-v103 .pa94-slide-title em {
  font-size: clamp(6px, .42vw, 8px);
  letter-spacing: .16em;
}
.personal-v103 .pa94-slide-title strong {
  font-size: clamp(12px, 1.08vw, 22px);
  letter-spacing: .165em;
  line-height: 1.02;
}
.personal-v103 .pa94-slide-title small {
  max-width: min(300px, 100%);
  font-size: clamp(8px, .56vw, 10px);
  line-height: 1.42;
  color: rgba(243,240,232,.50);
}
.personal-v103 .pa102-cue {
  bottom: clamp(16px, 2.4vh, 32px);
}

/* Works: left index keeps years, no dot; active/hover gets the elegant extending line like Contact links. */
.works-v103 .works-v92-rail {
  left: clamp(24px, 3.8vw, 68px);
  width: clamp(150px, 14vw, 250px);
  gap: 16px;
}
.works-v103 .works-v92-rail a {
  position: relative;
  display: inline-flex;
  width: fit-content;
  align-items: baseline;
  gap: 10px;
  padding-left: 0;
  color: rgba(243,240,232,.42);
  font-size: clamp(10px, .72vw, 13px);
  letter-spacing: .16em;
  transform: translateX(0);
}
.works-v103 .works-v92-rail a::before {
  display: none;
}
.works-v103 .works-v92-rail a span::after {
  content: "";
  display: inline-block;
  width: 26px;
  height: 1px;
  margin-left: 11px;
  vertical-align: middle;
  background: rgba(243,240,232,.16);
  transform: scaleX(.35);
  transform-origin: left center;
  transition: transform .25s ease, background .25s ease;
}
.works-v103 .works-v92-rail a:hover,
.works-v103 .works-v92-rail a.is-active {
  color: rgba(243,240,232,.94);
  transform: translateX(4px);
}
.works-v103 .works-v92-rail a:hover span::after,
.works-v103 .works-v92-rail a.is-active span::after {
  transform: scaleX(1);
  background: rgba(243,240,232,.48);
}
.works-v103 .works-v92-rail a em {
  color: rgba(243,240,232,.30);
  font-style: normal;
  font-size: .82em;
  letter-spacing: .12em;
}
.works-v103 .works-v92-rail a:hover em,
.works-v103 .works-v92-rail a.is-active em {
  color: rgba(243,240,232,.52);
}

@media (max-width: 1180px) {
  .personal-v103 .pa94-track-wrap { --hero-h: clamp(470px, 69vh, 700px); }
  .personal-v103 .pa94-track { gap: clamp(8px, 1.3vw, 18px); }
  .works-v103 .works-v92-rail a span::after { display: none; }
}
@media (max-width: 720px) {
  .site-header .brand::after { display: none; }
  .personal-v103 .pa94-track-wrap { --hero-h: 430px; }
  .personal-v103 .pa94-slide-title strong { font-size: clamp(14px, 4.4vw, 22px); }
}


/* v104 — Personal Art: active image opens lightbox; stronger upper glow, gallery stays black. */
body.personal-v104 .pa94-carousel {
  background:
    radial-gradient(ellipse 92vw 31vh at 50% 50%, rgba(214,226,224,.155), rgba(88,105,108,.060) 44%, rgba(0,0,0,0) 76%),
    radial-gradient(ellipse 64vw 16vh at 50% 70%, rgba(243,240,232,.060), transparent 72%),
    linear-gradient(90deg, #000 0%, rgba(0,0,0,.44) 10%, transparent 28%, transparent 72%, rgba(0,0,0,.44) 90%, #000 100%),
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.14) 78%, #000 100%),
    #000;
}
body.personal-v104 .pa94-track-wrap::before {
  width: min(90vw, 1500px);
  height: min(34vh, 340px);
  background: radial-gradient(ellipse 58% 52% at 50% 50%, rgba(216,228,225,.145), rgba(102,124,126,.060) 45%, rgba(0,0,0,0) 78%);
  filter: blur(30px);
}
body.personal-v104 .pa94-slide.is-active {
  cursor: zoom-in;
  transition: transform .34s cubic-bezier(.16,1,.3,1), opacity .28s ease, filter .28s ease;
}
body.personal-v104 .pa94-slide.is-active:hover {
  transform: translateY(-3px) scale(1.012);
}
body.personal-v104 .pa94-slide.is-active:hover::after {
  opacity: 1;
}
body.personal-v104 .pa94-slide:not(.is-active) {
  cursor: pointer;
}
body.personal-v104 .pa93-gallery-section {
  background: #000;
  isolation: isolate;
}
body.personal-v104 .pa93-gallery-section::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -1px 0 auto;
  height: 120px;
  background: #000;
  pointer-events: none;
}


/* v105 — Personal gallery: closer arrows and click-outside-to-close behavior. */
body.personal-v105 .personal-viewer .viewer-prev {
  left: clamp(46px, 8vw, 150px);
}
body.personal-v105 .personal-viewer .viewer-next {
  right: clamp(46px, 8vw, 150px);
}
body.personal-v105 .personal-viewer .viewer-artwork-wrap,
body.personal-v105 .personal-viewer .viewer-arrow,
body.personal-v105 .personal-viewer .viewer-back {
  pointer-events: auto;
}
body.personal-v105 .personal-viewer {
  cursor: zoom-out;
}
body.personal-v105 .personal-viewer .viewer-artwork-wrap,
body.personal-v105 .personal-viewer .viewer-arrow,
body.personal-v105 .personal-viewer .viewer-back {
  cursor: default;
}
body.personal-v105 .personal-viewer .viewer-arrow {
  cursor: pointer;
}
@media (max-width: 720px) {
  body.personal-v105 .personal-viewer .viewer-prev { left: 18px; }
  body.personal-v105 .personal-viewer .viewer-next { right: 18px; }
}

/* v106 — stable lightbox click handling. No hash/history jumps; closed overlay never catches clicks. */
body.personal-v106 .personal-viewer:not(.is-open) {
  pointer-events: none !important;
}
body.personal-v106 .personal-viewer.is-open {
  pointer-events: auto;
}
body.personal-v106 .viewer-artwork-wrap,
body.personal-v106 .viewer-arrow,
body.personal-v106 .viewer-back {
  pointer-events: auto;
}
body.personal-v106 .viewer-image {
  user-select: none;
}


/* v107 — fix Personal Art lightbox click blocking. Closed overlay and all fixed children are inert. */
body.personal-v107 .personal-viewer:not(.is-open),
body.personal-v107 .personal-viewer:not(.is-open) * {
  pointer-events: none !important;
  visibility: hidden;
}
body.personal-v107 .personal-viewer.is-open,
body.personal-v107 .personal-viewer.is-open * {
  visibility: visible;
}
body.personal-v107 .personal-viewer.is-open {
  pointer-events: auto !important;
}
body.personal-v107 .personal-viewer.is-open .viewer-artwork-wrap,
body.personal-v107 .personal-viewer.is-open .viewer-arrow,
body.personal-v107 .personal-viewer.is-open .viewer-back {
  pointer-events: auto !important;
}
body.personal-v107 .personal-viewer.is-open .viewer-image,
body.personal-v107 .personal-viewer.is-open .viewer-meta {
  pointer-events: auto;
}
body.personal-v107 .personal-viewer.is-open {
  cursor: zoom-out;
}
body.personal-v107 .personal-viewer.is-open .viewer-artwork-wrap,
body.personal-v107 .personal-viewer.is-open .viewer-arrow,
body.personal-v107 .personal-viewer.is-open .viewer-back {
  cursor: default;
}
body.personal-v107 .personal-viewer.is-open .viewer-arrow,
body.personal-v107 .personal-viewer.is-open .viewer-back {
  cursor: pointer;
}

/* v108 — Personal Art: remove hard title backing; active-image hover reveals a clean technique/description panel below the artwork. */
body.personal-v108 .pa94-track-wrap {
  overflow: visible;
}
body.personal-v108 .pa94-carousel {
  overflow: hidden;
}
body.personal-v108 .pa94-track {
  padding-bottom: clamp(96px, 12vh, 150px);
}
body.personal-v108 .pa94-slide-title::before {
  display: none !important;
}
body.personal-v108 .pa94-slide-title {
  text-shadow: 0 20px 70px rgba(0,0,0,.92), 0 2px 18px rgba(0,0,0,.70);
}
body.personal-v108 .pa108-detail-panel {
  position: absolute;
  z-index: 8;
  left: 0;
  right: 0;
  top: calc(100% - 1px);
  min-height: clamp(92px, 10vh, 140px);
  padding: clamp(18px, 2vw, 28px) clamp(20px, 2.4vw, 38px) clamp(20px, 2vw, 30px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(20px, 3vw, 54px);
  align-items: start;
  text-align: left;
  color: rgba(243,240,232,.72);
  background:
    linear-gradient(180deg, rgba(22,22,22,.94), rgba(10,10,10,.88)),
    radial-gradient(ellipse 90% 180% at 50% 0%, rgba(243,240,232,.035), transparent 70%);
  border-top: 1px solid rgba(243,240,232,.075);
  opacity: 0;
  transform: translateY(-12px) scaleY(.92);
  transform-origin: top center;
  transition: opacity .28s ease, transform .42s cubic-bezier(.16,1,.3,1);
  pointer-events: none;
}
body.personal-v108 .pa94-slide.is-active:hover .pa108-detail-panel,
body.personal-v108 .pa94-slide.is-active:focus-visible .pa108-detail-panel {
  opacity: 1;
  transform: translateY(0) scaleY(1);
}
body.personal-v108 .pa108-detail-panel small {
  display: block;
  max-width: 580px;
  margin: 0;
  font: 400 clamp(10px, .72vw, 13px)/1.6 var(--font-main);
  letter-spacing: 0;
  text-transform: none;
  color: rgba(243,240,232,.62);
}
body.personal-v108 .pa108-tech {
  display: grid;
  gap: 8px;
  min-width: clamp(160px, 16vw, 250px);
  font-family: var(--mono);
  font-size: clamp(8px, .54vw, 10px);
  line-height: 1.55;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(243,240,232,.46);
}
body.personal-v108 .pa108-tech b {
  font-weight: 500;
  color: rgba(243,240,232,.78);
}
@media (max-width: 900px) {
  body.personal-v108 .pa108-detail-panel {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 16px 18px 18px;
  }
  body.personal-v108 .pa108-tech {
    min-width: 0;
  }
}
@media (max-width: 720px) {
  body.personal-v108 .pa94-track-wrap {
    overflow: hidden;
  }
  body.personal-v108 .pa108-detail-panel {
    display: none;
  }
}


/* v109 — Professional Works: hover side panels and larger, non-fullscreen work preview. */
html:not([lang="pl"]) .lang-pl { display: none !important; }
html[lang="pl"] .lang-en { display: none !important; }
body.works-v109 .works-v92 figure.work-info-asset {
  overflow: visible;
  cursor: zoom-in;
  isolation: isolate;
}
body.works-v109 .works-v92 figure.work-info-asset::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(90deg, transparent 60%, rgba(0,0,0,.12));
  opacity: 0;
  transition: opacity .28s ease;
}
body.works-v109 .works-v92 figure.work-info-asset:hover::before,
body.works-v109 .works-v92 figure.work-info-asset:focus-visible::before {
  opacity: 1;
}
body.works-v109 .work-side-panel {
  position: absolute;
  z-index: 12;
  top: clamp(14px, 1.4vw, 22px);
  left: calc(100% + clamp(12px, 1.4vw, 24px));
  width: clamp(230px, 18vw, 330px);
  min-height: clamp(132px, 13vw, 210px);
  padding: clamp(16px, 1.55vw, 25px);
  display: grid;
  align-content: start;
  gap: clamp(12px, 1.1vw, 18px);
  background:
    linear-gradient(180deg, rgba(28,28,28,.95), rgba(10,10,10,.90)),
    radial-gradient(ellipse 105% 145% at 0% 0%, rgba(243,240,232,.05), transparent 72%);
  border-left: 1px solid rgba(243,240,232,.11);
  color: rgba(243,240,232,.70);
  opacity: 0;
  pointer-events: none;
  transform: translateX(-10px) translateY(6px);
  transition: opacity .24s ease, transform .38s cubic-bezier(.16,1,.3,1);
  box-shadow: 0 28px 90px rgba(0,0,0,.48);
}
body.works-v109 .work-info-asset:hover .work-side-panel,
body.works-v109 .work-info-asset:focus-visible .work-side-panel {
  opacity: 1;
  transform: translateX(0) translateY(0);
}
body.works-v109 .work-side-panel-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(243,240,232,.08);
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .14em;
}
body.works-v109 .work-side-panel-head strong {
  font-size: clamp(10px, .72vw, 13px);
  font-weight: 500;
  color: rgba(243,240,232,.88);
}
body.works-v109 .work-side-panel-head em {
  font-size: clamp(8px, .56vw, 10px);
  font-style: normal;
  color: rgba(243,240,232,.36);
}
body.works-v109 .work-side-panel small {
  display: block;
  font: 400 clamp(10px, .72vw, 13px)/1.62 var(--font-main);
  color: rgba(243,240,232,.62);
}
body.works-v109 .work-side-tech {
  margin: 0;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: clamp(8px, .54vw, 10px);
  line-height: 1.55;
  color: rgba(243,240,232,.40);
}
body.works-viewer-open { overflow: hidden; }
body.works-v109 .works-viewer {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: grid;
  place-items: center;
  padding: clamp(26px, 4vw, 64px);
  background:
    radial-gradient(ellipse 84vw 42vh at 50% 50%, rgba(225,232,230,.055), transparent 68%),
    rgba(0,0,0,.90);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .24s ease, visibility .24s ease;
  cursor: zoom-out;
}
body.works-v109 .works-viewer.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
body.works-v109 .works-viewer-card {
  width: min(90vw, 1480px);
  max-height: 86vh;
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(280px, 25vw, 390px);
  gap: clamp(18px, 2.4vw, 38px);
  align-items: stretch;
  cursor: default;
  transform: translateY(8px) scale(.985);
  transition: transform .32s cubic-bezier(.16,1,.3,1);
}
body.works-v109 .works-viewer.is-open .works-viewer-card {
  transform: translateY(0) scale(1);
}
body.works-v109 .works-viewer-image-wrap {
  display: grid;
  place-items: center;
  min-height: min(68vh, 720px);
  max-height: 78vh;
  background: #000;
  box-shadow: 0 48px 150px rgba(0,0,0,.62);
  overflow: hidden;
}
body.works-v109 .works-viewer-image {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 78vh;
  object-fit: contain;
}
body.works-v109 .works-viewer-info {
  padding: clamp(22px, 2.4vw, 36px);
  align-self: stretch;
  background:
    linear-gradient(180deg, rgba(24,24,24,.97), rgba(7,7,7,.92)),
    radial-gradient(ellipse 100% 120% at 0% 0%, rgba(243,240,232,.05), transparent 70%);
  border-left: 1px solid rgba(243,240,232,.10);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: min(68vh, 720px);
}
body.works-v109 .works-viewer-kind,
body.works-v109 .works-viewer-tech,
body.works-v109 .works-viewer-head em {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .14em;
}
body.works-v109 .works-viewer-kind {
  margin: 0 0 auto;
  font-size: 9px;
  color: rgba(243,240,232,.34);
}
body.works-v109 .works-viewer-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: clamp(14px, 1.6vw, 24px);
  padding-top: clamp(24px, 3vw, 42px);
  border-top: 1px solid rgba(243,240,232,.08);
}
body.works-v109 .works-viewer-head h2 {
  margin: 0;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .15em;
  font-size: clamp(18px, 1.75vw, 32px);
  line-height: 1.06;
  color: rgba(243,240,232,.92);
}
body.works-v109 .works-viewer-head em {
  font-style: normal;
  font-size: 9px;
  color: rgba(243,240,232,.42);
}
body.works-v109 .works-viewer-desc {
  margin: 0;
  color: rgba(243,240,232,.60);
  font-size: clamp(12px, .85vw, 14px);
  line-height: 1.7;
}
body.works-v109 .works-viewer-tech {
  margin: clamp(18px, 2vw, 30px) 0 0;
  font-size: 9px;
  color: rgba(243,240,232,.42);
}
body.works-v109 .works-viewer-close {
  position: fixed;
  z-index: 2;
  top: clamp(16px, 2.4vw, 38px);
  right: clamp(18px, 2.8vw, 48px);
  width: 40px;
  height: 40px;
  border: 1px solid rgba(243,240,232,.16);
  background: rgba(0,0,0,.35);
  color: rgba(243,240,232,.76);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease;
}
body.works-v109 .works-viewer-close:hover {
  color: rgba(255,255,255,.94);
  border-color: rgba(243,240,232,.36);
  background: rgba(243,240,232,.055);
  transform: translateY(-1px);
}
@media (max-width: 1500px) {
  body.works-v109 .work-side-panel {
    left: auto;
    right: clamp(14px, 1.4vw, 22px);
    top: clamp(14px, 1.4vw, 22px);
    transform: translateX(8px) translateY(6px);
  }
  body.works-v109 .work-info-asset:hover .work-side-panel,
  body.works-v109 .work-info-asset:focus-visible .work-side-panel {
    transform: translateX(0) translateY(0);
  }
}
@media (max-width: 900px) {
  body.works-v109 .work-side-panel { display: none; }
  body.works-v109 .works-viewer-card {
    grid-template-columns: 1fr;
    width: min(94vw, 900px);
    max-height: 88vh;
    overflow-y: auto;
  }
  body.works-v109 .works-viewer-image-wrap,
  body.works-v109 .works-viewer-info {
    min-height: 0;
    max-height: none;
  }
  body.works-v109 .works-viewer-image { max-height: 64vh; }
  body.works-v109 .works-viewer-info { padding: 18px; }
}

/* v110 — Professional Works hover/info panels: darker, attached to image, larger attached preview. */
body.works-v110 .works-v92 figure.work-info-asset {
  overflow: visible;
  z-index: 1;
}
body.works-v110 .works-v92 figure.work-info-asset:hover,
body.works-v110 .works-v92 figure.work-info-asset:focus-visible {
  z-index: 40;
}
body.works-v110 .works-v92 figure.work-info-asset::before {
  background: linear-gradient(90deg, transparent 68%, rgba(0,0,0,.20));
}
body.works-v110 .work-side-panel {
  top: 0;
  bottom: 0;
  left: 100%;
  right: auto;
  width: clamp(220px, 17vw, 320px);
  height: auto;
  min-height: 0;
  max-height: none;
  padding: clamp(14px, 1.32vw, 22px);
  align-content: end;
  background:
    linear-gradient(180deg, rgba(12,12,12,.985), rgba(4,4,4,.955)),
    radial-gradient(ellipse 120% 160% at 0% 0%, rgba(243,240,232,.026), transparent 76%);
  border-left: 0;
  color: rgba(243,240,232,.64);
  transform: translateX(-8px);
  box-shadow: 24px 28px 90px rgba(0,0,0,.50);
}
body.works-v110 .work-info-asset:hover .work-side-panel,
body.works-v110 .work-info-asset:focus-visible .work-side-panel {
  transform: translateX(0);
}
body.works-v110 .work-side-panel-head {
  padding-bottom: 10px;
  border-bottom-color: rgba(243,240,232,.055);
}
body.works-v110 .work-side-panel small {
  color: rgba(243,240,232,.55);
}
body.works-v110 .work-side-tech {
  color: rgba(243,240,232,.32);
}
body.works-v110 .asset-card .work-side-panel {
  width: clamp(205px, 15vw, 285px);
}
body.works-v110 .asset-card.span-wide .work-side-panel,
body.works-v110 .works-v92-hero-frame .work-side-panel {
  width: clamp(245px, 19vw, 360px);
}

/* Override previous responsive rule that pushed panels inside the artwork. */
@media (min-width: 901px) {
  body.works-v110 .work-side-panel {
    top: 0;
    bottom: 0;
    left: 100%;
    right: auto;
    transform: translateX(-8px);
  }
  body.works-v110 .work-info-asset:hover .work-side-panel,
  body.works-v110 .work-info-asset:focus-visible .work-side-panel {
    transform: translateX(0);
  }
}

body.works-v110 .works-viewer {
  background:
    radial-gradient(ellipse 92vw 44vh at 50% 50%, rgba(225,232,230,.045), transparent 70%),
    rgba(0,0,0,.92);
}
body.works-v110 .works-viewer-card {
  width: min(94vw, 1660px);
  max-height: 89vh;
  grid-template-columns: minmax(0, 1fr) clamp(290px, 24vw, 430px);
  gap: 0;
  align-items: stretch;
  box-shadow: 0 48px 160px rgba(0,0,0,.68);
}
body.works-v110 .works-viewer-image-wrap {
  min-height: min(74vh, 820px);
  max-height: 84vh;
  box-shadow: none;
  background: #000;
}
body.works-v110 .works-viewer-image {
  max-height: 84vh;
}
body.works-v110 .works-viewer-info {
  min-height: min(74vh, 820px);
  background:
    linear-gradient(180deg, rgba(13,13,13,.99), rgba(5,5,5,.96)),
    radial-gradient(ellipse 120% 120% at 0% 0%, rgba(243,240,232,.025), transparent 72%);
  border-left: 0;
}
@media (max-width: 900px) {
  body.works-v110 .works-viewer-card {
    grid-template-columns: 1fr;
    width: min(94vw, 900px);
    gap: 0;
  }
}


/* v111 — fixed Professional Works hover panels + darker flat panels. */
body.works-v111 .works-v92 figure.work-info-asset::before {
  display: none !important;
  background: none !important;
}
body.works-v111 .works-v92 figure.work-info-asset {
  overflow: visible;
  z-index: auto;
}
body.works-v111 .works-v92 figure.work-info-asset:hover,
body.works-v111 .works-v92 figure.work-info-asset:focus-visible {
  z-index: 80;
}
body.works-v111 .work-side-panel {
  display: none !important;
}
body.works-v111 .works-hover-panel-floating {
  position: fixed;
  z-index: 260;
  left: 0;
  top: 0;
  width: 300px;
  height: 260px;
  padding: clamp(15px, 1.35vw, 24px);
  display: grid;
  align-content: end;
  gap: clamp(11px, 1vw, 17px);
  pointer-events: none;
  opacity: 0;
  transform: translateX(-10px);
  background: #070707;
  color: rgba(243,240,232,.64);
  box-shadow: 26px 34px 95px rgba(0,0,0,.56);
  transition: opacity .18s ease, transform .30s cubic-bezier(.16,1,.3,1);
}
body.works-v111 .works-hover-panel-floating.is-visible {
  opacity: 1;
  transform: translateX(0);
}
body.works-v111 .works-hover-panel-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 10px;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .14em;
}
body.works-v111 .works-hover-panel-head strong {
  font-size: clamp(10px, .72vw, 13px);
  font-weight: 500;
  color: rgba(243,240,232,.88);
}
body.works-v111 .works-hover-panel-head em {
  font-size: clamp(8px, .56vw, 10px);
  font-style: normal;
  color: rgba(243,240,232,.36);
}
body.works-v111 .works-hover-panel-floating small {
  display: block;
  margin: 0;
  font: 400 clamp(10px, .72vw, 13px)/1.62 var(--font-main);
  color: rgba(243,240,232,.55);
}
body.works-v111 .works-hover-panel-tech {
  margin: 0;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: clamp(8px, .54vw, 10px);
  line-height: 1.55;
  color: rgba(243,240,232,.32);
}
body.works-v111 .works-viewer-info {
  background: #060606 !important;
  border-left: 0 !important;
}
body.works-v111 .works-viewer-card {
  gap: 0 !important;
}
body.works-v111 .works-viewer-image-wrap {
  background: #000 !important;
}
@media (max-width: 900px) {
  body.works-v111 .works-hover-panel-floating { display: none !important; }
}

/* v109 — Personal Art: almost-black flat hover detail panels, no gradient. */
body.personal-v109 .pa108-detail-panel {
  background: #070707 !important;
  border-top: 0 !important;
  box-shadow: 0 28px 88px rgba(0,0,0,.58);
}
body.personal-v109 .pa108-detail-panel::before,
body.personal-v109 .pa108-detail-panel::after {
  display: none !important;
}


/* v112 — Professional Works: attached non-moving side panels, no image brighten/zoom, glow behind hovered art, darker panels, title-screen header art. */
body.works-v112 .works-v92-main {
  position: relative;
  overflow: hidden;
  background: #000;
}
body.works-v112 .works-v92-main::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: clamp(420px, 34vw, 760px);
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.42) 72%, rgba(0,0,0,1) 100%);
}
body.works-v112 .works-v112-top-art {
  position: absolute;
  z-index: 0;
  left: 0;
  top: 0;
  width: 100%;
  pointer-events: none;
  opacity: .58;
}
body.works-v112 .works-v112-top-art img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: top center;
  filter: none !important;
  transform: none !important;
}
body.works-v112 .works-v112-top-art::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.22) 33%, rgba(0,0,0,.30) 68%, rgba(0,0,0,.86) 100%),
    linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.18) 48%, rgba(0,0,0,.92) 100%);
}
body.works-v112 .works-v92-main > :not(.works-v112-top-art) {
  position: relative;
  z-index: 1;
}
body.works-v112 .works-v92-intro {
  padding-top: calc(var(--header-h) + clamp(92px, 12vw, 210px));
}
body.works-v112 .works-v92 img,
body.works-v112 .works-v92 figure:hover img,
body.works-v112 .works-v92 figure:focus-visible img {
  filter: none !important;
  transform: none !important;
}
body.works-v112 .works-v92 img {
  transition: none !important;
}
body.works-v112 .works-v92 figure.work-info-asset {
  overflow: visible !important;
  isolation: isolate;
  z-index: 2;
}
body.works-v112 .works-v92 figure.work-info-asset:hover,
body.works-v112 .works-v92 figure.work-info-asset:focus-visible {
  z-index: 120;
}
body.works-v112 .works-v92 figure.work-info-asset::before {
  display: none !important;
  content: none !important;
}
body.works-v112 .works-v92 figure.work-info-asset::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: clamp(-42px, -2.6vw, -24px);
  pointer-events: none;
  opacity: 0;
  background:
    radial-gradient(ellipse 86% 72% at 50% 50%, rgba(245,242,232,.20) 0%, rgba(220,218,205,.095) 34%, rgba(180,178,165,.035) 56%, transparent 74%);
  transition: opacity .22s ease;
}
body.works-v112 .works-v92 figure.work-info-asset:hover::after,
body.works-v112 .works-v92 figure.work-info-asset:focus-visible::after {
  opacity: 1;
}
body.works-v112 .works-hover-panel-floating {
  display: none !important;
}
body.works-v112 .work-side-panel {
  display: grid !important;
  position: absolute !important;
  z-index: 24;
  top: 0 !important;
  right: auto !important;
  bottom: 0 !important;
  left: 100% !important;
  width: clamp(230px, 16.8vw, 330px) !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: clamp(14px, 1.28vw, 22px) !important;
  align-content: end;
  gap: clamp(10px, .9vw, 16px);
  opacity: 0;
  pointer-events: none;
  transform: none !important;
  background: #030303 !important;
  color: rgba(243,240,232,.62);
  border: 0 !important;
  box-shadow: 26px 34px 96px rgba(0,0,0,.62);
  transition: opacity .16s ease !important;
}
body.works-v112 .asset-card .work-side-panel {
  width: clamp(220px, 15.6vw, 305px) !important;
}
body.works-v112 .asset-card.span-wide .work-side-panel,
body.works-v112 .works-v92-hero-frame .work-side-panel {
  width: clamp(260px, 19vw, 380px) !important;
}
body.works-v112 .work-info-asset:hover .work-side-panel,
body.works-v112 .work-info-asset:focus-visible .work-side-panel {
  opacity: 1;
  transform: none !important;
}
body.works-v112 .work-side-panel-head {
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}
body.works-v112 .work-side-panel-head strong {
  color: rgba(243,240,232,.88);
}
body.works-v112 .work-side-panel-head em {
  color: rgba(243,240,232,.34);
}
body.works-v112 .work-side-panel small {
  color: rgba(243,240,232,.52);
}
body.works-v112 .work-side-tech {
  color: rgba(243,240,232,.30);
}
body.works-v112 .works-viewer-card {
  gap: 0 !important;
}
body.works-v112 .works-viewer-info {
  background: #030303 !important;
  border-left: 0 !important;
}
@media (max-width: 1500px) and (min-width: 901px) {
  body.works-v112 .work-side-panel {
    width: clamp(210px, 16vw, 270px) !important;
  }
}
@media (max-width: 900px) {
  body.works-v112 .work-side-panel,
  body.works-v112 .works-hover-panel-floating {
    display: none !important;
  }
  body.works-v112 .works-v112-top-art {
    opacity: .42;
  }
  body.works-v112 .works-v92-intro {
    padding-top: calc(var(--header-h) + 84px);
  }
}


/* v113 — Works rail restored, true attached hover panels, 20% larger clicked preview, Personal Art title hero. */
body.works-v113 .works-v92-main {
  overflow: visible !important;
}
body.works-v113 .works-v92-main > .works-v92-rail {
  position: fixed !important;
  z-index: 80 !important;
}
body.works-v113 .works-v92-main > .works-hover-panel-floating {
  position: absolute !important;
  z-index: 170 !important;
}
body.works-v113 .works-v92-main > :not(.works-v112-top-art):not(.works-v92-rail):not(.works-hover-panel-floating) {
  position: relative;
  z-index: 1;
}
body.works-v113 .work-side-panel {
  display: none !important;
}
body.works-v113 .works-hover-panel-floating {
  display: grid !important;
  align-content: end;
  gap: clamp(10px, .9vw, 16px);
  padding: clamp(14px, 1.28vw, 22px);
  background: #010101 !important;
  color: rgba(243,240,232,.60);
  border: 0 !important;
  box-shadow: 26px 34px 96px rgba(0,0,0,.68);
  opacity: 0;
  pointer-events: none;
  transform: none !important;
  transition: opacity .16s ease !important;
}
body.works-v113 .works-hover-panel-floating.is-visible {
  opacity: 1;
  transform: none !important;
}
body.works-v113 .works-hover-panel-head {
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}
body.works-v113 .works-hover-panel-floating small {
  color: rgba(243,240,232,.50) !important;
}
body.works-v113 .works-hover-panel-tech {
  color: rgba(243,240,232,.28) !important;
}
body.works-v113 .works-v92 figure.work-info-asset::after {
  inset: clamp(-48px, -3vw, -26px) !important;
  background: radial-gradient(ellipse 88% 74% at 50% 50%, rgba(245,242,232,.23) 0%, rgba(220,218,205,.105) 35%, rgba(180,178,165,.038) 57%, transparent 75%) !important;
}
body.works-v113 .works-viewer-card {
  width: min(80vw, 1440px) !important;
  transform-origin: center center !important;
  transform: translateY(10px) scale(1.02) !important;
  transition: transform .32s cubic-bezier(.16,1,.3,1) !important;
}
body.works-v113 .works-viewer.is-open .works-viewer-card {
  transform: translateY(0) scale(1.2) !important;
}
body.works-v113 .works-viewer-info,
body.works-v113 .works-viewer-image-wrap {
  background: #010101 !important;
}
body.works-v113 .works-viewer-info {
  border-left: 0 !important;
}

body.personal-v113 .personal-v93-main {
  position: relative;
  overflow: visible;
  min-height: 100vh;
  background: #000;
}
body.personal-v113 .personal-v93-main::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: clamp(420px, 34vw, 760px);
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.42) 72%, rgba(0,0,0,1) 100%);
}
body.personal-v113 .personal-v113-top-art {
  position: absolute;
  z-index: 0;
  left: 0;
  top: 0;
  width: 100%;
  pointer-events: none;
  opacity: .58;
}
body.personal-v113 .personal-v113-top-art img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: top center;
  filter: none !important;
  transform: none !important;
}
body.personal-v113 .personal-v113-top-art::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.20) 34%, rgba(0,0,0,.28) 68%, rgba(0,0,0,.86) 100%),
    linear-gradient(180deg, rgba(0,0,0,.16) 0%, rgba(0,0,0,.18) 48%, rgba(0,0,0,.94) 100%);
}
body.personal-v113 .personal-v93-main > :not(.personal-v113-top-art) {
  position: relative;
  z-index: 1;
}
body.personal-v113 .personal-v113-intro {
  width: min(1120px, calc(100vw - 260px));
  margin: 0 auto;
  padding: calc(var(--header-h) + clamp(92px, 12vw, 210px)) 0 clamp(52px, 8vh, 96px);
  display: grid;
  grid-template-columns: minmax(240px, 420px) minmax(380px, 1fr);
  gap: clamp(44px, 7vw, 120px);
  align-items: end;
  border-bottom: 1px solid rgba(243,240,232,.075);
}
body.personal-v113 .personal-v113-kicker,
body.personal-v113 .personal-v113-intro h1 {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .17em;
}
body.personal-v113 .personal-v113-kicker {
  margin: 0 0 15px;
  color: rgba(243,240,232,.34);
  font-size: 9px;
}
body.personal-v113 .personal-v113-intro h1 {
  margin: 0;
  font-size: clamp(30px, 3.3vw, 58px);
  line-height: 1;
  color: rgba(243,240,232,.93);
}
body.personal-v113 .personal-v113-intro-copy {
  margin: 0;
  max-width: 660px;
  color: rgba(243,240,232,.55);
  font-size: clamp(12px, .86vw, 14px);
  line-height: 1.68;
}
body.personal-v113 .pa93-opener {
  padding-top: clamp(48px, 7vh, 96px) !important;
}
body.personal-v113 .pa100-under-carousel {
  display: none !important;
}
@media (max-width: 1180px) {
  body.works-v113 .works-v92-main > .works-v92-rail {
    position: sticky !important;
    top: var(--header-h) !important;
    z-index: 70 !important;
  }
  body.personal-v113 .personal-v113-intro {
    width: calc(100% - 36px);
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
@media (max-width: 900px) {
  body.works-v113 .works-hover-panel-floating {
    display: none !important;
  }
  body.works-v113 .works-viewer-card,
  body.works-v113 .works-viewer.is-open .works-viewer-card {
    width: min(94vw, 900px) !important;
    transform: none !important;
  }
}
@media (max-width: 640px) {
  body.personal-v113 .personal-v113-intro {
    padding-top: calc(var(--header-h) + 84px);
  }
  body.personal-v113 .personal-v113-intro h1 {
    font-size: clamp(30px, 11vw, 48px);
  }
  body.personal-v113 .personal-v113-top-art {
    opacity: .42;
  }
}


/* v114 — fixed Works hover cards + clean section header spacing. */
body.works-v114 .works-v92-main,
body.works-v114 .works-v92-content,
body.works-v114 .works-v92-case,
body.works-v114 .works-v92-grid {
  overflow: visible !important;
}
body.works-v114 .works-v92-main {
  position: relative;
  background: #000 !important;
}
body.works-v114 .works-v112-top-art {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: clamp(430px, 34vw, 650px) !important;
  overflow: hidden !important;
  opacity: .62 !important;
  z-index: 0 !important;
}
body.works-v114 .works-v112-top-art img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
  filter: none !important;
  transform: none !important;
}
body.works-v114 .works-v112-top-art::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.18) 34%, rgba(0,0,0,.26) 68%, rgba(0,0,0,.88) 100%),
    linear-gradient(180deg, rgba(0,0,0,.14) 0%, rgba(0,0,0,.16) 50%, rgba(0,0,0,1) 100%);
}
body.works-v114 .works-v92-main::before {
  height: clamp(430px, 34vw, 650px) !important;
}
body.works-v114 .works-v92-intro {
  min-height: clamp(430px, 34vw, 650px) !important;
  box-sizing: border-box;
  padding-top: calc(var(--header-h) + clamp(70px, 8vw, 150px)) !important;
  padding-bottom: clamp(70px, 9vh, 130px) !important;
}
body.works-v114 .works-v92-content {
  padding-top: clamp(64px, 8vh, 120px) !important;
}
body.works-v114 .works-v92-main > .works-v92-rail {
  position: fixed !important;
  left: clamp(22px, 3.2vw, 64px) !important;
  top: 36vh !important;
  z-index: 240 !important;
  display: grid !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  pointer-events: auto !important;
}
body.works-v114 .works-hover-panel-floating {
  display: none !important;
}
body.works-v114 .works-v92 figure.work-info-asset {
  overflow: visible !important;
  position: relative !important;
  isolation: isolate;
  z-index: 2;
}
body.works-v114 .works-v92 figure.work-info-asset:hover,
body.works-v114 .works-v92 figure.work-info-asset:focus-visible {
  z-index: 180 !important;
}
body.works-v114 .works-v92 img,
body.works-v114 .works-v92 figure:hover img,
body.works-v114 .works-v92 figure:focus-visible img {
  filter: none !important;
  transform: none !important;
  transition: none !important;
}
body.works-v114 .works-v92 figure.work-info-asset::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: clamp(-52px, -3.2vw, -28px) !important;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(ellipse 90% 76% at 50% 50%, rgba(245,242,232,.24) 0%, rgba(220,218,205,.11) 36%, rgba(180,178,165,.04) 58%, transparent 76%) !important;
  transition: opacity .18s ease !important;
}
body.works-v114 .works-v92 figure.work-info-asset:hover::after,
body.works-v114 .works-v92 figure.work-info-asset:focus-visible::after {
  opacity: 1;
}
body.works-v114 .work-side-panel {
  display: grid !important;
  position: absolute !important;
  z-index: 40 !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 100% !important;
  right: auto !important;
  width: clamp(230px, 16vw, 330px) !important;
  height: auto !important;
  min-height: 0 !important;
  padding: clamp(14px, 1.25vw, 22px) !important;
  align-content: end;
  gap: clamp(10px, .9vw, 16px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: none !important;
  background: #010101 !important;
  color: rgba(243,240,232,.58) !important;
  border: 0 !important;
  box-shadow: 28px 36px 100px rgba(0,0,0,.72) !important;
  transition: opacity .14s ease, visibility .14s ease !important;
}
body.works-v114 .asset-card .work-side-panel {
  width: clamp(220px, 15vw, 305px) !important;
}
body.works-v114 .asset-card.span-wide .work-side-panel,
body.works-v114 .works-v92-hero-frame .work-side-panel {
  width: clamp(260px, 18vw, 390px) !important;
}
body.works-v114 .work-info-asset:hover .work-side-panel,
body.works-v114 .work-info-asset:focus-visible .work-side-panel {
  opacity: 1 !important;
  visibility: visible !important;
}
body.works-v114 .work-side-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 18px;
  border: 0 !important;
  padding: 0 !important;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .14em;
}
body.works-v114 .work-side-panel-head strong {
  color: rgba(243,240,232,.88) !important;
  font-size: clamp(10px, .72vw, 13px);
  font-weight: 500;
}
body.works-v114 .work-side-panel-head em {
  color: rgba(243,240,232,.32) !important;
  font-size: clamp(8px, .56vw, 10px);
  font-style: normal;
}
body.works-v114 .work-side-panel small {
  display: block;
  color: rgba(243,240,232,.48) !important;
  font: 400 clamp(10px, .72vw, 13px)/1.62 var(--font-main);
}
body.works-v114 .work-side-tech {
  margin: 0;
  color: rgba(243,240,232,.26) !important;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: clamp(8px, .54vw, 10px);
  line-height: 1.55;
}
body.works-v114 .works-viewer-card {
  gap: 0 !important;
  width: min(80vw, 1440px) !important;
  transform-origin: center center !important;
  transform: translateY(10px) scale(1.02) !important;
  transition: transform .32s cubic-bezier(.16,1,.3,1) !important;
}
body.works-v114 .works-viewer.is-open .works-viewer-card {
  transform: translateY(0) scale(1.2) !important;
}
body.works-v114 .works-viewer-info,
body.works-v114 .works-viewer-image-wrap {
  background: #010101 !important;
}
body.works-v114 .works-viewer-info {
  border-left: 0 !important;
}

/* v114 — Personal Art: new wide header image and clean gap before carousel. */
body.personal-v114 .personal-v93-main {
  position: relative;
  overflow: hidden !important;
  min-height: 100vh;
  background: #000 !important;
}
body.personal-v114 .personal-v93-main::before {
  height: clamp(430px, 34vw, 650px) !important;
}
body.personal-v114 .personal-v113-top-art {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: clamp(430px, 34vw, 650px) !important;
  overflow: hidden !important;
  opacity: .62 !important;
  z-index: 0 !important;
}
body.personal-v114 .personal-v113-top-art img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
  filter: none !important;
  transform: none !important;
}
body.personal-v114 .personal-v113-top-art::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.76) 0%, rgba(0,0,0,.17) 34%, rgba(0,0,0,.25) 68%, rgba(0,0,0,.88) 100%),
    linear-gradient(180deg, rgba(0,0,0,.13) 0%, rgba(0,0,0,.16) 50%, rgba(0,0,0,1) 100%);
}
body.personal-v114 .personal-v93-main > :not(.personal-v113-top-art) {
  position: relative;
  z-index: 1;
}
body.personal-v114 .personal-v113-intro {
  min-height: clamp(430px, 34vw, 650px) !important;
  box-sizing: border-box;
  padding-top: calc(var(--header-h) + clamp(70px, 8vw, 150px)) !important;
  padding-bottom: clamp(70px, 9vh, 130px) !important;
  margin-bottom: clamp(68px, 8vh, 124px) !important;
}
body.personal-v114 .pa93-opener {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
body.personal-v114 .pa94-carousel {
  margin-top: 0 !important;
}
body.personal-v114 .pa100-under-carousel {
  display: none !important;
}
@media (max-width: 1180px) {
  body.works-v114 .works-v92-main > .works-v92-rail {
    position: fixed !important;
    top: 35vh !important;
  }
  body.works-v114 .work-side-panel { display: none !important; }
  body.personal-v114 .personal-v113-intro {
    width: calc(100% - 36px);
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
@media (max-width: 900px) {
  body.works-v114 .works-v92-main > .works-v92-rail {
    display: none !important;
  }
  body.works-v114 .works-viewer-card,
  body.works-v114 .works-viewer.is-open .works-viewer-card {
    width: min(94vw, 900px) !important;
    transform: none !important;
  }
}
@media (max-width: 640px) {
  body.works-v114 .works-v112-top-art,
  body.personal-v114 .personal-v113-top-art {
    height: 420px !important;
    opacity: .48 !important;
  }
  body.works-v114 .works-v92-intro,
  body.personal-v114 .personal-v113-intro {
    min-height: 420px !important;
    padding-top: calc(var(--header-h) + 84px) !important;
  }
}


/* v115 — Professional Works hover-only cards: no click, no image dim/brighten, no internal zoom. */
body.works-v115 main.works-v92-main,
body.works-v115 .works-v92-content,
body.works-v115 .works-v92-case,
body.works-v115 .works-v92-grid,
body.works-v115 .works-v92-mosaic {
  overflow: visible !important;
}

body.works-v115 .works-v92-main > .works-v92-rail,
body.works-v115 .works-v92-rail {
  position: fixed !important;
  left: clamp(22px, 3.2vw, 64px) !important;
  top: 36vh !important;
  z-index: 240 !important;
  display: grid !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
}

body.works-v115 .works-viewer,
body.works-v115 .works-hover-panel-floating {
  display: none !important;
}

body.works-v115 .work-info-asset {
  position: relative !important;
  overflow: visible !important;
  isolation: isolate !important;
  cursor: default !important;
  z-index: 2;
  transform: scale(1) !important;
  transform-origin: center center !important;
  transition: transform .22s cubic-bezier(.16,1,.3,1), z-index .01s linear !important;
}

body.works-v115 .work-info-asset:hover,
body.works-v115 .work-info-asset:focus-visible {
  z-index: 220 !important;
  transform: scale(1.018) !important;
}

body.works-v115 .work-info-asset::before {
  display: none !important;
  content: none !important;
  background: none !important;
}

body.works-v115 .work-info-asset::after {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: clamp(-48px, -3vw, -26px) !important;
  pointer-events: none !important;
  opacity: 0 !important;
  background: radial-gradient(ellipse 88% 74% at 50% 50%, rgba(245,242,232,.22) 0%, rgba(220,218,205,.10) 36%, rgba(180,178,165,.04) 58%, transparent 76%) !important;
  transition: opacity .18s ease !important;
}

body.works-v115 .work-info-asset:hover::after,
body.works-v115 .work-info-asset:focus-visible::after {
  opacity: 1 !important;
}

body.works-v115 main.works-v92-main figure img,
body.works-v115 main.works-v92-main figure:hover img,
body.works-v115 main.works-v92-main figure:focus-visible img,
body.works-v115 .works-v92-content img,
body.works-v115 .works-v92-content figure:hover img,
body.works-v115 .works-v92-content figure:focus-visible img {
  filter: none !important;
  transform: none !important;
  transition: none !important;
}

body.works-v115 .work-side-panel {
  display: grid !important;
  position: absolute !important;
  z-index: 40 !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 100% !important;
  right: auto !important;
  width: clamp(235px, 16vw, 335px) !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: clamp(14px, 1.25vw, 22px) !important;
  align-content: end !important;
  gap: clamp(10px, .9vw, 16px) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: none !important;
  background: #010101 !important;
  color: rgba(243,240,232,.58) !important;
  border: 0 !important;
  box-shadow: 28px 36px 100px rgba(0,0,0,.74) !important;
  transition: opacity .14s ease, visibility .14s ease !important;
}

body.works-v115 .asset-card .work-side-panel {
  width: clamp(220px, 15vw, 310px) !important;
}

body.works-v115 .asset-card.span-wide .work-side-panel,
body.works-v115 .works-v92-hero-frame .work-side-panel,
body.works-v115 .works-v92-mosaic .wide .work-side-panel,
body.works-v115 .works-v92-mosaic .large .work-side-panel {
  width: clamp(260px, 18vw, 390px) !important;
}

body.works-v115 .work-info-asset:hover .work-side-panel,
body.works-v115 .work-info-asset:focus-visible .work-side-panel {
  opacity: 1 !important;
  visibility: visible !important;
}

body.works-v115 .work-side-panel-head {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 18px !important;
  padding: 0 0 10px 0 !important;
  border: 0 !important;
  font-family: var(--mono) !important;
  text-transform: uppercase !important;
  letter-spacing: .14em !important;
}

body.works-v115 .work-side-panel-head strong {
  color: rgba(243,240,232,.90) !important;
  font-size: clamp(10px, .72vw, 13px) !important;
  font-weight: 500 !important;
}

body.works-v115 .work-side-panel-head em {
  color: rgba(243,240,232,.32) !important;
  font-size: clamp(8px, .56vw, 10px) !important;
  font-style: normal !important;
}

body.works-v115 .work-side-panel small {
  display: block !important;
  color: rgba(243,240,232,.50) !important;
  font: 400 clamp(10px, .72vw, 13px)/1.62 var(--font-main) !important;
}

body.works-v115 .work-side-tech {
  margin: 0 !important;
  color: rgba(243,240,232,.28) !important;
  font-family: var(--mono) !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  font-size: clamp(8px, .54vw, 10px) !important;
  line-height: 1.55 !important;
}

@media (max-width: 1180px) {
  body.works-v115 .work-side-panel {
    display: none !important;
  }
  body.works-v115 .work-info-asset:hover,
  body.works-v115 .work-info-asset:focus-visible {
    transform: scale(1.01) !important;
  }
}

@media (max-width: 900px) {
  body.works-v115 .works-v92-rail {
    display: none !important;
  }
}


/* v116 — remove Professional Works hover glow/grey strip; add subtle full-page Personal Art background gradient. */
body.works-v116 .work-info-asset::before,
body.works-v116 .work-info-asset::after,
body.works-v116 .work-info-asset:hover::before,
body.works-v116 .work-info-asset:hover::after,
body.works-v116 .work-info-asset:focus-visible::before,
body.works-v116 .work-info-asset:focus-visible::after {
  display: none !important;
  content: none !important;
  opacity: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

body.works-v116 .work-info-asset,
body.works-v116 .work-info-asset:hover,
body.works-v116 .work-info-asset:focus-visible {
  background: transparent !important;
}

body.personal-v116,
body.personal-v116 .personal-v93-main {
  background:
    radial-gradient(ellipse 86vw 58vh at 52% 48%, rgba(243,240,232,.045), rgba(243,240,232,.018) 34%, transparent 72%),
    radial-gradient(ellipse 54vw 44vh at 16% 70%, rgba(122,128,128,.035), transparent 70%),
    radial-gradient(ellipse 48vw 38vh at 84% 76%, rgba(96,86,72,.028), transparent 76%),
    linear-gradient(180deg, #000 0%, #050505 38%, #070707 58%, #030303 82%, #000 100%) !important;
}

body.personal-v116 .pa94-carousel,
body.personal-v116 .pa93-gallery-section,
body.personal-v116 .pa93-opener {
  background: transparent !important;
}

body.personal-v116 .pa94-track-wrap::before {
  opacity: .72 !important;
}

body.personal-v116 .pa108-detail-panel {
  background: #010101 !important;
  box-shadow:
    0 34px 110px rgba(0,0,0,.82),
    0 0 0 1px rgba(243,240,232,.045) inset !important;
  border-top: 0 !important;
}

body.personal-v116 .personal-v113-top-art::after {
  background:
    linear-gradient(90deg, rgba(0,0,0,.76) 0%, rgba(0,0,0,.17) 34%, rgba(0,0,0,.25) 68%, rgba(0,0,0,.88) 100%),
    linear-gradient(180deg, rgba(0,0,0,.12) 0%, rgba(0,0,0,.16) 48%, rgba(0,0,0,.96) 100%) !important;
}

/* v117 — move the subtle page gradient from Personal Art to Professional Works. No hover glow/strip, no image dim/brighten, no click preview. */
body.works-v117,
body.works-v117 .works-v92-main {
  background:
    radial-gradient(ellipse 82vw 52vh at 50% 54%, rgba(243,240,232,.044), rgba(243,240,232,.015) 38%, transparent 72%),
    radial-gradient(ellipse 48vw 34vh at 12% 68%, rgba(112,120,122,.032), transparent 72%),
    radial-gradient(ellipse 46vw 32vh at 88% 74%, rgba(92,82,70,.026), transparent 76%),
    linear-gradient(180deg, #000 0%, #030303 34%, #070707 58%, #030303 84%, #000 100%) !important;
}

body.works-v117 .works-v92-content,
body.works-v117 .works-v92-case,
body.works-v117 .works-v92-grid,
body.works-v117 .works-v92-mosaic {
  background: transparent !important;
}

body.works-v117 .work-info-asset::before,
body.works-v117 .work-info-asset::after,
body.works-v117 .work-info-asset:hover::before,
body.works-v117 .work-info-asset:hover::after,
body.works-v117 .work-info-asset:focus-visible::before,
body.works-v117 .work-info-asset:focus-visible::after {
  display: none !important;
  content: none !important;
  opacity: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

body.works-v117 .work-info-asset,
body.works-v117 .work-info-asset:hover,
body.works-v117 .work-info-asset:focus-visible {
  background: transparent !important;
  box-shadow: none !important;
}

body.works-v117 main.works-v92-main figure img,
body.works-v117 main.works-v92-main figure:hover img,
body.works-v117 main.works-v92-main figure:focus-visible img,
body.works-v117 .works-v92-content img,
body.works-v117 .works-v92-content figure:hover img,
body.works-v117 .works-v92-content figure:focus-visible img {
  filter: none !important;
  transform: none !important;
}

body.works-v117 .works-viewer,
body.works-v117 .works-hover-panel-floating {
  display: none !important;
}

/* Undo v116 Personal Art page-wide gradient/background change. */
body.personal-v117,
body.personal-v117 .personal-v93-main {
  background: #000 !important;
}

body.personal-v117 .pa93-opener,
body.personal-v117 .pa93-gallery-section {
  background: transparent !important;
}

body.personal-v117 .pa94-carousel {
  background: #000 !important;
}

body.personal-v117 .pa94-track-wrap::before {
  opacity: 0 !important;
}

body.personal-v117 .pa108-detail-panel {
  background: #070707 !important;
  border-top: 0 !important;
  box-shadow: 0 28px 88px rgba(0,0,0,.58) !important;
}

/* v118 — correct target gradients + keep Professional Works hover-only cards clean. */
body.works-v118,
body.works-v118 .works-v92-main {
  background:
    radial-gradient(ellipse 92vw 70vh at 68% 55%, rgba(205,198,178,.115), rgba(98,98,88,.052) 40%, rgba(0,0,0,0) 74%),
    radial-gradient(ellipse 62vw 48vh at 24% 70%, rgba(96,112,116,.070), rgba(45,54,56,.030) 43%, rgba(0,0,0,0) 72%),
    linear-gradient(180deg, #000 0%, #060606 31%, #0b0b0a 54%, #070707 78%, #000 100%) !important;
}

body.works-v118 .works-v92-main {
  position: relative !important;
  overflow: visible !important;
}

body.works-v118 .works-v92-main::after {
  content: "";
  position: absolute;
  z-index: 0;
  pointer-events: none;
  left: 0;
  right: 0;
  top: clamp(430px, 34vw, 650px);
  bottom: 0;
  background:
    radial-gradient(ellipse 72vw 44vh at 70% 12%, rgba(210,205,186,.130), rgba(112,112,102,.054) 42%, transparent 76%),
    radial-gradient(ellipse 82vw 58vh at 42% 46%, rgba(132,142,143,.060), rgba(48,54,54,.026) 44%, transparent 78%),
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(12,12,11,.96) 28%, rgba(8,8,8,.98) 72%, rgba(0,0,0,1) 100%);
}

body.works-v118 .works-v92-content,
body.works-v118 .works-v92-case,
body.works-v118 .works-v92-grid,
body.works-v118 .works-v92-mosaic {
  background: transparent !important;
  overflow: visible !important;
}

body.works-v118 .work-info-asset::before,
body.works-v118 .work-info-asset::after,
body.works-v118 .work-info-asset:hover::before,
body.works-v118 .work-info-asset:hover::after,
body.works-v118 .work-info-asset:focus-visible::before,
body.works-v118 .work-info-asset:focus-visible::after {
  display: none !important;
  content: none !important;
  opacity: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

body.works-v118 .work-info-asset {
  background: transparent !important;
  cursor: default !important;
  transform: scale(1) !important;
  transform-origin: center center !important;
  transition: transform .20s cubic-bezier(.16,1,.3,1), z-index .01s linear !important;
}

body.works-v118 .work-info-asset:hover,
body.works-v118 .work-info-asset:focus-visible {
  z-index: 220 !important;
  transform: scale(1.012) !important;
}

body.works-v118 main.works-v92-main figure img,
body.works-v118 main.works-v92-main figure:hover img,
body.works-v118 main.works-v92-main figure:focus-visible img,
body.works-v118 .works-v92-content img,
body.works-v118 .works-v92-content figure:hover img,
body.works-v118 .works-v92-content figure:focus-visible img {
  filter: none !important;
  transform: none !important;
  transition: none !important;
}

body.works-v118 .work-side-panel {
  background: #010101 !important;
  box-shadow:
    36px 44px 120px rgba(0,0,0,.76),
    0 0 0 1px rgba(243,240,232,.035) inset !important;
}

body.works-v118 .works-viewer,
body.works-v118 .works-hover-panel-floating {
  display: none !important;
}

/* Restore the Personal Works carousel glow/gradient from v115; do not add a page-wide gradient. */
body.personal-v118,
body.personal-v118 .personal-v93-main {
  background: #000 !important;
}

body.personal-v118 .pa93-opener,
body.personal-v118 .pa93-gallery-section {
  background: transparent !important;
}

body.personal-v118 .pa94-carousel {
  background:
    radial-gradient(ellipse 92vw 31vh at 50% 50%, rgba(214,226,224,.155), rgba(88,105,108,.060) 44%, rgba(0,0,0,0) 76%),
    radial-gradient(ellipse 64vw 16vh at 50% 70%, rgba(243,240,232,.060), transparent 72%),
    linear-gradient(90deg, #000 0%, rgba(0,0,0,.44) 10%, transparent 28%, transparent 72%, rgba(0,0,0,.44) 90%, #000 100%),
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.14) 78%, #000 100%),
    #000 !important;
}

body.personal-v118 .pa94-track-wrap::before {
  opacity: 1 !important;
  width: min(90vw, 1500px) !important;
  height: min(34vh, 340px) !important;
  background: radial-gradient(ellipse 58% 52% at 50% 50%, rgba(216,228,225,.145), rgba(102,124,126,.060) 45%, rgba(0,0,0,0) 78%) !important;
  filter: blur(30px) !important;
}

body.personal-v118 .pa108-detail-panel {
  background: #070707 !important;
  border-top: 0 !important;
  box-shadow: 0 28px 88px rgba(0,0,0,.58) !important;
}


/* v119 — title typography pass.
   Uses Instrument Serif only for display titles in Professional Works and Personal Art.
   Twój K. / Penance page, descriptions, captions, navigation and technical labels stay untouched. */
:root {
  --title-display: "Instrument Serif", Georgia, "Times New Roman", serif;
}

body.works-v119 .works-v92-intro h1,
body.works-v119 .works-v92-titleblock h2,
body.personal-v119 .personal-v113-intro h1,
body.personal-v119 .pa93-gallery-section > h2,
body.personal-v119 .pa94-feature-title,
body.personal-v119 .viewer-title {
  font-family: var(--title-display) !important;
  font-weight: 400 !important;
  text-transform: none !important;
  letter-spacing: -0.026em !important;
  line-height: .94 !important;
  font-synthesis: none !important;
  color: rgba(243,240,232,.94) !important;
}

body.works-v119 .works-v92-intro h1,
body.personal-v119 .personal-v113-intro h1 {
  font-size: clamp(48px, 6.4vw, 112px) !important;
  max-width: 720px;
}

body.works-v119 .works-v92-titleblock h2 {
  font-size: clamp(48px, 6.2vw, 104px) !important;
  max-width: 780px;
}

body.personal-v119 .pa93-gallery-section > h2 {
  font-size: clamp(42px, 5.4vw, 92px) !important;
  margin-bottom: clamp(22px, 3.2vh, 42px) !important;
}

body.personal-v119 .pa94-feature-title,
body.personal-v119 .viewer-title {
  font-size: clamp(30px, 3.6vw, 64px) !important;
}

body.works-v119 .work-side-panel-head {
  font-family: var(--mono) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

body.works-v119 .work-side-panel-head strong {
  font-family: var(--title-display) !important;
  font-weight: 400 !important;
  text-transform: none !important;
  letter-spacing: -0.018em !important;
  line-height: 1 !important;
  font-size: clamp(22px, 1.55vw, 32px) !important;
  color: rgba(243,240,232,.92) !important;
}

body.works-v119 .work-side-panel-head em {
  font-family: var(--mono) !important;
  text-transform: uppercase !important;
  letter-spacing: .13em !important;
}

@media (max-width: 900px) {
  body.works-v119 .works-v92-intro h1,
  body.personal-v119 .personal-v113-intro h1 {
    font-size: clamp(46px, 13vw, 76px) !important;
  }

  body.works-v119 .works-v92-titleblock h2,
  body.personal-v119 .pa93-gallery-section > h2 {
    font-size: clamp(42px, 12vw, 68px) !important;
  }
}


/* v120 — title typography correction.
   Replaces the too-soft serif from v119 with Geist: modern, serious, technical sans.
   Still only affects title typography in Professional Works and Personal Art.
   Twój K. / Penance, descriptions, captions, navigation and technical labels stay untouched. */
:root {
  --title-display: "Geist", "Manrope", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.works-v120 .works-v92-intro h1,
body.works-v120 .works-v92-titleblock h2,
body.personal-v120 .personal-v113-intro h1,
body.personal-v120 .pa93-gallery-section > h2,
body.personal-v120 .pa94-feature-title,
body.personal-v120 .viewer-title {
  font-family: var(--title-display) !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: -0.045em !important;
  line-height: .90 !important;
  font-synthesis: none !important;
  color: rgba(243,240,232,.94) !important;
}

body.works-v120 .works-v92-intro h1,
body.personal-v120 .personal-v113-intro h1 {
  font-size: clamp(48px, 6.15vw, 108px) !important;
  max-width: 760px;
}

body.works-v120 .works-v92-titleblock h2 {
  font-size: clamp(48px, 5.95vw, 100px) !important;
  max-width: 820px;
}

body.personal-v120 .pa93-gallery-section > h2 {
  font-size: clamp(40px, 5.05vw, 86px) !important;
  margin-bottom: clamp(22px, 3.2vh, 42px) !important;
}

body.personal-v120 .pa94-feature-title,
body.personal-v120 .viewer-title {
  font-size: clamp(26px, 3.0vw, 54px) !important;
  letter-spacing: -0.035em !important;
}

body.works-v120 .work-side-panel-head {
  font-family: var(--mono) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

body.works-v120 .work-side-panel-head strong {
  font-family: var(--title-display) !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: -0.032em !important;
  line-height: .98 !important;
  font-size: clamp(21px, 1.42vw, 30px) !important;
  color: rgba(243,240,232,.92) !important;
}

body.works-v120 .work-side-panel-head em {
  font-family: var(--mono) !important;
  text-transform: uppercase !important;
  letter-spacing: .13em !important;
}

@media (max-width: 900px) {
  body.works-v120 .works-v92-intro h1,
  body.personal-v120 .personal-v113-intro h1 {
    font-size: clamp(44px, 12vw, 72px) !important;
  }

  body.works-v120 .works-v92-titleblock h2,
  body.personal-v120 .pa93-gallery-section > h2 {
    font-size: clamp(40px, 11vw, 64px) !important;
  }
}


/* v121 — title type correction, closer to the previous technical direction.
   Uses IBM Plex Sans Condensed: same sober IBM family as the earlier mono system,
   but less heavy and less shouty. Only title typography in Professional Works and Personal Art is touched.
   Twój K., descriptions, captions, navigation and small technical labels stay unchanged. */
:root {
  --title-display: "IBM Plex Sans Condensed", "IBM Plex Mono", "Geist", "Manrope", Inter, ui-sans-serif, system-ui, sans-serif;
}

body.works-v121 .works-v92-intro h1,
body.works-v121 .works-v92-titleblock h2,
body.personal-v121 .personal-v113-intro h1,
body.personal-v121 .pa93-gallery-section > h2,
body.personal-v121 .pa94-feature-title,
body.personal-v121 .viewer-title {
  font-family: var(--title-display) !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: -0.018em !important;
  line-height: .96 !important;
  font-synthesis: none !important;
  color: rgba(243,240,232,.93) !important;
}

/* Main page titles — smaller and kept as one line on desktop. */
body.works-v121 .works-v92-intro h1,
body.personal-v121 .personal-v113-intro h1 {
  font-size: clamp(40px, 4.45vw, 82px) !important;
  max-width: none !important;
  white-space: nowrap !important;
}

/* Professional Works case titles: Sancticide / Slavicpunk / Slavicpunk RPG. */
body.works-v121 .works-v92-titleblock h2 {
  font-size: clamp(38px, 4.15vw, 76px) !important;
  max-width: none !important;
  white-space: nowrap !important;
}

/* Personal Art section title. */
body.personal-v121 .pa93-gallery-section > h2 {
  font-size: clamp(34px, 3.85vw, 66px) !important;
  max-width: none !important;
  white-space: nowrap !important;
  margin-bottom: clamp(18px, 2.6vh, 34px) !important;
}

body.personal-v121 .pa94-feature-title,
body.personal-v121 .viewer-title {
  font-size: clamp(23px, 2.35vw, 42px) !important;
  letter-spacing: -0.014em !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body.works-v121 .work-side-panel-head {
  font-family: var(--mono) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

body.works-v121 .work-side-panel-head strong {
  font-family: var(--title-display) !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: -0.012em !important;
  line-height: 1 !important;
  font-size: clamp(18px, 1.08vw, 24px) !important;
  color: rgba(243,240,232,.91) !important;
  white-space: nowrap !important;
}

body.works-v121 .work-side-panel-head em {
  font-family: var(--mono) !important;
  text-transform: uppercase !important;
  letter-spacing: .13em !important;
}

@media (max-width: 900px) {
  body.works-v121 .works-v92-intro h1,
  body.personal-v121 .personal-v113-intro h1 {
    font-size: clamp(36px, 10.5vw, 62px) !important;
    white-space: normal !important;
  }

  body.works-v121 .works-v92-titleblock h2,
  body.personal-v121 .pa93-gallery-section > h2 {
    font-size: clamp(34px, 9.5vw, 56px) !important;
    white-space: normal !important;
  }

  body.personal-v121 .pa94-feature-title,
  body.personal-v121 .viewer-title,
  body.works-v121 .work-side-panel-head strong {
    white-space: normal !important;
  }
}

/* v123 — restore original title family, slightly reduce display title scale; add Personal Art side rail and Digital/Traditional sections. */
body.works-v123 .works-v92-intro h1,
body.personal-v123 .personal-v113-intro h1 {
  font-size: clamp(28px, 3.12vw, 55px) !important;
}

body.works-v123 .works-v92-titleblock h2 {
  font-size: clamp(39px, 5.06vw, 81px) !important;
}

body.personal-v123 .pa93-gallery-section > h2 {
  font-size: clamp(21px, 1.98vw, 38px) !important;
}

body.personal-v123 .personal-v93-main {
  overflow: visible !important;
}

body.personal-v123 .personal-v123-rail {
  position: fixed !important;
  left: clamp(22px, 3.2vw, 64px) !important;
  top: 36vh !important;
  z-index: 240 !important;
  display: grid !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
}

body.personal-v123 .personal-v123-rail a.is-active {
  color: rgba(243,240,232,.88) !important;
  transform: translateX(5px);
}

body.personal-v123 .personal-v123-art-section {
  position: relative;
  isolation: isolate;
  padding-top: clamp(54px, 7vh, 96px);
  padding-bottom: clamp(78px, 10vh, 140px);
  margin-top: clamp(78px, 11vh, 150px) !important;
}

body.personal-v123 .personal-v123-art-section::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  left: max(-6vw, -120px);
  right: max(-6vw, -120px);
  top: 0;
  bottom: 0;
  opacity: .62;
  background:
    radial-gradient(ellipse 78vw 42vh at 62% 18%, rgba(205,198,178,.072), rgba(98,98,88,.032) 42%, transparent 76%),
    radial-gradient(ellipse 64vw 46vh at 28% 60%, rgba(96,112,116,.044), rgba(45,54,56,.020) 44%, transparent 76%),
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(8,8,8,.58) 28%, rgba(9,9,8,.72) 66%, rgba(0,0,0,0) 100%);
}

body.personal-v123 #traditional-art {
  margin-top: clamp(42px, 7vh, 90px) !important;
}

@media (max-width: 1180px) {
  body.personal-v123 .personal-v123-rail {
    position: sticky !important;
    top: var(--header-h) !important;
    left: auto !important;
    width: auto !important;
    display: flex !important;
    gap: 22px !important;
    padding: 14px 18px !important;
    margin: 0 !important;
    background: rgba(0,0,0,.78) !important;
    border-top: 1px solid rgba(243,240,232,.07) !important;
    border-bottom: 1px solid rgba(243,240,232,.07) !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
  }
  body.personal-v123 .personal-v123-rail::before {
    display: none !important;
  }
}

@media (max-width: 900px) {
  body.personal-v123 .personal-v123-rail {
    display: none !important;
  }
  body.works-v123 .works-v92-intro h1,
  body.personal-v123 .personal-v113-intro h1 {
    font-size: clamp(29px, 10.4vw, 46px) !important;
  }
  body.works-v123 .works-v92-titleblock h2 {
    font-size: clamp(37px, 10.8vw, 63px) !important;
  }
}

/* v124 — Personal Art: add Explorations, make the side rail match Professional Works v103 exactly, and make section gradients actually visible. */
body.personal-v124 .personal-v123-rail {
  position: fixed !important;
  z-index: 240 !important;
  left: clamp(24px, 3.8vw, 68px) !important;
  top: 36vh !important;
  width: clamp(150px, 14vw, 250px) !important;
  display: grid !important;
  gap: 16px !important;
  font-family: var(--mono) !important;
  text-transform: uppercase !important;
  letter-spacing: .13em !important;
  font-size: 9px !important;
  line-height: 1.45 !important;
  color: rgba(243,240,232,.32) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
}
body.personal-v124 .personal-v123-rail::before {
  content: "" !important;
  display: block !important;
  width: 28px !important;
  height: 1px !important;
  margin-bottom: 2px !important;
  background: rgba(243,240,232,.22) !important;
}
body.personal-v124 .personal-v123-rail a {
  position: relative !important;
  display: inline-flex !important;
  width: fit-content !important;
  align-items: baseline !important;
  gap: 10px !important;
  padding-left: 0 !important;
  color: rgba(243,240,232,.42) !important;
  font-size: clamp(10px, .72vw, 13px) !important;
  letter-spacing: .16em !important;
  transform: translateX(0) !important;
  transition: color .22s ease, transform .22s ease !important;
}
body.personal-v124 .personal-v123-rail a::before {
  display: none !important;
}
body.personal-v124 .personal-v123-rail a span::after {
  content: "" !important;
  display: inline-block !important;
  width: 26px !important;
  height: 1px !important;
  margin-left: 11px !important;
  vertical-align: middle !important;
  background: rgba(243,240,232,.16) !important;
  transform: scaleX(.35) !important;
  transform-origin: left center !important;
  transition: transform .25s ease, background .25s ease !important;
}
body.personal-v124 .personal-v123-rail a:hover,
body.personal-v124 .personal-v123-rail a.is-active {
  color: rgba(243,240,232,.94) !important;
  transform: translateX(4px) !important;
}
body.personal-v124 .personal-v123-rail a:hover span::after,
body.personal-v124 .personal-v123-rail a.is-active span::after {
  transform: scaleX(1) !important;
  background: rgba(243,240,232,.48) !important;
}
body.personal-v124 .personal-v123-rail a em {
  color: rgba(243,240,232,.30) !important;
  font-style: normal !important;
  font-size: .82em !important;
  letter-spacing: .12em !important;
}
body.personal-v124 .personal-v123-rail a:hover em,
body.personal-v124 .personal-v123-rail a.is-active em {
  color: rgba(243,240,232,.52) !important;
}

body.personal-v124 .personal-v123-art-section {
  position: relative !important;
  isolation: isolate !important;
  overflow: visible !important;
  background:
    radial-gradient(ellipse 88vw 42vh at 58% 12%, rgba(243,240,232,.050), rgba(95,95,86,.024) 48%, transparent 78%),
    radial-gradient(ellipse 62vw 34vh at 20% 70%, rgba(96,112,116,.035), rgba(42,48,50,.016) 50%, transparent 78%),
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(9,9,9,.54) 28%, rgba(10,10,9,.66) 68%, rgba(0,0,0,0) 100%) !important;
}
body.personal-v124 .personal-v123-art-section::before {
  z-index: 0 !important;
  opacity: .82 !important;
  background:
    radial-gradient(ellipse 82vw 44vh at 62% 18%, rgba(205,198,178,.078), rgba(98,98,88,.036) 42%, transparent 76%),
    radial-gradient(ellipse 68vw 48vh at 28% 62%, rgba(96,112,116,.050), rgba(45,54,56,.024) 44%, transparent 76%),
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(8,8,8,.58) 28%, rgba(9,9,8,.72) 66%, rgba(0,0,0,0) 100%) !important;
}
body.personal-v124 .personal-v123-art-section > h2,
body.personal-v124 .personal-v123-art-section > .pa93-gallery {
  position: relative !important;
  z-index: 1 !important;
}
body.personal-v124 #traditional-art,
body.personal-v124 #explorations {
  margin-top: clamp(42px, 7vh, 90px) !important;
}

@media (max-width: 1180px) {
  body.personal-v124 .personal-v123-rail {
    position: sticky !important;
    top: var(--header-h) !important;
    left: auto !important;
    width: auto !important;
    display: flex !important;
    gap: 22px !important;
    padding: 14px 18px !important;
    margin: 0 !important;
    background: rgba(0,0,0,.78) !important;
    border-top: 1px solid rgba(243,240,232,.07) !important;
    border-bottom: 1px solid rgba(243,240,232,.07) !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
  }
  body.personal-v124 .personal-v123-rail::before,
  body.personal-v124 .personal-v123-rail a span::after {
    display: none !important;
  }
}

@media (max-width: 900px) {
  body.personal-v124 .personal-v123-rail {
    display: none !important;
  }
}


/* v125 — Personal Art: extend section gradients to the top divider line and reduce gallery scale slightly. */
body.personal-v125 .personal-v123-art-section {
  position: relative !important;
  isolation: isolate !important;
  overflow: visible !important;
  background: none !important;
}

body.personal-v125 .personal-v123-art-section::before {
  content: "" !important;
  position: absolute !important;
  z-index: 0 !important;
  pointer-events: none !important;
  left: max(-7vw, -140px) !important;
  right: max(-7vw, -140px) !important;
  top: 0 !important;
  bottom: 0 !important;
  opacity: .92 !important;
  background:
    radial-gradient(ellipse 92vw 52vh at 58% 0%, rgba(243,240,232,.070), rgba(104,104,92,.035) 43%, transparent 76%),
    radial-gradient(ellipse 72vw 44vh at 24% 56%, rgba(90,108,112,.048), rgba(38,46,48,.022) 50%, transparent 78%),
    linear-gradient(180deg, rgba(18,18,17,.58) 0%, rgba(12,12,11,.66) 34%, rgba(9,9,9,.56) 72%, rgba(0,0,0,0) 100%) !important;
}

body.personal-v125 .personal-v123-art-section::after {
  content: "" !important;
  position: absolute !important;
  z-index: 2 !important;
  pointer-events: none !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent 0%, rgba(243,240,232,.12) 18%, rgba(243,240,232,.20) 50%, rgba(243,240,232,.12) 82%, transparent 100%) !important;
}

body.personal-v125 .personal-v123-art-section > h2,
body.personal-v125 .personal-v123-art-section > .pa93-gallery {
  position: relative !important;
  z-index: 1 !important;
}

body.personal-v125 .personal-v123-art-section > .pa93-gallery {
  width: 90% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

@media (max-width: 1180px) {
  body.personal-v125 .personal-v123-art-section > .pa93-gallery {
    width: 100% !important;
  }
}

/* v126 — Personal Art gallery alignment and side-rail clearance.
   Titles align with the reduced gallery width, and desktop galleries keep clear of the fixed left rail. */
@media (min-width: 1181px) {
  body.personal-v126 .personal-v123-art-section {
    width: auto !important;
    max-width: none !important;
    margin-left: clamp(230px, 16vw, 320px) !important;
    margin-right: clamp(42px, 6vw, 120px) !important;
  }

  body.personal-v126 .personal-v123-art-section > h2,
  body.personal-v126 .personal-v123-art-section > .pa93-gallery {
    width: 90% !important;
    max-width: 1500px !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }

  body.personal-v126 .personal-v123-art-section > h2 {
    box-sizing: border-box !important;
  }
}

@media (max-width: 1180px) {
  body.personal-v126 .personal-v123-art-section {
    width: min(1680px, calc(100vw - clamp(28px, 4vw, 76px))) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body.personal-v126 .personal-v123-art-section > h2,
  body.personal-v126 .personal-v123-art-section > .pa93-gallery {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}


/* v127 — Personal Art: stronger left clearance so the fixed section rail never overlaps the gallery. */
@media (min-width: 1181px) {
  body.personal-v127 .personal-v123-art-section {
    margin-left: clamp(300px, 22vw, 390px) !important;
    margin-right: clamp(42px, 6vw, 120px) !important;
  }

  body.personal-v127 .personal-v123-art-section > h2,
  body.personal-v127 .personal-v123-art-section > .pa93-gallery {
    width: 90% !important;
    max-width: 1500px !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }
}


/* v128 — subtle side arrows on the top Personal Art carousel */
body.personal-v128 .pa94-track-wrap {
  position: relative;
}

body.personal-v128 .pa128-carousel-arrow {
  appearance: none;
  position: absolute;
  top: 50%;
  z-index: 18;
  width: 42px;
  height: 68px;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(243,240,232,.42);
  font-family: var(--mono);
  font-size: clamp(26px, 2.2vw, 38px);
  font-weight: 300;
  line-height: 1;
  cursor: pointer;
  transform: translateY(-50%);
  text-shadow: 0 0 18px rgba(0,0,0,.82), 0 0 34px rgba(0,0,0,.72);
  transition: color .18s ease, opacity .18s ease, transform .18s ease;
}

body.personal-v128 .pa128-carousel-arrow:hover {
  color: rgba(243,240,232,.82);
  transform: translateY(-50%) scale(1.08);
}

body.personal-v128 .pa128-carousel-arrow-left {
  left: clamp(18px, 4vw, 70px);
}

body.personal-v128 .pa128-carousel-arrow-right {
  right: clamp(18px, 4vw, 70px);
}

body.personal-v128 .pa94-controls .pa94-arrow {
  display: none;
}

@media (max-width: 720px) {
  body.personal-v128 .pa128-carousel-arrow-left { left: 10px; }
  body.personal-v128 .pa128-carousel-arrow-right { right: 10px; }
  body.personal-v128 .pa128-carousel-arrow {
    width: 34px;
    height: 54px;
    font-size: 27px;
  }
}

/* v129 — Personal Art carousel arrows: visible white arrows, moved inward above the carousel gradients */
body.personal-v129 .pa94-track-wrap {
  position: relative !important;
}

body.personal-v129 .pa128-carousel-arrow {
  appearance: none;
  position: absolute;
  top: 50%;
  z-index: 120 !important;
  width: 36px;
  height: 58px;
  padding: 0;
  border: 0;
  background: transparent !important;
  color: rgba(255,255,255,.92) !important;
  opacity: .92 !important;
  font-family: var(--mono);
  font-size: clamp(24px, 1.9vw, 34px);
  font-weight: 300;
  line-height: 1;
  cursor: pointer;
  pointer-events: auto;
  transform: translateY(-50%);
  text-shadow:
    0 0 9px rgba(0,0,0,.98),
    0 0 24px rgba(0,0,0,.92),
    0 0 48px rgba(0,0,0,.82);
  transition: opacity .18s ease, transform .18s ease, color .18s ease;
}

body.personal-v129 .pa128-carousel-arrow:hover {
  color: #fff !important;
  opacity: 1 !important;
  transform: translateY(-50%) scale(1.08);
}

body.personal-v129 .pa128-carousel-arrow-left {
  left: clamp(96px, 17.5vw, 360px) !important;
}

body.personal-v129 .pa128-carousel-arrow-right {
  right: clamp(96px, 17.5vw, 360px) !important;
}

@media (max-width: 1180px) {
  body.personal-v129 .pa128-carousel-arrow-left { left: clamp(54px, 9vw, 110px) !important; }
  body.personal-v129 .pa128-carousel-arrow-right { right: clamp(54px, 9vw, 110px) !important; }
}

@media (max-width: 720px) {
  body.personal-v129 .pa128-carousel-arrow-left { left: 22px !important; }
  body.personal-v129 .pa128-carousel-arrow-right { right: 22px !important; }
  body.personal-v129 .pa128-carousel-arrow {
    width: 32px;
    height: 50px;
    font-size: 27px;
  }
}

/* v130 — homepage routes under Twój K.: quiet portfolio tile index */
.home-page .home-routes {
  position: relative;
  z-index: 1;
  padding: clamp(84px, 12vh, 148px) clamp(18px, 4vw, 72px) clamp(88px, 12vh, 156px);
  background:
    radial-gradient(ellipse 72vw 28vh at 52% 0%, rgba(243,240,232,.035), transparent 72%),
    radial-gradient(ellipse 54vw 38vh at 78% 58%, rgba(82,93,110,.052), transparent 68%),
    linear-gradient(180deg, #000 0%, #030303 48%, #000 100%);
  border-top: 1px solid rgba(243,240,232,.07);
}

.home-page .home-routes::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: clamp(58px, 8vh, 110px);
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.86), rgba(0,0,0,0));
}

.home-routes-inner {
  width: min(1240px, 92vw);
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.home-routes-head {
  display: grid;
  grid-template-columns: minmax(180px, .44fr) minmax(0, 1fr);
  grid-template-areas:
    "kicker title"
    "kicker copy";
  gap: 12px clamp(36px, 7vw, 110px);
  align-items: start;
  margin: 0 0 clamp(34px, 5.6vh, 74px);
}

.home-routes-head .eyebrow {
  grid-area: kicker;
  margin: .55em 0 0;
  color: rgba(243,240,232,.38);
}

.home-routes-head h2 {
  grid-area: title;
  margin: 0;
  max-width: 900px;
  color: rgba(243,240,232,.88);
  font-size: clamp(34px, 5vw, 78px);
  line-height: .96;
  letter-spacing: -.06em;
  font-weight: 500;
  text-transform: uppercase;
}

.home-routes-head p:not(.eyebrow) {
  grid-area: copy;
  margin: 4px 0 0;
  max-width: 620px;
  color: rgba(243,240,232,.48);
  font-size: clamp(13px, 1.1vw, 16px);
  line-height: 1.72;
  letter-spacing: -.01em;
}

.home-route-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-rows: clamp(190px, 22vw, 270px);
  gap: clamp(10px, 1.05vw, 16px);
}

.home-route-card {
  position: relative;
  grid-column: span 4;
  overflow: hidden;
  min-height: 190px;
  isolation: isolate;
  background: #050505;
  border: 1px solid rgba(243,240,232,.095);
  text-decoration: none;
  color: rgba(243,240,232,.86);
  transform: translate3d(0,0,0) scale(1);
  transition:
    transform .38s cubic-bezier(.2,.8,.2,1),
    border-color .38s cubic-bezier(.2,.8,.2,1),
    background .38s cubic-bezier(.2,.8,.2,1);
}

.home-route-card-major {
  grid-column: span 6;
}

.home-route-card img {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
  opacity: .72;
  filter: brightness(.72) contrast(1.05) saturate(.9);
  transform: scale(1.006);
  transition:
    filter .38s cubic-bezier(.2,.8,.2,1),
    opacity .38s cubic-bezier(.2,.8,.2,1),
    transform .62s cubic-bezier(.2,.8,.2,1);
}

.home-route-card-major:first-child img {
  object-position: center center;
  filter: brightness(.82) contrast(1.04) saturate(.92);
}

.home-route-card:nth-child(2) img {
  object-position: center 48%;
}

.home-route-scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 36%, rgba(243,240,232,.055), rgba(0,0,0,0) 34%),
    linear-gradient(180deg, rgba(0,0,0,.28), rgba(0,0,0,.18) 38%, rgba(0,0,0,.88) 100%);
}

.home-route-index,
.home-route-action,
.home-route-copy small {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: 9px;
  line-height: 1.25;
}

.home-route-index {
  position: absolute;
  z-index: 2;
  top: clamp(16px, 1.6vw, 24px);
  left: clamp(16px, 1.6vw, 24px);
  color: rgba(243,240,232,.38);
}

.home-route-action {
  position: absolute;
  z-index: 2;
  top: clamp(16px, 1.6vw, 24px);
  right: clamp(16px, 1.6vw, 24px);
  color: rgba(243,240,232,.52);
}

.home-route-action::after {
  content: "↗";
  margin-left: 8px;
  font-size: 10px;
  color: rgba(243,240,232,.42);
}

.home-route-copy {
  position: absolute;
  z-index: 2;
  left: clamp(16px, 1.8vw, 28px);
  right: clamp(16px, 1.8vw, 28px);
  bottom: clamp(16px, 1.8vw, 28px);
  display: grid;
  gap: 9px;
}

.home-route-copy small {
  color: rgba(243,240,232,.42);
}

.home-route-copy strong {
  display: block;
  color: rgba(243,240,232,.9);
  font-size: clamp(24px, 2.65vw, 42px);
  line-height: .94;
  letter-spacing: -.055em;
  font-weight: 500;
  text-transform: uppercase;
}

.home-route-card:not(.home-route-card-major) .home-route-copy strong {
  font-size: clamp(20px, 2vw, 31px);
  letter-spacing: -.05em;
}

.home-route-copy em {
  max-width: 420px;
  color: rgba(243,240,232,.54);
  font-style: normal;
  font-size: clamp(12px, .95vw, 14px);
  line-height: 1.5;
  letter-spacing: -.01em;
}

.home-route-card:hover {
  transform: translate3d(0,-4px,0) scale(1.012);
  border-color: rgba(243,240,232,.22);
  background: #090909;
}

.home-route-card:hover img {
  opacity: .9;
  filter: brightness(.92) contrast(1.05) saturate(.98);
  transform: scale(1.018);
}

.home-route-card:hover .home-route-action,
.home-route-card:hover .home-route-copy small,
.home-route-card:hover .home-route-copy em {
  color: rgba(243,240,232,.72);
}

@media (max-width: 1040px) {
  .home-route-card,
  .home-route-card-major {
    grid-column: span 6;
  }

  .home-routes-head {
    grid-template-columns: 1fr;
    grid-template-areas:
      "kicker"
      "title"
      "copy";
    gap: 14px;
  }
}

@media (max-width: 720px) {
  .home-page .home-routes {
    padding: 66px 16px 80px;
  }

  .home-routes-inner {
    width: min(100%, 560px);
  }

  .home-routes-head h2 {
    font-size: clamp(34px, 12vw, 56px);
  }

  .home-route-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: minmax(230px, auto);
    gap: 12px;
  }

  .home-route-card,
  .home-route-card-major {
    grid-column: 1;
    min-height: 58vw;
  }

  .home-route-card-major:first-child {
    min-height: 48vw;
  }

  .home-route-copy strong,
  .home-route-card:not(.home-route-card-major) .home-route-copy strong {
    font-size: clamp(25px, 8vw, 36px);
  }

  .home-route-copy em {
    max-width: 310px;
  }
}

/* v131 — homepage routes: bolder editorial image panels, less text */
.home-page .home-routes-v131 {
  padding: clamp(34px, 5.5vh, 76px) 0 clamp(96px, 13vh, 170px);
  background:
    radial-gradient(ellipse 88vw 34vh at 50% 0%, rgba(243,240,232,.028), transparent 72%),
    linear-gradient(180deg, #000 0%, #020202 52%, #000 100%);
  border-top: 1px solid rgba(243,240,232,.065);
}

.home-page .home-routes-v131::before {
  height: clamp(40px, 6vh, 82px);
  background: linear-gradient(180deg, rgba(0,0,0,.82), rgba(0,0,0,0));
}

.home-routes-v131 .home-routes-inner {
  width: min(1680px, 94vw);
}

.home-routes-v131 .home-route-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-rows: clamp(168px, 12.5vw, 248px);
  gap: clamp(12px, 1.15vw, 22px);
}

.home-routes-v131 .home-route-card {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  min-height: 0;
  background: #020202;
  border: 1px solid rgba(243,240,232,.075);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.42);
  color: rgba(243,240,232,.9);
  transform: translate3d(0,0,0) scale(1);
  transition:
    transform .42s cubic-bezier(.2,.8,.2,1),
    border-color .42s cubic-bezier(.2,.8,.2,1),
    box-shadow .42s cubic-bezier(.2,.8,.2,1);
}

.home-routes-v131 .home-route-feature {
  grid-row: span 3;
  min-height: clamp(480px, 54vh, 700px);
}

.home-routes-v131 .home-route-professional { grid-column: span 7; }
.home-routes-v131 .home-route-personal { grid-column: span 5; }
.home-routes-v131 .home-route-section {
  grid-column: span 4;
  grid-row: span 2;
  min-height: clamp(310px, 25vw, 470px);
}

.home-routes-v131 .home-route-card img {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
  opacity: .86;
  filter: brightness(.68) contrast(1.08) saturate(.9);
  transform: scale(1.001);
  transition:
    filter .42s cubic-bezier(.2,.8,.2,1),
    opacity .42s cubic-bezier(.2,.8,.2,1);
}

.home-routes-v131 .home-route-professional img {
  object-position: center center;
  filter: brightness(.74) contrast(1.08) saturate(.92);
}

.home-routes-v131 .home-route-personal img {
  object-position: center center;
  filter: brightness(.68) contrast(1.1) saturate(.92);
}

.home-routes-v131 .home-route-scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(0,0,0,.48) 0%, rgba(0,0,0,.06) 38%, rgba(0,0,0,.72) 100%),
    linear-gradient(90deg, rgba(0,0,0,.46), rgba(0,0,0,0) 45%, rgba(0,0,0,.22) 100%);
}

.home-routes-v131 .home-route-top {
  position: absolute;
  z-index: 2;
  top: clamp(16px, 1.55vw, 26px);
  left: clamp(16px, 1.55vw, 26px);
  display: inline-flex;
  gap: 12px;
  align-items: center;
  color: rgba(243,240,232,.5);
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: 9px;
  line-height: 1.15;
}

.home-routes-v131 .home-route-top span {
  color: rgba(243,240,232,.35);
}

.home-routes-v131 .home-route-top small {
  font: inherit;
  color: rgba(243,240,232,.48);
}

.home-routes-v131 .home-route-title {
  position: absolute;
  z-index: 2;
  left: clamp(17px, 1.8vw, 32px);
  right: clamp(17px, 1.8vw, 32px);
  bottom: clamp(22px, 2.3vw, 44px);
  display: block;
  color: rgba(243,240,232,.93);
  font-family: var(--mono);
  text-transform: uppercase;
  font-weight: 500;
  letter-spacing: .11em;
  line-height: .96;
  font-size: clamp(30px, 4.4vw, 76px);
  text-shadow: 0 18px 45px rgba(0,0,0,.72);
}

.home-routes-v131 .home-route-section .home-route-title {
  font-size: clamp(22px, 2.3vw, 38px);
  letter-spacing: .1em;
  max-width: 86%;
}

.home-routes-v131 .home-route-action {
  position: absolute;
  z-index: 2;
  top: clamp(16px, 1.55vw, 26px);
  right: clamp(16px, 1.55vw, 26px);
  color: rgba(243,240,232,.54);
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: 9px;
  line-height: 1.15;
}

.home-routes-v131 .home-route-action::after {
  content: "↗";
  margin-left: 8px;
  font-size: 10px;
  color: rgba(243,240,232,.48);
}

.home-routes-v131 .home-route-card:hover {
  transform: translate3d(0,-5px,0) scale(1.014);
  border-color: rgba(243,240,232,.2);
  box-shadow:
    inset 0 0 0 1px rgba(243,240,232,.035),
    0 24px 80px rgba(0,0,0,.46);
}

.home-routes-v131 .home-route-card:hover img {
  opacity: .95;
  filter: brightness(.82) contrast(1.08) saturate(.96);
  transform: scale(1.001);
}

.home-routes-v131 .home-route-card:hover .home-route-action,
.home-routes-v131 .home-route-card:hover .home-route-top small {
  color: rgba(243,240,232,.76);
}

@media (max-width: 1080px) {
  .home-routes-v131 .home-route-professional,
  .home-routes-v131 .home-route-personal {
    grid-column: span 6;
  }

  .home-routes-v131 .home-route-section {
    grid-column: span 6;
  }
}

@media (max-width: 720px) {
  .home-page .home-routes-v131 {
    padding: 44px 0 90px;
  }

  .home-routes-v131 .home-routes-inner {
    width: min(100% - 28px, 620px);
  }

  .home-routes-v131 .home-route-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    gap: 14px;
  }

  .home-routes-v131 .home-route-feature,
  .home-routes-v131 .home-route-section,
  .home-routes-v131 .home-route-professional,
  .home-routes-v131 .home-route-personal {
    grid-column: 1;
    grid-row: auto;
    min-height: 74vw;
  }

  .home-routes-v131 .home-route-section {
    min-height: 62vw;
  }

  .home-routes-v131 .home-route-title,
  .home-routes-v131 .home-route-section .home-route-title {
    font-size: clamp(26px, 8.7vw, 44px);
    letter-spacing: .1em;
  }
}


/* v132 — homepage: bold attached route tiles, no hover brightening/zoom, centered small titles */
.home-page .home-routes-v132 {
  padding: clamp(22px, 4vh, 56px) 0 clamp(92px, 12vh, 150px) !important;
  background: #000 !important;
  border-top: 0 !important;
}

.home-page .home-routes-v132::before {
  display: none !important;
}

.home-routes-v132 .home-routes-inner {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

.home-routes-v132 .home-route-grid {
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  grid-auto-rows: auto !important;
  gap: 0 !important;
  width: 100% !important;
  margin: 0 !important;
}

.home-routes-v132 .home-route-card {
  position: relative !important;
  display: block !important;
  overflow: hidden !important;
  isolation: isolate !important;
  background: #000 !important;
  border: 0 !important;
  box-shadow: none !important;
  min-height: 0 !important;
  text-decoration: none !important;
  color: rgba(243,240,232,.92) !important;
  transform: none !important;
  transition: none !important;
}

.home-routes-v132 .home-route-half {
  grid-column: span 6 !important;
  height: clamp(360px, 43vw, 720px) !important;
}

.home-routes-v132 .home-route-wide {
  grid-column: 1 / -1 !important;
  height: clamp(310px, 34vw, 600px) !important;
}

.home-routes-v132 .home-route-third {
  grid-column: span 4 !important;
  height: clamp(260px, 28vw, 470px) !important;
}

.home-routes-v132 .home-route-cycle-img,
.home-routes-v132 .home-route-card img.home-route-cycle-img {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  opacity: 0 !important;
  filter: brightness(.66) contrast(1.08) saturate(.88) !important;
  transform: none !important;
  transition: opacity .16s linear !important;
}

.home-routes-v132 .home-route-cycle-img.is-active,
.home-routes-v132 .home-route-card img.home-route-cycle-img.is-active {
  opacity: 1 !important;
}

.home-routes-v132 .home-route-sancticide .home-route-cycle-img { object-position: center center !important; }
.home-routes-v132 .home-route-slavicpunk .home-route-cycle-img { object-position: center center !important; }
.home-routes-v132 .home-route-original .home-route-cycle-img { object-position: center center !important; }
.home-routes-v132 .home-route-digital .home-route-cycle-img { object-position: center center !important; }
.home-routes-v132 .home-route-traditional .home-route-cycle-img { object-position: center center !important; }
.home-routes-v132 .home-route-explorations .home-route-cycle-img { object-position: center center !important; }

.home-routes-v132 .home-route-scrim {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(ellipse 48% 30% at 50% 50%, rgba(0,0,0,.08), rgba(0,0,0,.28) 68%, rgba(0,0,0,.58) 100%),
    linear-gradient(180deg, rgba(0,0,0,.34), rgba(0,0,0,.08) 46%, rgba(0,0,0,.48)) !important;
  opacity: 1 !important;
}

.home-routes-v132 .home-route-title,
.home-routes-v132 .home-route-section .home-route-title {
  position: absolute !important;
  z-index: 2 !important;
  inset: 50% auto auto 50% !important;
  width: auto !important;
  max-width: calc(100% - 56px) !important;
  display: block !important;
  margin: 0 !important;
  transform: translate3d(-50%, -50%, 0) !important;
  color: rgba(243,240,232,.92) !important;
  font-family: var(--mono) !important;
  font-size: clamp(11px, .82vw, 15px) !important;
  line-height: 1.05 !important;
  font-weight: 500 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  white-space: nowrap !important;
  text-shadow:
    0 0 18px rgba(0,0,0,.96),
    0 12px 42px rgba(0,0,0,.88) !important;
}

.home-routes-v132 .home-route-card:hover,
.home-routes-v132 .home-route-card:hover img,
.home-routes-v132 .home-route-card:hover .home-route-cycle-img {
  transform: none !important;
  filter: brightness(.66) contrast(1.08) saturate(.88) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.home-routes-v132 .home-route-card:hover .home-route-title {
  color: rgba(255,255,255,.98) !important;
}

.home-routes-v132 .home-route-top,
.home-routes-v132 .home-route-action,
.home-routes-v132 .home-route-index,
.home-routes-v132 .home-route-copy,
.home-routes-v132 .home-route-card > small,
.home-routes-v132 .home-route-card > em {
  display: none !important;
}

@media (max-width: 920px) {
  .home-routes-v132 .home-route-half,
  .home-routes-v132 .home-route-third {
    grid-column: 1 / -1 !important;
    height: clamp(280px, 66vw, 520px) !important;
  }

  .home-routes-v132 .home-route-wide {
    height: clamp(260px, 58vw, 470px) !important;
  }

  .home-routes-v132 .home-route-title,
  .home-routes-v132 .home-route-section .home-route-title {
    font-size: clamp(11px, 2.4vw, 14px) !important;
    letter-spacing: .16em !important;
    max-width: calc(100% - 36px) !important;
  }
}


/* v133 — homepage tiles: normal image brightness, no black gap, no centered glow; top nav black strip on Works/Personal at page top */
.home-page .home-routes-v133 {
  padding-top: 0 !important;
  padding-bottom: clamp(92px, 12vh, 150px) !important;
  margin-top: 0 !important;
  background: #000 !important;
}

.home-page .home-routes-v133 .home-route-grid {
  margin-top: 0 !important;
}

.home-page .home-routes-v133 .home-route-cycle-img,
.home-page .home-routes-v133 .home-route-card img.home-route-cycle-img,
.home-page .home-routes-v133 .home-route-card:hover img,
.home-page .home-routes-v133 .home-route-card:hover .home-route-cycle-img {
  filter: brightness(.96) contrast(1.03) saturate(.96) !important;
  opacity: 0 !important;
  transform: none !important;
}

.home-page .home-routes-v133 .home-route-cycle-img.is-active,
.home-page .home-routes-v133 .home-route-card img.home-route-cycle-img.is-active,
.home-page .home-routes-v133 .home-route-card:hover img.home-route-cycle-img.is-active,
.home-page .home-routes-v133 .home-route-card:hover .home-route-cycle-img.is-active {
  opacity: 1 !important;
}

.home-page .home-routes-v133 .home-route-scrim {
  background:
    linear-gradient(180deg, rgba(0,0,0,.24) 0%, rgba(0,0,0,0) 28%, rgba(0,0,0,0) 62%, rgba(0,0,0,.28) 100%),
    linear-gradient(90deg, rgba(0,0,0,.28) 0%, rgba(0,0,0,0) 24%, rgba(0,0,0,0) 76%, rgba(0,0,0,.25) 100%) !important;
  opacity: 1 !important;
}

.home-page .home-routes-v133 .home-route-card:hover,
.home-page .home-routes-v133 .home-route-card:hover .home-route-title {
  transform: none !important;
  box-shadow: none !important;
  border-color: transparent !important;
}

.home-page .home-routes-v133 .home-route-title {
  font-size: clamp(10px, .74vw, 13px) !important;
  letter-spacing: .18em !important;
}

body.works-v133::before,
body.personal-v133::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: var(--header-h);
  background: #000;
  z-index: 45;
  pointer-events: none;
}

.home-page .home-routes-v133 .home-route-card:hover {
  filter: none !important;
}


/* v134 — homepage: keep hero separation shadow, normal tile brightness, fast preview shutter; Personal rail selected works. */
.home-page .home-routes-v134 {
  position: relative !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
  background: #000 !important;
}

.home-page .home-routes-v134::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 5 !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  height: clamp(54px, 8vh, 118px) !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(0,0,0,.74) 0%, rgba(0,0,0,.32) 42%, rgba(0,0,0,0) 100%) !important;
  opacity: .78 !important;
}

.home-page .home-routes-v134 .home-route-grid { margin-top: 0 !important; }

.home-page .home-routes-v134 .home-route-cycle-img,
.home-page .home-routes-v134 .home-route-card img.home-route-cycle-img,
.home-page .home-routes-v134 .home-route-card:hover img,
.home-page .home-routes-v134 .home-route-card:hover .home-route-cycle-img {
  filter: brightness(.98) contrast(1.025) saturate(.98) !important;
  transform: none !important;
  transition: opacity .045s steps(1, end) !important;
}

.home-page .home-routes-v134 .home-route-cycle-img { opacity: 0 !important; }
.home-page .home-routes-v134 .home-route-cycle-img.is-active { opacity: 1 !important; }

.home-page .home-routes-v134 .home-route-scrim {
  background:
    linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,0) 22%, rgba(0,0,0,0) 72%, rgba(0,0,0,.24) 100%),
    linear-gradient(90deg, rgba(0,0,0,.22) 0%, rgba(0,0,0,0) 22%, rgba(0,0,0,0) 78%, rgba(0,0,0,.22) 100%) !important;
  opacity: 1 !important;
}

.home-page .home-routes-v134 .home-route-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  opacity: 0;
  background:
    linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.13) 48%, rgba(255,255,255,0) 100%),
    linear-gradient(180deg, rgba(0,0,0,.16), rgba(255,255,255,.045), rgba(0,0,0,.12));
  mix-blend-mode: screen;
  transform: translate3d(-16%, 0, 0);
}

.home-page .home-routes-v134 .home-route-card.is-switching::after {
  animation: routePreviewShutter .11s steps(2, end) both;
}

@keyframes routePreviewShutter {
  0% { opacity: 0; transform: translate3d(-22%, 0, 0); }
  36% { opacity: .38; transform: translate3d(0, 0, 0); }
  100% { opacity: 0; transform: translate3d(18%, 0, 0); }
}

.home-page .home-routes-v134 .home-route-card:hover,
.home-page .home-routes-v134 .home-route-card:hover .home-route-title {
  box-shadow: none !important;
  border-color: transparent !important;
}

.home-page .home-routes-v134 .home-route-card:hover { transform: none !important; filter: none !important; }

.home-page .home-routes-v134 .home-route-title,
.home-page .home-routes-v134 .home-route-card:hover .home-route-title {
  inset: 50% auto auto 50% !important;
  transform: translate3d(-50%, -50%, 0) !important;
  color: rgba(243,240,232,.94) !important;
}

body.works-v134::before,
body.personal-v134::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: var(--header-h);
  background: #000;
  z-index: 45;
  pointer-events: none;
}


/* v135 — homepage statement strip between Twój K. and route tiles; remove hero separation gradient. */
.home-page .home-statement-v135 {
  position: relative;
  z-index: 6;
  width: 100%;
  margin: 0 !important;
  padding: clamp(38px, 5.8vh, 72px) clamp(30px, 7vw, 126px);
  background: #0B0B0B;
  border: 0;
}

.home-statement-v135 .home-statement-inner {
  width: 100%;
  max-width: 1540px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(280px, .95fr) minmax(320px, 1.25fr);
  align-items: center;
  gap: clamp(28px, 5vw, 96px);
}

.home-statement-v135 h2 {
  margin: 0;
  color: #fff;
  font-family: var(--mono);
  font-size: clamp(22px, 2.25vw, 42px);
  line-height: 1;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: none;
}

.home-statement-v135 p {
  margin: 0;
  max-width: 560px;
  color: #888888;
  font-family: var(--mono);
  font-size: clamp(9px, .74vw, 12px);
  line-height: 1.65;
  font-weight: 400;
  letter-spacing: 1.6px;
  text-transform: none;
}

.home-page .home-routes-v135 {
  padding-top: 0 !important;
  margin-top: 0 !important;
  background: #000 !important;
}

.home-page .home-routes-v135::before {
  content: none !important;
  display: none !important;
}

.home-page .home-routes-v135 .home-route-cycle-img,
.home-page .home-routes-v135 .home-route-card img.home-route-cycle-img,
.home-page .home-routes-v135 .home-route-card:hover img,
.home-page .home-routes-v135 .home-route-card:hover .home-route-cycle-img {
  filter: brightness(1) contrast(1.02) saturate(.98) !important;
}

.home-page .home-routes-v135 .home-route-scrim {
  background:
    linear-gradient(180deg, rgba(0,0,0,.10) 0%, rgba(0,0,0,0) 24%, rgba(0,0,0,0) 72%, rgba(0,0,0,.18) 100%),
    linear-gradient(90deg, rgba(0,0,0,.16) 0%, rgba(0,0,0,0) 22%, rgba(0,0,0,0) 78%, rgba(0,0,0,.16) 100%) !important;
  opacity: 1 !important;
}

@media (max-width: 920px) {
  .home-page .home-statement-v135 {
    padding: 34px 24px 38px;
  }
  .home-statement-v135 .home-statement-inner {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .home-statement-v135 h2 {
    font-size: clamp(20px, 6vw, 30px);
  }
  .home-statement-v135 p {
    max-width: 34em;
    font-size: 9px;
    letter-spacing: 1.2px;
  }
}


/* v136 — refined homepage statement strip: original title typography, black cinematic pause. */
.home-page .home-statement-v136 {
  position: relative;
  z-index: 7;
  background: #000 !important;
  margin: 0 !important;
  padding: clamp(82px, 11vh, 138px) clamp(32px, 7.2vw, 136px) clamp(78px, 10vh, 126px) !important;
  border: 0 !important;
}

.home-page .home-statement-v136::before {
  content: "";
  position: absolute;
  left: clamp(32px, 7.2vw, 136px);
  right: clamp(32px, 7.2vw, 136px);
  top: clamp(38px, 5.4vh, 64px);
  height: 1px;
  background: linear-gradient(90deg, rgba(255,255,255,.20), rgba(255,255,255,.055) 38%, rgba(255,255,255,0) 100%);
  pointer-events: none;
}

.home-page .home-statement-v136::after {
  content: "";
  position: absolute;
  left: clamp(32px, 7.2vw, 136px);
  right: clamp(32px, 7.2vw, 136px);
  bottom: clamp(32px, 4.7vh, 58px);
  height: 1px;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.08) 36%, rgba(255,255,255,.16) 100%);
  pointer-events: none;
}

.home-statement-v136 .home-statement-inner {
  width: 100%;
  max-width: 1520px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(260px, 0.72fr) minmax(120px, .22fr) minmax(360px, .88fr);
  align-items: center;
  gap: clamp(28px, 5.6vw, 104px);
}

.home-statement-v136 .home-statement-inner::before {
  content: "";
  width: clamp(38px, 5.5vw, 92px);
  height: 1px;
  justify-self: center;
  background: rgba(255,255,255,.28);
  opacity: .72;
}

.home-statement-v136 h2 {
  margin: 0 !important;
  color: #fff !important;
  font-family: var(--mono) !important;
  font-size: clamp(15px, 1.14vw, 22px) !important;
  line-height: 1.22 !important;
  font-weight: 600 !important;
  letter-spacing: .34em !important;
  text-transform: uppercase !important;
  white-space: nowrap;
}

.home-statement-v136 p {
  margin: 0 !important;
  max-width: 560px !important;
  color: #888 !important;
  font-family: var(--mono) !important;
  font-size: clamp(8.5px, .62vw, 10.5px) !important;
  line-height: 1.82 !important;
  font-weight: 400 !important;
  letter-spacing: 1.8px !important;
  text-transform: uppercase !important;
}

.home-page .home-routes-v136 {
  margin-top: 0 !important;
  padding-top: 0 !important;
  background: #000 !important;
}

@media (max-width: 1080px) {
  .home-statement-v136 .home-statement-inner {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .home-statement-v136 .home-statement-inner::before {
    justify-self: start;
  }
  .home-statement-v136 h2 {
    white-space: normal;
  }
}

@media (max-width: 720px) {
  .home-page .home-statement-v136 {
    padding: 62px 24px 64px !important;
  }
  .home-page .home-statement-v136::before,
  .home-page .home-statement-v136::after {
    left: 24px;
    right: 24px;
  }
  .home-statement-v136 h2 {
    font-size: 14px !important;
    letter-spacing: .24em !important;
  }
  .home-statement-v136 p {
    font-size: 8.5px !important;
    letter-spacing: 1.35px !important;
    max-width: 34em !important;
  }
}

/* v137 — homepage statement reset after research: black cinematic pause, centered manifesto, no decorative split layout. */
.home-page .home-statement-v137 {
  position: relative !important;
  z-index: 7 !important;
  margin: 0 !important;
  min-height: clamp(300px, 40vh, 520px) !important;
  padding: clamp(112px, 16vh, 210px) clamp(28px, 7vw, 136px) clamp(104px, 14vh, 190px) !important;
  display: grid !important;
  place-items: center !important;
  background: #000 !important;
  border-top: 1px solid rgba(255,255,255,.035) !important;
  border-bottom: 1px solid rgba(255,255,255,.045) !important;
  overflow: hidden !important;
}

.home-page .home-statement-v137::before,
.home-page .home-statement-v137::after {
  display: none !important;
  content: none !important;
}

.home-statement-v137 .home-statement-inner {
  width: min(100%, 1180px) !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-items: center !important;
  justify-items: center !important;
  text-align: center !important;
  gap: clamp(18px, 2.6vh, 30px) !important;
}

.home-statement-v137 .home-statement-inner::before {
  display: none !important;
  content: none !important;
}

.home-statement-v137 h2 {
  margin: 0 !important;
  max-width: 980px !important;
  color: #fff !important;
  font-family: var(--mono) !important;
  font-size: clamp(22px, 3.05vw, 54px) !important;
  line-height: .96 !important;
  font-weight: 500 !important;
  letter-spacing: clamp(.18em, .72vw, .34em) !important;
  text-transform: uppercase !important;
  white-space: normal !important;
  text-align: center !important;
}

.home-statement-v137 p {
  margin: 0 !important;
  max-width: 650px !important;
  color: #888 !important;
  font-family: var(--mono) !important;
  font-size: clamp(8.5px, .68vw, 11px) !important;
  line-height: 1.85 !important;
  font-weight: 400 !important;
  letter-spacing: 1.7px !important;
  text-transform: uppercase !important;
  text-align: center !important;
}

.home-page .home-routes-v137 {
  margin-top: 0 !important;
  padding-top: 0 !important;
  background: #000 !important;
}

@media (max-width: 920px) {
  .home-page .home-statement-v137 {
    min-height: clamp(250px, 34vh, 380px) !important;
    padding: 78px 24px 82px !important;
  }

  .home-statement-v137 h2 {
    font-size: clamp(19px, 7vw, 34px) !important;
    line-height: 1.02 !important;
    letter-spacing: .18em !important;
  }

  .home-statement-v137 p {
    max-width: 34em !important;
    font-size: 8.5px !important;
    letter-spacing: 1.25px !important;
  }
}


/* v138 — homepage: slower preview hold, faster black/white digital VHS switch, bolder statement type and corner metadata. */
.home-page .home-statement-v138 {
  min-height: clamp(330px, 43vh, 560px) !important;
  padding: clamp(126px, 17vh, 228px) clamp(28px, 7vw, 136px) clamp(118px, 16vh, 206px) !important;
  background: #000 !important;
}

.home-statement-v138 .home-statement-inner {
  width: max-content !important;
  max-width: 100% !important;
  display: inline-grid !important;
  grid-template-columns: 1fr !important;
  justify-items: stretch !important;
  text-align: right !important;
  gap: clamp(18px, 2.25vh, 28px) !important;
}

.home-statement-v138 h2 {
  justify-self: stretch !important;
  max-width: none !important;
  font-family: "Big Shoulders", var(--mono), sans-serif !important;
  font-size: clamp(31px, 4.4vw, 82px) !important;
  line-height: .82 !important;
  font-weight: 800 !important;
  letter-spacing: clamp(.20em, .92vw, .40em) !important;
  text-transform: uppercase !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.home-statement-v138 .home-statement-copy,
.home-statement-v138 p.home-statement-copy {
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  color: #888 !important;
  font-family: var(--mono) !important;
  font-size: clamp(8.5px, .68vw, 11px) !important;
  line-height: 1.72 !important;
  font-weight: 400 !important;
  letter-spacing: 1.7px !important;
  text-transform: uppercase !important;
  text-align: right !important;
}

.home-statement-v138 .home-statement-copy span {
  display: block !important;
}

.home-page .home-routes-v138 .home-route-card {
  position: relative !important;
  transform: none !important;
  filter: none !important;
}

.home-page .home-routes-v138 .home-route-cycle-img,
.home-page .home-routes-v138 .home-route-card img.home-route-cycle-img,
.home-page .home-routes-v138 .home-route-card:hover img,
.home-page .home-routes-v138 .home-route-card:hover .home-route-cycle-img {
  filter: brightness(1) contrast(1.025) saturate(.98) !important;
  transform: none !important;
  transition: opacity .055s steps(1, end) !important;
}

.home-page .home-routes-v138 .home-route-card::before,
.home-page .home-routes-v138 .home-route-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  z-index: 4;
}

.home-page .home-routes-v138 .home-route-card::before {
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,.86) 0 2px, rgba(255,255,255,.08) 2px 3px, rgba(0,0,0,.62) 3px 7px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, rgba(0,0,0,.78) 1px 13px),
    linear-gradient(90deg, rgba(0,0,0,.98), rgba(255,255,255,.13) 48%, rgba(0,0,0,.98));
  mix-blend-mode: normal;
  transform: translate3d(-8%, 0, 0);
}

.home-page .home-routes-v138 .home-route-card::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,.96) 0 18%, rgba(255,255,255,.18) 18% 20%, rgba(0,0,0,.88) 20% 48%, rgba(255,255,255,.10) 48% 49%, rgba(0,0,0,.94) 49% 100%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.08) 0 1px, rgba(0,0,0,.36) 1px 5px);
  clip-path: polygon(0 12%, 100% 8%, 100% 25%, 0 31%, 0 47%, 100% 42%, 100% 55%, 0 58%, 0 75%, 100% 70%, 100% 84%, 0 90%);
  mix-blend-mode: hard-light;
  transform: translate3d(7%, 0, 0);
}

.home-page .home-routes-v138 .home-route-card.is-switching::before {
  animation: routeVhsBlackFrame .072s steps(2, end) both;
}

.home-page .home-routes-v138 .home-route-card.is-switching::after {
  animation: routeVhsSlices .072s steps(2, end) both;
}

@keyframes routeVhsBlackFrame {
  0% { opacity: 0; transform: translate3d(-10%, 0, 0) skewX(0deg); }
  28% { opacity: .86; transform: translate3d(-2%, 0, 0) skewX(-2deg); }
  62% { opacity: .62; transform: translate3d(4%, 0, 0) skewX(2deg); }
  100% { opacity: 0; transform: translate3d(9%, 0, 0) skewX(0deg); }
}

@keyframes routeVhsSlices {
  0% { opacity: 0; transform: translate3d(8%, 0, 0); filter: grayscale(1) contrast(1.8); }
  34% { opacity: .55; transform: translate3d(-4%, 0, 0); filter: grayscale(1) contrast(2.1); }
  66% { opacity: .34; transform: translate3d(3%, 0, 0); filter: grayscale(1) contrast(1.7); }
  100% { opacity: 0; transform: translate3d(-8%, 0, 0); filter: grayscale(1) contrast(1.6); }
}

.home-page .home-routes-v138 .home-route-title,
.home-page .home-routes-v138 .home-route-card:hover .home-route-title {
  inset: 50% auto auto 50% !important;
  transform: translate3d(-50%, -50%, 0) !important;
  transition: none !important;
}

.home-page .home-routes-v138 .home-route-meta,
.home-page .home-routes-v138 .home-route-card > small.home-route-meta {
  position: absolute !important;
  right: clamp(16px, 1.6vw, 30px) !important;
  bottom: clamp(15px, 1.6vw, 28px) !important;
  z-index: 5 !important;
  display: grid !important;
  grid-template-columns: auto auto !important;
  align-items: baseline !important;
  gap: 10px !important;
  margin: 0 !important;
  color: rgba(244,242,236,.82) !important;
  font-family: var(--mono) !important;
  font-size: clamp(8px, .58vw, 10px) !important;
  line-height: 1 !important;
  font-weight: 400 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  text-shadow: 0 0 18px rgba(0,0,0,.85) !important;
  opacity: .86 !important;
  transform: none !important;
}

.home-page .home-routes-v138 .home-route-meta span,
.home-page .home-routes-v138 .home-route-meta em {
  display: block !important;
  font-style: normal !important;
  white-space: nowrap !important;
}

.home-page .home-routes-v138 .home-route-meta em {
  color: rgba(244,242,236,.58) !important;
}

.home-page .home-routes-v138 .home-route-card:hover .home-route-meta {
  transform: none !important;
  opacity: .9 !important;
}

@media (max-width: 920px) {
  .home-page .home-statement-v138 {
    min-height: clamp(260px, 36vh, 410px) !important;
    padding: 82px 24px 88px !important;
  }
  .home-statement-v138 h2 {
    font-size: clamp(25px, 10vw, 47px) !important;
    line-height: .88 !important;
    letter-spacing: .18em !important;
    white-space: normal !important;
  }
  .home-statement-v138 .home-statement-copy {
    font-size: 8.5px !important;
    letter-spacing: 1.25px !important;
  }
  .home-page .home-routes-v138 .home-route-meta,
  .home-page .home-routes-v138 .home-route-card > small.home-route-meta {
    right: 16px !important;
    bottom: 14px !important;
    font-size: 8px !important;
    gap: 8px !important;
  }
}


/* v139 — homepage: longer preview hold, darker VHS digital cut, section pauses and technical statement type. */
.home-page .home-statement-v139 {
  position: relative !important;
  background: #000 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  min-height: clamp(390px, 47vh, 620px) !important;
  padding: clamp(136px, 18vh, 238px) clamp(28px, 7vw, 136px) clamp(132px, 17vh, 222px) !important;
}

.home-statement-v139 .home-statement-inner {
  width: max-content !important;
  max-width: min(100%, 1240px) !important;
  justify-items: stretch !important;
  text-align: right !important;
}

.home-statement-v139 h2 {
  font-family: "Rajdhani", var(--mono), sans-serif !important;
  font-size: clamp(34px, 4.9vw, 88px) !important;
  line-height: .82 !important;
  font-weight: 700 !important;
  letter-spacing: clamp(.26em, .96vw, .46em) !important;
  text-transform: uppercase !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.home-statement-v139 .home-statement-copy,
.home-statement-v139 p.home-statement-copy {
  justify-self: end !important;
  width: max-content !important;
  max-width: 100% !important;
  margin-top: clamp(6px, .8vh, 12px) !important;
  text-align: right !important;
  color: #888 !important;
  letter-spacing: 1.8px !important;
  line-height: 1.68 !important;
}

.home-statement-v139 .home-statement-edge-label {
  position: absolute !important;
  left: clamp(18px, 3.6vw, 68px) !important;
  bottom: clamp(22px, 3.1vh, 46px) !important;
  z-index: 3 !important;
  color: rgba(244,242,236,.72) !important;
  font-family: var(--mono) !important;
  font-size: clamp(8.5px, .63vw, 11px) !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
  pointer-events: none !important;
}

.home-page .home-routes-v139 {
  background: #000 !important;
  padding-bottom: clamp(92px, 12vh, 150px) !important;
}

.home-page .home-routes-v139 .home-route-section-break {
  grid-column: 1 / -1 !important;
  height: clamp(92px, 10.5vh, 148px) !important;
  background: #000 !important;
  position: relative !important;
  display: block !important;
}

.home-page .home-routes-v139 .home-route-section-break span {
  position: absolute !important;
  left: clamp(18px, 3.6vw, 68px) !important;
  bottom: clamp(18px, 2.7vh, 34px) !important;
  color: rgba(244,242,236,.72) !important;
  font-family: var(--mono) !important;
  font-size: clamp(8.5px, .63vw, 11px) !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
}

.home-page .home-routes-v139 .home-route-cycle-img,
.home-page .home-routes-v139 .home-route-card img.home-route-cycle-img,
.home-page .home-routes-v139 .home-route-card:hover img,
.home-page .home-routes-v139 .home-route-card:hover .home-route-cycle-img {
  filter: brightness(1) contrast(1.025) saturate(.98) !important;
  transform: none !important;
  transition: opacity .05s steps(1, end) !important;
}

.home-page .home-routes-v139 .home-route-card::before,
.home-page .home-routes-v139 .home-route-card::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 4 !important;
  pointer-events: none !important;
  opacity: 0 !important;
}

.home-page .home-routes-v139 .home-route-card::before {
  background:
    linear-gradient(180deg, rgba(0,0,0,.98) 0%, rgba(0,0,0,.72) 45%, rgba(0,0,0,.96) 100%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.11) 0 1px, rgba(0,0,0,.66) 1px 4px, rgba(0,0,0,.95) 4px 9px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 1px, rgba(0,0,0,.86) 1px 16px);
  mix-blend-mode: normal !important;
  transform: translate3d(0, 0, 0);
}

.home-page .home-routes-v139 .home-route-card::after {
  background:
    linear-gradient(90deg, rgba(0,0,0,.96), rgba(255,255,255,.11) 48%, rgba(0,0,0,.98)),
    repeating-linear-gradient(0deg, rgba(255,255,255,.08) 0 1px, rgba(0,0,0,.52) 1px 6px);
  clip-path: polygon(0 9%, 100% 6%, 100% 16%, 0 20%, 0 33%, 100% 29%, 100% 42%, 0 45%, 0 58%, 100% 54%, 100% 68%, 0 72%, 0 84%, 100% 80%, 100% 92%, 0 96%);
  mix-blend-mode: hard-light !important;
  filter: grayscale(1) contrast(2.1) brightness(.75) !important;
  transform: translate3d(0,0,0);
}

.home-page .home-routes-v139 .home-route-card.is-switching::before {
  animation: routeVhsDarkCut139 .14s steps(4, end) both !important;
}

.home-page .home-routes-v139 .home-route-card.is-switching::after {
  animation: routeVhsSliceShake139 .14s steps(4, end) both !important;
}

.home-page .home-routes-v139 .home-route-card.is-switching .home-route-cycle-img.is-active {
  animation: routeVhsImageJolt139 .14s steps(3, end) both !important;
}

@keyframes routeVhsDarkCut139 {
  0% { opacity: 0; transform: translate3d(0, 0, 0) skewX(0deg); }
  18% { opacity: .96; transform: translate3d(-2.5%, 0, 0) skewX(-1deg); }
  44% { opacity: .72; transform: translate3d(1.8%, -.6%, 0) skewX(1deg); }
  70% { opacity: .48; transform: translate3d(-1.1%, .5%, 0) skewX(-.5deg); }
  100% { opacity: 0; transform: translate3d(0, 0, 0) skewX(0deg); }
}

@keyframes routeVhsSliceShake139 {
  0% { opacity: 0; clip-path: polygon(0 10%, 100% 8%, 100% 18%, 0 22%, 0 48%, 100% 44%, 100% 56%, 0 60%, 0 78%, 100% 74%, 100% 86%, 0 91%); transform: translate3d(3.2%, 0, 0); }
  22% { opacity: .74; clip-path: polygon(0 5%, 100% 11%, 100% 20%, 0 16%, 0 30%, 100% 33%, 100% 47%, 0 43%, 0 66%, 100% 61%, 100% 73%, 0 79%, 0 88%, 100% 84%, 100% 95%, 0 98%); transform: translate3d(-4%, -.8%, 0); }
  50% { opacity: .54; clip-path: polygon(0 13%, 100% 8%, 100% 17%, 0 25%, 0 39%, 100% 35%, 100% 49%, 0 52%, 0 71%, 100% 66%, 100% 82%, 0 88%); transform: translate3d(2.4%, .6%, 0); }
  76% { opacity: .32; clip-path: polygon(0 7%, 100% 10%, 100% 19%, 0 21%, 0 58%, 100% 53%, 100% 63%, 0 68%, 0 84%, 100% 79%, 100% 91%, 0 94%); transform: translate3d(-1.8%, 0, 0); }
  100% { opacity: 0; clip-path: polygon(0 9%, 100% 6%, 100% 16%, 0 20%, 0 58%, 100% 54%, 100% 68%, 0 72%, 0 84%, 100% 80%, 100% 92%, 0 96%); transform: translate3d(0, 0, 0); }
}

@keyframes routeVhsImageJolt139 {
  0% { transform: translate3d(0,0,0); filter: brightness(1) contrast(1.025) saturate(.98); }
  20% { transform: translate3d(-1.3%, .5%, 0); filter: grayscale(1) brightness(.55) contrast(2.2); }
  48% { transform: translate3d(1.1%, -.35%, 0); filter: grayscale(.85) brightness(.72) contrast(1.85); }
  76% { transform: translate3d(-.55%, .2%, 0); filter: grayscale(.45) brightness(.86) contrast(1.35); }
  100% { transform: translate3d(0,0,0); filter: brightness(1) contrast(1.025) saturate(.98); }
}

.home-page .home-routes-v139 .home-route-card:hover,
.home-page .home-routes-v139 .home-route-card:hover .home-route-title,
.home-page .home-routes-v139 .home-route-card:hover .home-route-meta {
  transform: none !important;
}

@media (max-width: 920px) {
  .home-page .home-statement-v139 {
    min-height: clamp(300px, 38vh, 430px) !important;
    padding: 92px 24px 104px !important;
  }
  .home-statement-v139 h2 {
    font-size: clamp(27px, 10.5vw, 48px) !important;
    line-height: .9 !important;
    letter-spacing: .18em !important;
    white-space: normal !important;
  }
  .home-statement-v139 .home-statement-copy,
  .home-statement-v139 p.home-statement-copy {
    width: auto !important;
    justify-self: center !important;
    text-align: center !important;
  }
  .home-statement-v139 .home-statement-edge-label,
  .home-page .home-routes-v139 .home-route-section-break span {
    left: 24px !important;
    font-size: 8px !important;
    letter-spacing: .18em !important;
  }
  .home-page .home-routes-v139 .home-route-section-break {
    height: 74px !important;
  }
}

/* v140 — stronger visible VHS tile switch, author mark under statement, Personal Art starts at carousel. */
.home-statement-v140 .home-statement-name {
  justify-self: end !important;
  width: max-content !important;
  max-width: 100% !important;
  margin: clamp(12px, 1.55vh, 22px) 0 0 !important;
  color: rgba(244,242,236,.72) !important;
  font-family: var(--mono) !important;
  font-size: clamp(8.5px, .64vw, 11px) !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  letter-spacing: .26em !important;
  text-transform: uppercase !important;
  text-align: right !important;
}

.home-page .home-routes-v140 .home-route-card {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

.home-page .home-routes-v140 .home-route-title {
  z-index: 12 !important;
}

.home-page .home-routes-v140 .home-route-meta {
  z-index: 12 !important;
}

.home-page .home-routes-v140 .home-route-card::before,
.home-page .home-routes-v140 .home-route-card::after {
  content: "" !important;
  position: absolute !important;
  inset: -2% !important;
  pointer-events: none !important;
  opacity: 0 !important;
  z-index: 10 !important;
  mix-blend-mode: normal !important;
  will-change: opacity, transform, clip-path, filter;
}

.home-page .home-routes-v140 .home-route-card::before {
  background:
    linear-gradient(180deg, rgba(0,0,0,.98) 0%, rgba(0,0,0,.86) 33%, rgba(255,255,255,.12) 34%, rgba(0,0,0,.93) 36%, rgba(0,0,0,.92) 100%),
    repeating-linear-gradient(0deg, rgba(0,0,0,.98) 0 3px, rgba(255,255,255,.17) 3px 4px, rgba(0,0,0,.80) 4px 8px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.06) 0 1px, rgba(0,0,0,.94) 1px 14px);
  filter: grayscale(1) contrast(2.35) brightness(.82);
}

.home-page .home-routes-v140 .home-route-card::after {
  background:
    linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,255,255,.18) 47%, rgba(0,0,0,1) 100%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.16) 0 1px, rgba(0,0,0,.70) 1px 5px, rgba(0,0,0,.96) 5px 12px);
  clip-path: polygon(0 7%,100% 4%,100% 16%,0 21%,0 28%,100% 24%,100% 39%,0 43%,0 52%,100% 48%,100% 61%,0 66%,0 74%,100% 70%,100% 83%,0 89%,0 94%,100% 91%,100% 100%,0 100%);
  filter: grayscale(1) contrast(2.7) brightness(.72);
}

.home-page .home-routes-v140 .home-route-card.is-switching::before {
  animation: routeVhsHeavyCut140 .24s steps(5, end) both !important;
}

.home-page .home-routes-v140 .home-route-card.is-switching::after {
  animation: routeVhsHeavySlices140 .24s steps(5, end) both !important;
}

.home-page .home-routes-v140 .home-route-card.is-switching .home-route-cycle-img.is-active {
  animation: routeVhsImageShake140 .24s steps(4, end) both !important;
}

@keyframes routeVhsHeavyCut140 {
  0% { opacity: 0; transform: translate3d(0,0,0) skewX(0deg); }
  12% { opacity: .98; transform: translate3d(-3.8%, .2%, 0) skewX(-2deg); }
  30% { opacity: .88; transform: translate3d(2.7%, -.8%, 0) skewX(1.7deg); }
  52% { opacity: .73; transform: translate3d(-1.8%, .7%, 0) skewX(-1.1deg); }
  74% { opacity: .46; transform: translate3d(1.1%, 0, 0) skewX(.6deg); }
  100% { opacity: 0; transform: translate3d(0,0,0) skewX(0deg); }
}

@keyframes routeVhsHeavySlices140 {
  0% { opacity: 0; clip-path: polygon(0 10%,100% 8%,100% 19%,0 23%,0 54%,100% 49%,100% 61%,0 67%,0 82%,100% 77%,100% 91%,0 96%); transform: translate3d(4.5%,0,0); }
  14% { opacity: .88; clip-path: polygon(0 4%,100% 9%,100% 17%,0 14%,0 31%,100% 35%,100% 46%,0 43%,0 60%,100% 55%,100% 70%,0 76%,0 87%,100% 83%,100% 96%,0 99%); transform: translate3d(-5.2%,-.9%,0); }
  34% { opacity: .74; clip-path: polygon(0 13%,100% 6%,100% 18%,0 26%,0 39%,100% 34%,100% 51%,0 55%,0 70%,100% 65%,100% 82%,0 89%); transform: translate3d(3.1%,.8%,0); }
  58% { opacity: .50; clip-path: polygon(0 8%,100% 11%,100% 22%,0 24%,0 48%,100% 45%,100% 56%,0 61%,0 76%,100% 72%,100% 86%,0 92%); transform: translate3d(-2.4%,0,0); }
  82% { opacity: .27; clip-path: polygon(0 18%,100% 16%,100% 30%,0 34%,0 61%,100% 58%,100% 72%,0 77%,0 88%,100% 85%,100% 94%,0 98%); transform: translate3d(1.2%,.2%,0); }
  100% { opacity: 0; clip-path: polygon(0 9%,100% 6%,100% 16%,0 20%,0 58%,100% 54%,100% 68%,0 72%,0 84%,100% 80%,100% 92%,0 96%); transform: translate3d(0,0,0); }
}

@keyframes routeVhsImageShake140 {
  0% { transform: translate3d(0,0,0); filter: brightness(1) contrast(1.025) saturate(.98); }
  14% { transform: translate3d(-1.9%, .7%, 0); filter: grayscale(1) brightness(.42) contrast(2.45); }
  34% { transform: translate3d(1.6%, -.7%, 0); filter: grayscale(1) brightness(.58) contrast(2.1); }
  58% { transform: translate3d(-.9%, .35%, 0); filter: grayscale(.75) brightness(.76) contrast(1.7); }
  82% { transform: translate3d(.35%, 0, 0); filter: grayscale(.35) brightness(.9) contrast(1.25); }
  100% { transform: translate3d(0,0,0); filter: brightness(1) contrast(1.025) saturate(.98); }
}

@media (max-width: 920px) {
  .home-statement-v140 .home-statement-name {
    justify-self: center !important;
    text-align: center !important;
    font-size: 8px !important;
    letter-spacing: .22em !important;
  }
}

/* Personal Art v140 — no wide Lajkonik header; open directly on selected works carousel, with subtle title/copy underneath. */
body.personal-v140 .personal-v113-top-art,
body.personal-v140 .personal-v93-main::before,
body.personal-v140 .personal-v113-intro {
  display: none !important;
}

body.personal-v140 .personal-v93-main {
  background: #000 !important;
  overflow: visible !important;
  padding-top: 0 !important;
}

body.personal-v140 .personal-v93-main > :not(.personal-v113-top-art) {
  position: relative !important;
  z-index: 1 !important;
}

body.personal-v140 .pa93-opener {
  padding-top: calc(var(--header-h) + clamp(70px, 8vh, 116px)) !important;
  margin-top: 0 !important;
  padding-bottom: clamp(62px, 8vh, 118px) !important;
}

body.personal-v140 .pa94-carousel {
  margin-top: 0 !important;
}

body.personal-v140 .pa100-under-carousel {
  display: grid !important;
  width: min(1060px, calc(100vw - 320px)) !important;
  margin: clamp(58px, 7vh, 108px) auto 0 !important;
  padding-top: clamp(26px, 3.6vh, 46px) !important;
  border-top: 1px solid rgba(243,240,232,.08) !important;
  grid-template-columns: minmax(230px, 390px) minmax(360px, 1fr) !important;
  align-items: start !important;
  gap: clamp(42px, 6vw, 96px) !important;
  color: rgba(243,240,232,.55) !important;
}

body.personal-v140 .pa100-under-carousel h1 {
  margin: 0 !important;
  font-family: var(--mono) !important;
  font-size: clamp(20px, 2.25vw, 36px) !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  color: rgba(243,240,232,.86) !important;
}

body.personal-v140 .pa100-under-carousel p {
  margin: 0 !important;
  max-width: 650px !important;
  font-size: clamp(11px, .82vw, 13px) !important;
  line-height: 1.72 !important;
  color: rgba(243,240,232,.46) !important;
}

body.personal-v140 .personal-v123-art-section:first-of-type {
  margin-top: 0 !important;
}

@media (max-width: 1180px) {
  body.personal-v140 .pa100-under-carousel {
    width: calc(100vw - 48px) !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
}

@media (max-width: 720px) {
  body.personal-v140 .pa93-opener {
    padding-top: calc(var(--header-h) + 48px) !important;
  }
  body.personal-v140 .pa100-under-carousel {
    width: calc(100vw - 32px) !important;
    margin-top: 42px !important;
  }
}

/* v141 — official Sancticide / Slavicpunk logos on homepage tiles and Professional Works section titles. */
.home-page .home-routes-v140 .home-route-logo-title,
.home-page .home-routes-v132 .home-route-logo-title {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: min(72%, 620px) !important;
  max-width: min(72%, 620px) !important;
  height: auto !important;
  padding: 0 !important;
  line-height: 0 !important;
  pointer-events: none !important;
  text-shadow: none !important;
}

.home-page .home-routes-v140 .home-route-logo,
.home-page .home-routes-v132 .home-route-logo {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  filter: drop-shadow(0 0 22px rgba(0,0,0,.82)) drop-shadow(0 14px 42px rgba(0,0,0,.72)) !important;
  opacity: .96 !important;
  transform: none !important;
}

.home-page .home-routes-v140 .home-route-logo-sancticide,
.home-page .home-routes-v132 .home-route-logo-sancticide {
  max-width: clamp(280px, 31vw, 560px) !important;
}

.home-page .home-routes-v140 .home-route-logo-slavicpunk,
.home-page .home-routes-v132 .home-route-logo-slavicpunk {
  max-width: clamp(170px, 20vw, 360px) !important;
}

.home-page .home-routes-v140 .home-route-card:hover .home-route-logo,
.home-page .home-routes-v132 .home-route-card:hover .home-route-logo {
  transform: none !important;
  filter: drop-shadow(0 0 22px rgba(0,0,0,.82)) drop-shadow(0 14px 42px rgba(0,0,0,.72)) !important;
}

.works-v92-titleblock .works-logo-title {
  margin: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
}

.works-v92-titleblock .works-logo-title img {
  display: block !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  filter: drop-shadow(0 0 20px rgba(0,0,0,.78)) !important;
}

.works-v92-titleblock .works-logo-title-sancticide img {
  max-width: min(640px, 42vw) !important;
}

.works-v92-titleblock .works-logo-title-slavicpunk img {
  max-width: min(390px, 30vw) !important;
}

@media (max-width: 920px) {
  .home-page .home-routes-v140 .home-route-logo-title,
  .home-page .home-routes-v132 .home-route-logo-title {
    width: min(78%, 480px) !important;
    max-width: min(78%, 480px) !important;
  }
  .home-page .home-routes-v140 .home-route-logo-sancticide,
  .home-page .home-routes-v132 .home-route-logo-sancticide {
    max-width: clamp(240px, 62vw, 460px) !important;
  }
  .home-page .home-routes-v140 .home-route-logo-slavicpunk,
  .home-page .home-routes-v132 .home-route-logo-slavicpunk {
    max-width: clamp(180px, 46vw, 340px) !important;
  }
  .works-v92-titleblock .works-logo-title-sancticide img {
    max-width: min(92vw, 520px) !important;
  }
  .works-v92-titleblock .works-logo-title-slavicpunk img {
    max-width: min(74vw, 340px) !important;
  }
}


/* v142 — smaller centered project logos, fixed hover title position, default Twój K. hero cycling, studio marks. */
.home-case .home-case-cycle {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  width: 100vw !important;
  max-width: none !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: center top !important;
  opacity: 0 !important;
  transform: scale(1) !important;
  filter: none !important;
  transition: opacity .62s cubic-bezier(.22,.8,.18,1), filter .62s cubic-bezier(.22,.8,.18,1) !important;
}
.home-case .home-case-cycle.home-case-art-base {
  position: relative !important;
}
.home-case .home-case-cycle.is-active {
  opacity: 1 !important;
}
.home-case.is-logo-hover .home-case-cycle {
  opacity: 0 !important;
  transform: scale(1) !important;
}
.home-case.is-logo-hover .home-case-cycle.is-active {
  opacity: .10 !important;
  transform: scale(1.006) !important;
}
.home-case.is-logo-hover .home-case-art-hover {
  opacity: 1 !important;
}

.home-page .home-routes-v132 .home-route-title,
.home-page .home-routes-v132 .home-route-card:hover .home-route-title,
.home-page .home-routes-v138 .home-route-card:hover .home-route-title,
.home-page .home-routes-v139 .home-route-card:hover .home-route-title,
.home-page .home-routes-v140 .home-route-card:hover .home-route-title,
.home-page .home-routes-v142 .home-route-card:hover .home-route-title {
  inset: 50% auto auto 50% !important;
  transform: translate3d(-50%, -50%, 0) !important;
  transition: none !important;
}

.home-page .home-routes-v132 .home-route-logo-title,
.home-page .home-routes-v140 .home-route-logo-title {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: calc(100% - clamp(60px, 8vw, 150px)) !important;
  height: auto !important;
  padding: 0 !important;
  line-height: 0 !important;
  text-align: center !important;
}
.home-page .home-routes-v132 .home-route-logo,
.home-page .home-routes-v140 .home-route-logo {
  display: block !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  margin: 0 auto !important;
  transform: none !important;
  opacity: .96 !important;
  filter: drop-shadow(0 0 18px rgba(0,0,0,.82)) drop-shadow(0 12px 36px rgba(0,0,0,.72)) !important;
}
.home-page .home-routes-v132 .home-route-logo-sancticide,
.home-page .home-routes-v140 .home-route-logo-sancticide {
  max-width: clamp(210px, 23vw, 420px) !important;
}
.home-page .home-routes-v132 .home-route-logo-slavicpunk,
.home-page .home-routes-v140 .home-route-logo-slavicpunk {
  max-width: clamp(135px, 15.5vw, 275px) !important;
}
.home-page .home-routes-v132 .home-route-card:hover .home-route-logo,
.home-page .home-routes-v140 .home-route-card:hover .home-route-logo {
  transform: none !important;
}

.works-v92-titleblock .works-logo-title-sancticide img {
  max-width: min(440px, 31vw) !important;
}
.works-v92-titleblock .works-logo-title-slavicpunk img {
  max-width: min(275px, 22vw) !important;
}
.works-studio-mark {
  margin-top: clamp(14px, 1.45vw, 24px) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: clamp(10px, .85vw, 16px) !important;
  color: rgba(243,240,232,.55) !important;
  font-family: var(--mono) !important;
  font-size: clamp(8px, .58vw, 10px) !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
  pointer-events: none !important;
}
.works-studio-mark img {
  display: block !important;
  width: clamp(70px, 5.6vw, 112px) !important;
  height: auto !important;
  max-width: none !important;
  opacity: .72 !important;
  filter: drop-shadow(0 0 14px rgba(0,0,0,.68)) !important;
}

@media (max-width: 920px) {
  .home-page .home-routes-v132 .home-route-logo-sancticide,
  .home-page .home-routes-v140 .home-route-logo-sancticide {
    max-width: clamp(190px, 54vw, 350px) !important;
  }
  .home-page .home-routes-v132 .home-route-logo-slavicpunk,
  .home-page .home-routes-v140 .home-route-logo-slavicpunk {
    max-width: clamp(135px, 40vw, 250px) !important;
  }
  .works-v92-titleblock .works-logo-title-sancticide img {
    max-width: min(82vw, 400px) !important;
  }
  .works-v92-titleblock .works-logo-title-slavicpunk img {
    max-width: min(62vw, 260px) !important;
  }
  .works-studio-mark {
    margin-top: 12px !important;
    font-size: 8px !important;
    letter-spacing: .16em !important;
  }
  .works-studio-mark img {
    width: 74px !important;
  }
}

/* v143 — reduce official game logos, move homepage game logos to lower-left, restore Personal Art rail and clean RSG studio mark. */

/* Homepage project logos: much smaller, lower-left, no hover drift. */
.home-page .home-routes-v143 .home-route-logo-title,
.home-page .home-routes-v143 .home-route-card:hover .home-route-logo-title {
  position: absolute !important;
  z-index: 12 !important;
  inset: auto auto clamp(26px, 2.1vw, 42px) clamp(26px, 2.1vw, 44px) !important;
  width: auto !important;
  max-width: min(42%, 360px) !important;
  height: auto !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 0 !important;
  text-align: left !important;
  transform: none !important;
  transition: none !important;
}
.home-page .home-routes-v143 .home-route-logo,
.home-page .home-routes-v143 .home-route-card:hover .home-route-logo {
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  object-fit: contain !important;
  opacity: .94 !important;
  transform: none !important;
  filter: drop-shadow(0 0 14px rgba(0,0,0,.86)) drop-shadow(0 10px 28px rgba(0,0,0,.72)) !important;
}
.home-page .home-routes-v143 .home-route-logo-sancticide {
  max-width: clamp(118px, 14.2vw, 245px) !important;
}
.home-page .home-routes-v143 .home-route-logo-slavicpunk {
  max-width: clamp(86px, 9.8vw, 165px) !important;
}
.home-page .home-routes-v143 .home-route-title:not(.home-route-logo-title),
.home-page .home-routes-v143 .home-route-card:hover .home-route-title:not(.home-route-logo-title) {
  inset: 50% auto auto 50% !important;
  transform: translate3d(-50%, -50%, 0) !important;
  transition: none !important;
}
.home-page .home-routes-v143 .home-route-card,
.home-page .home-routes-v143 .home-route-card:hover,
.home-page .home-routes-v143 .home-route-card *:not(.home-route-cycle-img),
.home-page .home-routes-v143 .home-route-card:hover *:not(.home-route-cycle-img) {
  transform: none !important;
}
.home-page .home-routes-v143 .home-route-meta,
.home-page .home-routes-v143 .home-route-card:hover .home-route-meta {
  right: clamp(16px, 1.55vw, 28px) !important;
  bottom: clamp(15px, 1.55vw, 26px) !important;
  transform: none !important;
}

/* Professional Works: project logos smaller; studio mark moves to facts column. */
body.works-v143 .works-v92-titleblock .works-logo-title-sancticide img {
  max-width: min(260px, 21vw) !important;
}
body.works-v143 .works-v92-titleblock .works-logo-title-slavicpunk img {
  max-width: min(170px, 15vw) !important;
}
body.works-v143 .works-v92-titleblock .works-logo-title {
  margin: clamp(6px, .7vw, 12px) 0 0 !important;
}
body.works-v143 .works-studio-mark {
  display: none !important;
}
body.works-v143 .works-fact-studio {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 0 clamp(14px, 1.4vw, 22px) 0 !important;
  padding: 0 0 clamp(12px, 1.1vw, 18px) 0 !important;
  border-bottom: 1px solid rgba(243,240,232,.08) !important;
  color: rgba(243,240,232,.50) !important;
  font-family: var(--mono) !important;
  font-size: clamp(7px, .48vw, 8.5px) !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}
body.works-v143 .works-fact-studio img {
  display: block !important;
  width: clamp(30px, 2.2vw, 42px) !important;
  height: clamp(30px, 2.2vw, 42px) !important;
  object-fit: contain !important;
  max-width: none !important;
  opacity: .88 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  background: transparent !important;
}
body.works-v143 .works-fact-studio span {
  display: block !important;
  white-space: nowrap !important;
  opacity: .72 !important;
}

/* Personal Art: restore fixed left section menu, reduce top black margin, refine section titles. */
body.personal-v143 .personal-v123-rail {
  position: fixed !important;
  z-index: 340 !important;
  left: clamp(24px, 3.8vw, 68px) !important;
  top: 36vh !important;
  width: clamp(160px, 15vw, 260px) !important;
  display: grid !important;
  gap: 16px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
}
body.personal-v143 .personal-v123-rail a {
  display: inline-flex !important;
  width: fit-content !important;
  align-items: baseline !important;
  gap: 10px !important;
  color: rgba(243,240,232,.42) !important;
  font-family: var(--mono) !important;
  font-size: clamp(9px, .64vw, 11px) !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  transform: translateX(0) !important;
}
body.personal-v143 .personal-v123-rail a:hover,
body.personal-v143 .personal-v123-rail a.is-active {
  color: rgba(243,240,232,.93) !important;
  transform: translateX(4px) !important;
}
body.personal-v143 .personal-v123-rail a span::after {
  content: "" !important;
  display: inline-block !important;
  width: 24px !important;
  height: 1px !important;
  margin-left: 10px !important;
  vertical-align: middle !important;
  background: rgba(243,240,232,.16) !important;
  transform: scaleX(.35) !important;
  transform-origin: left center !important;
  transition: transform .25s ease, background .25s ease !important;
}
body.personal-v143 .personal-v123-rail a:hover span::after,
body.personal-v143 .personal-v123-rail a.is-active span::after {
  transform: scaleX(1) !important;
  background: rgba(243,240,232,.48) !important;
}
body.personal-v143 .personal-v123-rail a em {
  color: rgba(243,240,232,.30) !important;
  font-style: normal !important;
  font-size: .82em !important;
  letter-spacing: .12em !important;
}
body.personal-v143 .pa93-opener {
  padding-top: calc(var(--header-h) + clamp(28px, 4.2vh, 58px)) !important;
  padding-bottom: clamp(52px, 7vh, 94px) !important;
}
body.personal-v143 .pa94-carousel {
  margin-top: 0 !important;
}
body.personal-v143 .pa100-under-carousel {
  margin-top: clamp(42px, 5.5vh, 76px) !important;
  padding-top: clamp(22px, 3vh, 36px) !important;
}
body.personal-v143 .personal-v123-art-section {
  margin-top: clamp(52px, 7.5vh, 96px) !important;
  padding-top: clamp(42px, 5.8vh, 72px) !important;
}
body.personal-v143 .personal-v123-art-section > h2 {
  font-size: clamp(14px, 1.12vw, 22px) !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  letter-spacing: .20em !important;
  margin: 0 0 clamp(24px, 3.1vh, 42px) 0 !important;
  color: rgba(243,240,232,.86) !important;
}
body.personal-v143 .personal-v123-art-section > .pa93-gallery {
  margin-top: 0 !important;
}

@media (max-width: 1180px) {
  body.personal-v143 .personal-v123-rail {
    position: sticky !important;
    top: var(--header-h) !important;
    left: auto !important;
    width: auto !important;
    display: flex !important;
    gap: 20px !important;
    padding: 14px 18px !important;
    margin: 0 !important;
    background: rgba(0,0,0,.82) !important;
    border-top: 1px solid rgba(243,240,232,.07) !important;
    border-bottom: 1px solid rgba(243,240,232,.07) !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
  }
  body.personal-v143 .personal-v123-rail::before,
  body.personal-v143 .personal-v123-rail a span::after {
    display: none !important;
  }
  body.personal-v143 .pa93-opener {
    padding-top: calc(var(--header-h) + 38px) !important;
  }
}

@media (max-width: 920px) {
  .home-page .home-routes-v143 .home-route-logo-title,
  .home-page .home-routes-v143 .home-route-card:hover .home-route-logo-title {
    bottom: 22px !important;
    left: 22px !important;
    max-width: 48% !important;
  }
  .home-page .home-routes-v143 .home-route-logo-sancticide { max-width: clamp(104px, 30vw, 180px) !important; }
  .home-page .home-routes-v143 .home-route-logo-slavicpunk { max-width: clamp(78px, 24vw, 135px) !important; }
  body.works-v143 .works-v92-titleblock .works-logo-title-sancticide img { max-width: min(78vw, 260px) !important; }
  body.works-v143 .works-v92-titleblock .works-logo-title-slavicpunk img { max-width: min(58vw, 170px) !important; }
  body.works-v143 .works-fact-studio img {
    width: 34px !important;
    height: 34px !important;
  }
  body.personal-v143 .personal-v123-art-section > h2 {
    font-size: clamp(16px, 5vw, 24px) !important;
  }
}

@media (max-width: 760px) {
  body.personal-v143 .personal-v123-rail {
    display: none !important;
  }
}

/* v144 — fix Personal Art rail, reduce Personal top gap, add right-side gallery preview, refine project/studio logos. */

/* Homepage project logos: much smaller, fixed lower-left, no hover drift / clipping. */
body.home-v144 .home-route-logo-title,
body.home-v144 .home-route-card:hover .home-route-logo-title {
  position: absolute !important;
  z-index: 18 !important;
  inset: auto auto clamp(22px, 1.75vw, 34px) clamp(24px, 1.9vw, 38px) !important;
  width: auto !important;
  height: auto !important;
  max-width: 34% !important;
  overflow: visible !important;
  display: block !important;
  line-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: left !important;
  transform: none !important;
  transition: none !important;
}
body.home-v144 .home-route-logo,
body.home-v144 .home-route-card:hover .home-route-logo {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: left bottom !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: .95 !important;
  transform: none !important;
  filter: drop-shadow(0 0 12px rgba(0,0,0,.88)) drop-shadow(0 10px 26px rgba(0,0,0,.76)) !important;
}
body.home-v144 .home-route-logo-sancticide {
  max-width: clamp(88px, 10vw, 168px) !important;
}
body.home-v144 .home-route-logo-slavicpunk {
  max-width: clamp(86px, 8.8vw, 148px) !important;
}
body.home-v144 .home-route-title:not(.home-route-logo-title),
body.home-v144 .home-route-card:hover .home-route-title:not(.home-route-logo-title) {
  inset: 50% auto auto 50% !important;
  transform: translate3d(-50%, -50%, 0) !important;
  transition: none !important;
}
body.home-v144 .home-route-card:hover .home-route-logo-title,
body.home-v144 .home-route-card:hover .home-route-logo-title * {
  transform: none !important;
}

/* Professional Works: smaller official project logos. */
body.works-v144 .works-v92-titleblock .works-logo-title-sancticide img {
  max-width: min(190px, 15.5vw) !important;
}
body.works-v144 .works-v92-titleblock .works-logo-title-slavicpunk img {
  max-width: min(118px, 10.5vw) !important;
}
body.works-v144 .works-v92-titleblock .works-logo-title {
  margin: clamp(4px, .5vw, 9px) 0 0 !important;
}

/* Red Square Games mark: original file, under Scope, slightly larger than v143. */
body.works-v144 .works-studio-mark {
  display: none !important;
}
body.works-v144 .works-fact-studio {
  display: inline-flex !important;
  align-items: center !important;
  gap: clamp(8px, .75vw, 13px) !important;
  margin: clamp(10px, 1vw, 16px) 0 0 0 !important;
  padding: clamp(10px, 1vw, 16px) 0 0 0 !important;
  border-top: 1px solid rgba(243,240,232,.07) !important;
  border-bottom: 0 !important;
  color: rgba(243,240,232,.52) !important;
  font-family: var(--mono) !important;
  font-size: clamp(7px, .50vw, 8.8px) !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}
body.works-v144 .works-fact-studio img {
  display: block !important;
  width: clamp(33px, 2.42vw, 46px) !important;
  height: clamp(33px, 2.42vw, 46px) !important;
  max-width: none !important;
  object-fit: contain !important;
  object-position: center !important;
  opacity: .92 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  background: transparent !important;
}
body.works-v144 .works-fact-studio span {
  display: block !important;
  white-space: nowrap !important;
  opacity: .76 !important;
}

/* Personal Art: robust standalone left rail. */
body.personal-v144 .personal-v144-rail {
  position: fixed !important;
  z-index: 9999 !important;
  left: clamp(24px, 3.8vw, 68px) !important;
  top: 36vh !important;
  width: clamp(168px, 15vw, 270px) !important;
  display: grid !important;
  gap: 16px !important;
  font-family: var(--mono) !important;
  text-transform: uppercase !important;
  letter-spacing: .13em !important;
  font-size: 9px !important;
  line-height: 1.45 !important;
  color: rgba(243,240,232,.32) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
}
body.personal-v144 .personal-v144-rail::before {
  content: "" !important;
  display: block !important;
  width: 28px !important;
  height: 1px !important;
  margin-bottom: 2px !important;
  background: rgba(243,240,232,.22) !important;
}
body.personal-v144 .personal-v144-rail a {
  position: relative !important;
  display: inline-flex !important;
  width: fit-content !important;
  align-items: baseline !important;
  gap: 10px !important;
  color: rgba(243,240,232,.42) !important;
  font-family: var(--mono) !important;
  font-size: clamp(9px, .64vw, 11px) !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transform: translateX(0) !important;
  transition: color .22s ease, transform .22s ease !important;
}
body.personal-v144 .personal-v144-rail a span::after {
  content: "" !important;
  display: inline-block !important;
  width: 24px !important;
  height: 1px !important;
  margin-left: 10px !important;
  vertical-align: middle !important;
  background: rgba(243,240,232,.16) !important;
  transform: scaleX(.35) !important;
  transform-origin: left center !important;
  transition: transform .25s ease, background .25s ease !important;
}
body.personal-v144 .personal-v144-rail a:hover,
body.personal-v144 .personal-v144-rail a.is-active {
  color: rgba(243,240,232,.94) !important;
  transform: translateX(4px) !important;
}
body.personal-v144 .personal-v144-rail a:hover span::after,
body.personal-v144 .personal-v144-rail a.is-active span::after {
  transform: scaleX(1) !important;
  background: rgba(243,240,232,.48) !important;
}
body.personal-v144 .personal-v144-rail a em {
  color: rgba(243,240,232,.30) !important;
  font-style: normal !important;
  font-size: .82em !important;
  letter-spacing: .12em !important;
}
body.personal-v144 .personal-v144-rail a:hover em,
body.personal-v144 .personal-v144-rail a.is-active em {
  color: rgba(243,240,232,.52) !important;
}

/* Personal Art: less empty black space at top. */
body.personal-v144 .pa93-opener {
  padding-top: calc(var(--header-h) + clamp(12px, 2vh, 30px)) !important;
  padding-bottom: clamp(46px, 6.2vh, 84px) !important;
}
body.personal-v144 .pa94-carousel {
  margin-top: 0 !important;
}
body.personal-v144 .pa100-under-carousel {
  margin-top: clamp(34px, 4.6vh, 62px) !important;
  padding-top: clamp(18px, 2.4vh, 30px) !important;
}

/* Personal Art gallery sections: left masonry + right preview. */
body.personal-v144 .personal-v123-art-section {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
  margin: clamp(40px, 6vh, 78px) 0 0 0 !important;
  padding: clamp(38px, 5vh, 64px) clamp(38px, 5vw, 96px) clamp(72px, 9vh, 132px) clamp(250px, 16vw, 335px) !important;
}
body.personal-v144 .personal-v123-art-section > h2 {
  width: auto !important;
  max-width: none !important;
  margin: 0 0 clamp(20px, 2.6vh, 34px) 0 !important;
  font-size: clamp(12px, .95vw, 18px) !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  letter-spacing: .24em !important;
  color: rgba(243,240,232,.88) !important;
}
body.personal-v144 .pa144-gallery-layout {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: minmax(300px, 43%) minmax(360px, 1fr) !important;
  align-items: start !important;
  gap: clamp(28px, 4.2vw, 74px) !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
body.personal-v144 .pa144-gallery-layout > .pa93-gallery {
  columns: 3 118px !important;
  column-gap: clamp(7px, .62vw, 11px) !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
body.personal-v144 .pa144-gallery-layout .gallery-item {
  margin-bottom: clamp(7px, .62vw, 11px) !important;
  cursor: pointer !important;
  transition: opacity .18s ease, filter .18s ease !important;
}
body.personal-v144 .pa144-gallery-layout .gallery-item:not(.is-previewed) {
  opacity: .78 !important;
}
body.personal-v144 .pa144-gallery-layout .gallery-item.is-previewed,
body.personal-v144 .pa144-gallery-layout .gallery-item:hover {
  opacity: 1 !important;
}
body.personal-v144 .pa144-gallery-layout .gallery-item button {
  cursor: pointer !important;
}
body.personal-v144 .pa144-gallery-preview {
  position: sticky !important;
  top: calc(var(--header-h) + clamp(42px, 6vh, 84px)) !important;
  align-self: start !important;
  min-height: 42vh !important;
}
body.personal-v144 .pa144-gallery-preview figure {
  margin: 0 !important;
}
body.personal-v144 .pa144-gallery-preview img {
  display: block !important;
  width: 100% !important;
  max-height: min(62vh, 660px) !important;
  object-fit: contain !important;
  object-position: left top !important;
  background: rgba(0,0,0,.28) !important;
  filter: brightness(.94) contrast(1.025) saturate(.98) !important;
}
body.personal-v144 .pa144-gallery-preview figcaption {
  display: grid !important;
  grid-template-columns: minmax(80px, .22fr) minmax(160px, .42fr) minmax(220px, 1fr) !important;
  gap: clamp(18px, 2.1vw, 38px) !important;
  align-items: start !important;
  margin-top: clamp(16px, 2.2vh, 28px) !important;
  padding-top: clamp(13px, 1.8vh, 22px) !important;
  border-top: 1px solid rgba(243,240,232,.10) !important;
}
body.personal-v144 .pa144-preview-meta {
  margin: 0 !important;
  color: rgba(243,240,232,.34) !important;
  font: 600 clamp(8px, .54vw, 10px)/1 var(--mono) !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}
body.personal-v144 .pa144-gallery-preview h3 {
  margin: 0 !important;
  color: rgba(243,240,232,.88) !important;
  font: 600 clamp(10px, .74vw, 13px)/1.25 var(--mono) !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}
body.personal-v144 .pa144-preview-desc {
  margin: 0 !important;
  max-width: 520px !important;
  color: rgba(243,240,232,.46) !important;
  font-size: clamp(11px, .76vw, 13px) !important;
  line-height: 1.65 !important;
}

@media (max-width: 1180px) {
  body.personal-v144 .personal-v144-rail {
    position: sticky !important;
    top: var(--header-h) !important;
    left: auto !important;
    width: auto !important;
    display: flex !important;
    gap: 20px !important;
    padding: 14px 18px !important;
    margin: 0 !important;
    background: rgba(0,0,0,.82) !important;
    border-top: 1px solid rgba(243,240,232,.07) !important;
    border-bottom: 1px solid rgba(243,240,232,.07) !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
  }
  body.personal-v144 .personal-v144-rail::before,
  body.personal-v144 .personal-v144-rail a span::after {
    display: none !important;
  }
  body.personal-v144 .personal-v123-art-section {
    padding-left: clamp(22px, 4vw, 48px) !important;
    padding-right: clamp(22px, 4vw, 48px) !important;
  }
  body.personal-v144 .pa144-gallery-layout {
    grid-template-columns: 1fr !important;
    gap: 26px !important;
  }
  body.personal-v144 .pa144-gallery-preview {
    position: relative !important;
    top: auto !important;
  }
  body.personal-v144 .pa144-gallery-preview figcaption {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
}
@media (max-width: 760px) {
  body.personal-v144 .personal-v144-rail {
    display: none !important;
  }
}

/* v145 — clean Personal Art rail, 2-column left gallery + larger right preview, works spacing/facts fixes, homepage title stability. */

/* Homepage: keep all tile labels locked in place; personal tiles lower-left, no hover drift. */
body.home-v145 .home-route-card,
body.home-v145 .home-route-card:hover,
body.home-v145 .home-route-card *:not(.home-route-cycle-img),
body.home-v145 .home-route-card:hover *:not(.home-route-cycle-img) {
  transform: none !important;
}
body.home-v145 .home-route-third .home-route-title,
body.home-v145 .home-route-third:hover .home-route-title,
body.home-v145 .home-route-title:not(.home-route-logo-title),
body.home-v145 .home-route-card:hover .home-route-title:not(.home-route-logo-title) {
  position: absolute !important;
  z-index: 18 !important;
  inset: auto auto clamp(22px, 1.75vw, 34px) clamp(24px, 1.9vw, 38px) !important;
  transform: none !important;
  transition: none !important;
  margin: 0 !important;
  text-align: left !important;
  justify-self: auto !important;
  align-self: auto !important;
  width: auto !important;
  max-width: 70% !important;
}
body.home-v145 .home-route-logo-title,
body.home-v145 .home-route-card:hover .home-route-logo-title {
  inset: auto auto clamp(24px, 1.85vw, 36px) clamp(24px, 1.9vw, 38px) !important;
  max-width: 26% !important;
  transform: none !important;
  transition: none !important;
  overflow: visible !important;
}
body.home-v145 .home-route-logo,
body.home-v145 .home-route-card:hover .home-route-logo {
  transform: none !important;
  transition: none !important;
  object-fit: contain !important;
  object-position: left bottom !important;
}
body.home-v145 .home-route-logo-sancticide {
  max-width: clamp(64px, 7.2vw, 120px) !important;
}
body.home-v145 .home-route-logo-slavicpunk {
  max-width: clamp(58px, 6.2vw, 102px) !important;
}

/* Professional Works: project logos smaller, facts lower, RSG under Scope and 10% larger. */
body.works-v145 .works-v92-titleblock .works-logo-title-sancticide img {
  max-width: min(142px, 11vw) !important;
  width: auto !important;
  height: auto !important;
}
body.works-v145 .works-v92-titleblock .works-logo-title-slavicpunk img {
  max-width: min(92px, 7.6vw) !important;
  width: auto !important;
  height: auto !important;
}
body.works-v145 .works-v92-case-head {
  align-items: start !important;
  margin-bottom: clamp(18px, 2.7vh, 32px) !important;
}
body.works-v145 .works-v92-facts {
  margin-top: clamp(68px, 7.2vw, 124px) !important;
  padding-top: 0 !important;
}
body.works-v145 .works-v92-content {
  padding-top: 0 !important;
}
body.works-v145 .works-v92-case:first-child {
  padding-top: clamp(30px, 4.8vh, 58px) !important;
}
body.works-v145 .works-v92-desc {
  margin-bottom: clamp(28px, 4.2vh, 52px) !important;
}
body.works-v145 .works-fact-studio {
  display: inline-flex !important;
  align-items: center !important;
  gap: clamp(8px, .7vw, 12px) !important;
  margin-top: clamp(10px, .9vw, 15px) !important;
  padding-top: clamp(10px, .9vw, 15px) !important;
  border-top: 1px solid rgba(243,240,232,.07) !important;
}
body.works-v145 .works-fact-studio img {
  width: clamp(36px, 2.66vw, 51px) !important;
  height: clamp(36px, 2.66vw, 51px) !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}
body.works-v145 .works-fact-studio span {
  font-size: clamp(7px, .50vw, 8.8px) !important;
  letter-spacing: .16em !important;
}

/* Personal Art: force the left rail back on screen. */
body.personal-v145 .personal-v145-rail,
body.personal-v145 .personal-v144-rail,
body.personal-v145 .personal-v123-rail {
  position: fixed !important;
  z-index: 2147483000 !important;
  left: clamp(26px, 3.4vw, 60px) !important;
  top: 36vh !important;
  width: clamp(170px, 14vw, 245px) !important;
  display: grid !important;
  gap: 16px !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
  overflow: visible !important;
  white-space: normal !important;
  font-family: var(--mono) !important;
  text-transform: uppercase !important;
  letter-spacing: .13em !important;
  color: rgba(243,240,232,.45) !important;
}
body.personal-v145 .personal-v145-rail::before,
body.personal-v145 .personal-v144-rail::before,
body.personal-v145 .personal-v123-rail::before {
  content: "" !important;
  display: block !important;
  width: 28px !important;
  height: 1px !important;
  margin-bottom: 2px !important;
  background: rgba(243,240,232,.22) !important;
}
body.personal-v145 .personal-v145-rail a,
body.personal-v145 .personal-v144-rail a,
body.personal-v145 .personal-v123-rail a {
  display: inline-flex !important;
  align-items: baseline !important;
  width: fit-content !important;
  gap: 10px !important;
  color: rgba(243,240,232,.42) !important;
  font: 600 clamp(9px, .64vw, 11px)/1.45 var(--mono) !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}
body.personal-v145 .personal-v145-rail a span::after,
body.personal-v145 .personal-v144-rail a span::after,
body.personal-v145 .personal-v123-rail a span::after {
  content: "" !important;
  display: inline-block !important;
  width: 24px !important;
  height: 1px !important;
  margin-left: 10px !important;
  vertical-align: middle !important;
  background: rgba(243,240,232,.16) !important;
  transform: scaleX(.35) !important;
  transform-origin: left center !important;
}
body.personal-v145 .personal-v145-rail a:hover,
body.personal-v145 .personal-v145-rail a.is-active,
body.personal-v145 .personal-v144-rail a:hover,
body.personal-v145 .personal-v144-rail a.is-active,
body.personal-v145 .personal-v123-rail a:hover,
body.personal-v145 .personal-v123-rail a.is-active {
  color: rgba(243,240,232,.94) !important;
}
body.personal-v145 .personal-v145-rail a:hover span::after,
body.personal-v145 .personal-v145-rail a.is-active span::after,
body.personal-v145 .personal-v144-rail a:hover span::after,
body.personal-v145 .personal-v144-rail a.is-active span::after,
body.personal-v145 .personal-v123-rail a:hover span::after,
body.personal-v145 .personal-v123-rail a.is-active span::after {
  transform: scaleX(1) !important;
  background: rgba(243,240,232,.48) !important;
}
body.personal-v145 .personal-v145-rail a em,
body.personal-v145 .personal-v144-rail a em,
body.personal-v145 .personal-v123-rail a em {
  color: rgba(243,240,232,.32) !important;
  font-style: normal !important;
  font-size: .82em !important;
  letter-spacing: .12em !important;
}

/* Personal Art: less top black margin. */
body.personal-v145 .pa93-opener {
  padding-top: calc(var(--header-h) + clamp(6px, 1.1vh, 18px)) !important;
  padding-bottom: clamp(40px, 5.5vh, 76px) !important;
}
body.personal-v145 .pa94-carousel {
  margin-top: 0 !important;
}
body.personal-v145 .pa100-under-carousel {
  margin-top: clamp(28px, 3.6vh, 50px) !important;
  padding-top: clamp(15px, 2vh, 24px) !important;
}

/* Personal Art gallery: 2-column thumbnail masonry + much larger centered right preview. */
body.personal-v145 .personal-v123-art-section {
  margin-top: clamp(36px, 5.4vh, 68px) !important;
  padding: clamp(32px, 4.4vh, 56px) clamp(44px, 5vw, 98px) clamp(72px, 8.8vh, 128px) clamp(250px, 16vw, 335px) !important;
}
body.personal-v145 .personal-v123-art-section > h2 {
  font-size: clamp(11px, .82vw, 15px) !important;
  letter-spacing: .24em !important;
  margin-bottom: clamp(18px, 2.3vh, 30px) !important;
}
body.personal-v145 .pa144-gallery-layout {
  grid-template-columns: minmax(230px, 30%) minmax(520px, 1fr) !important;
  gap: clamp(30px, 4.8vw, 88px) !important;
}
body.personal-v145 .pa144-gallery-layout > .pa93-gallery {
  columns: 2 118px !important;
  column-gap: clamp(7px, .62vw, 11px) !important;
}
body.personal-v145 .pa144-gallery-layout .gallery-item {
  margin-bottom: clamp(7px, .62vw, 11px) !important;
}
body.personal-v145 .pa144-gallery-preview {
  min-height: 54vh !important;
  display: grid !important;
  align-content: start !important;
  justify-items: center !important;
}
body.personal-v145 .pa144-gallery-preview figure {
  width: 100% !important;
}
body.personal-v145 .pa144-gallery-preview img {
  width: 100% !important;
  max-width: min(100%, 1040px) !important;
  max-height: min(76vh, 900px) !important;
  margin: 0 auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: transparent !important;
}
body.personal-v145 .pa144-gallery-preview figcaption {
  width: min(100%, 1040px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  grid-template-columns: minmax(70px, .18fr) minmax(140px, .34fr) minmax(240px, 1fr) !important;
}

@media (max-width: 1180px) {
  body.personal-v145 .personal-v145-rail,
  body.personal-v145 .personal-v144-rail,
  body.personal-v145 .personal-v123-rail {
    position: sticky !important;
    z-index: 300 !important;
    top: var(--header-h) !important;
    left: auto !important;
    width: auto !important;
    display: flex !important;
    gap: 20px !important;
    padding: 14px 18px !important;
    background: rgba(0,0,0,.86) !important;
    border-top: 1px solid rgba(243,240,232,.07) !important;
    border-bottom: 1px solid rgba(243,240,232,.07) !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
  }
  body.personal-v145 .personal-v145-rail::before,
  body.personal-v145 .personal-v144-rail::before,
  body.personal-v145 .personal-v123-rail::before,
  body.personal-v145 .personal-v145-rail a span::after,
  body.personal-v145 .personal-v144-rail a span::after,
  body.personal-v145 .personal-v123-rail a span::after {
    display: none !important;
  }
  body.personal-v145 .personal-v123-art-section {
    padding-left: clamp(22px, 4vw, 48px) !important;
    padding-right: clamp(22px, 4vw, 48px) !important;
  }
  body.personal-v145 .pa144-gallery-layout {
    grid-template-columns: 1fr !important;
  }
  body.personal-v145 .pa144-gallery-layout > .pa93-gallery {
    columns: 2 150px !important;
  }
  body.personal-v145 .pa144-gallery-preview {
    position: relative !important;
    top: auto !important;
  }
}
@media (max-width: 760px) {
  body.personal-v145 .personal-v145-rail,
  body.personal-v145 .personal-v144-rail,
  body.personal-v145 .personal-v123-rail {
    display: none !important;
  }
}


/* v146 — cleanup pass: lock homepage logos/labels, repair Works rhythm, force Personal Art rail + cleaner gallery preview. */

/* HOMEPAGE — game logos truly small, lower-left, never centered/shifted/cropped. */
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-card,
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-card:hover,
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-card *:not(.home-route-cycle-img),
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-card:hover *:not(.home-route-cycle-img) {
  transform: none !important;
  transition-property: opacity, filter, clip-path !important;
}
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-logo-title,
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-card:hover .home-route-logo-title {
  position: absolute !important;
  z-index: 25 !important;
  left: clamp(28px, 2.1vw, 44px) !important;
  bottom: clamp(28px, 2vw, 42px) !important;
  right: auto !important;
  top: auto !important;
  width: auto !important;
  max-width: 240px !important;
  max-height: 82px !important;
  height: auto !important;
  display: block !important;
  line-height: 0 !important;
  overflow: visible !important;
  text-align: left !important;
  padding: 0 !important;
  margin: 0 !important;
  clip-path: none !important;
  transform: none !important;
  opacity: 1 !important;
  transition: none !important;
}
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-logo,
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-card:hover .home-route-logo {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  max-height: 72px !important;
  object-fit: contain !important;
  object-position: left bottom !important;
  margin: 0 !important;
  padding: 0 !important;
  clip-path: none !important;
  opacity: .94 !important;
  transform: none !important;
  transition: none !important;
  filter: drop-shadow(0 0 12px rgba(0,0,0,.9)) drop-shadow(0 10px 28px rgba(0,0,0,.78)) !important;
}
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-logo-sancticide {
  width: clamp(96px, 8.6vw, 158px) !important;
  max-width: clamp(96px, 8.6vw, 158px) !important;
  max-height: 42px !important;
}
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-logo-slavicpunk {
  width: clamp(76px, 7.2vw, 128px) !important;
  max-width: clamp(76px, 7.2vw, 128px) !important;
  max-height: 64px !important;
}
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-third .home-route-title,
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-third:hover .home-route-title,
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-title:not(.home-route-logo-title),
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-card:hover .home-route-title:not(.home-route-logo-title) {
  position: absolute !important;
  z-index: 25 !important;
  left: clamp(26px, 2vw, 42px) !important;
  bottom: clamp(24px, 1.9vw, 38px) !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  transition: none !important;
  text-align: left !important;
  margin: 0 !important;
  width: auto !important;
  max-width: 70% !important;
}
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-meta,
body.home-v146.home-page .home-routes.home-routes-v132.home-routes-v143 .home-route-card:hover .home-route-meta {
  z-index: 25 !important;
  right: clamp(24px, 2vw, 42px) !important;
  bottom: clamp(26px, 2vw, 40px) !important;
  transform: none !important;
}
body.home-v146.home-page .home-statement-v139 {
  padding-top: clamp(84px, 10vh, 138px) !important;
  padding-bottom: clamp(70px, 8vh, 112px) !important;
}
body.home-v146.home-page .home-routes.home-routes-v143 {
  padding-top: 0 !important;
}

/* WORKS — remove the broken vertical gap; facts sit with the case title/description instead of floating too high/low. */
body.works-v146 .works-v92-intro {
  padding-bottom: clamp(34px, 5.2vh, 64px) !important;
}
body.works-v146 .works-v92-content {
  padding-top: 0 !important;
}
body.works-v146 .works-v92-case {
  padding-top: clamp(42px, 6.2vh, 78px) !important;
  padding-bottom: clamp(86px, 12vh, 150px) !important;
}
body.works-v146 .works-v92-case:first-child {
  padding-top: clamp(34px, 4.8vh, 58px) !important;
}
body.works-v146 .works-v92-case-head {
  align-items: end !important;
  gap: clamp(44px, 6vw, 96px) !important;
  margin-bottom: clamp(18px, 2.5vh, 32px) !important;
}
body.works-v146 .works-v92-facts {
  margin-top: 0 !important;
  align-self: end !important;
  padding-top: 0 !important;
  transform: none !important;
}
body.works-v146 .works-v92-desc {
  margin-top: 0 !important;
  margin-bottom: clamp(28px, 4vh, 52px) !important;
}
/* Project logos: controlled, not oversized but not unreadably tiny. */
body.works-v146.works-page .works-v92-titleblock .works-logo-title-sancticide img {
  width: clamp(120px, 10vw, 172px) !important;
  max-width: clamp(120px, 10vw, 172px) !important;
  height: auto !important;
}
body.works-v146.works-page .works-v92-titleblock .works-logo-title-slavicpunk img {
  width: clamp(82px, 7.6vw, 132px) !important;
  max-width: clamp(82px, 7.6vw, 132px) !important;
  height: auto !important;
}
body.works-v146 .works-fact-studio {
  margin-top: clamp(10px, 1vw, 15px) !important;
  padding-top: clamp(10px, .9vw, 14px) !important;
  display: inline-flex !important;
  align-items: center !important;
}
body.works-v146 .works-fact-studio img {
  width: clamp(38px, 2.8vw, 54px) !important;
  height: clamp(38px, 2.8vw, 54px) !important;
  object-fit: contain !important;
  background: transparent !important;
  filter: none !important;
}

/* PERSONAL ART — no dead top gap, left menu always visible, gallery becomes left thumbnails + big right preview. */
body.personal-v146 .personal-v113-top-art,
body.personal-v146 .personal-v93-main::before,
body.personal-v146 .personal-v113-intro {
  display: none !important;
}
body.personal-v146 .pa93-opener {
  padding-top: calc(var(--header-h) + clamp(12px, 1.6vh, 24px)) !important;
  padding-bottom: clamp(34px, 5vh, 72px) !important;
  margin-top: 0 !important;
}
body.personal-v146 .pa94-carousel {
  margin-top: 0 !important;
}
body.personal-v146 .personal-v146-rail,
body.personal-v146 .personal-v145-rail,
body.personal-v146 .personal-v144-rail,
body.personal-v146 .personal-v123-rail {
  position: fixed !important;
  z-index: 2147483647 !important;
  left: clamp(30px, 3.25vw, 58px) !important;
  top: clamp(300px, 42vh, 420px) !important;
  width: clamp(176px, 14vw, 250px) !important;
  display: grid !important;
  gap: 15px !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateZ(0) !important;
  overflow: visible !important;
  white-space: normal !important;
  font-family: var(--mono) !important;
  text-transform: uppercase !important;
  letter-spacing: .13em !important;
  color: rgba(243,240,232,.48) !important;
  mix-blend-mode: normal !important;
}
body.personal-v146 .personal-v146-rail::before,
body.personal-v146 .personal-v145-rail::before,
body.personal-v146 .personal-v144-rail::before,
body.personal-v146 .personal-v123-rail::before {
  content: "" !important;
  display: block !important;
  width: 28px !important;
  height: 1px !important;
  margin-bottom: 2px !important;
  background: rgba(243,240,232,.26) !important;
}
body.personal-v146 .personal-v146-rail a,
body.personal-v146 .personal-v145-rail a,
body.personal-v146 .personal-v144-rail a,
body.personal-v146 .personal-v123-rail a {
  display: inline-flex !important;
  align-items: baseline !important;
  width: fit-content !important;
  gap: 10px !important;
  color: rgba(243,240,232,.46) !important;
  font: 600 clamp(9px, .64vw, 11px)/1.45 var(--mono) !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  transition: color .22s ease !important;
}
body.personal-v146 .personal-v146-rail a span::after,
body.personal-v146 .personal-v145-rail a span::after,
body.personal-v146 .personal-v144-rail a span::after,
body.personal-v146 .personal-v123-rail a span::after {
  content: "" !important;
  display: inline-block !important;
  width: 24px !important;
  height: 1px !important;
  margin-left: 10px !important;
  vertical-align: middle !important;
  background: rgba(243,240,232,.18) !important;
  transform: scaleX(.38) !important;
  transform-origin: left center !important;
  transition: transform .25s ease, background .25s ease !important;
}
body.personal-v146 .personal-v146-rail a:hover,
body.personal-v146 .personal-v146-rail a.is-active,
body.personal-v146 .personal-v145-rail a:hover,
body.personal-v146 .personal-v145-rail a.is-active,
body.personal-v146 .personal-v144-rail a:hover,
body.personal-v146 .personal-v144-rail a.is-active,
body.personal-v146 .personal-v123-rail a:hover,
body.personal-v146 .personal-v123-rail a.is-active {
  color: rgba(243,240,232,.94) !important;
}
body.personal-v146 .personal-v146-rail a:hover span::after,
body.personal-v146 .personal-v146-rail a.is-active span::after,
body.personal-v146 .personal-v145-rail a:hover span::after,
body.personal-v146 .personal-v145-rail a.is-active span::after,
body.personal-v146 .personal-v144-rail a:hover span::after,
body.personal-v146 .personal-v144-rail a.is-active span::after,
body.personal-v146 .personal-v123-rail a:hover span::after,
body.personal-v146 .personal-v123-rail a.is-active span::after {
  transform: scaleX(1) !important;
  background: rgba(243,240,232,.52) !important;
}
body.personal-v146 .personal-v146-rail a em,
body.personal-v146 .personal-v145-rail a em,
body.personal-v146 .personal-v144-rail a em,
body.personal-v146 .personal-v123-rail a em {
  color: rgba(243,240,232,.35) !important;
  font-style: normal !important;
  font-size: .82em !important;
  letter-spacing: .12em !important;
}
body.personal-v146 .personal-v123-art-section {
  margin-top: clamp(34px, 5vh, 64px) !important;
  padding: clamp(30px, 4.2vh, 52px) clamp(44px, 4.6vw, 88px) clamp(78px, 9.2vh, 138px) clamp(230px, 15vw, 315px) !important;
}
body.personal-v146 .personal-v123-art-section > h2 {
  font-size: clamp(11px, .78vw, 14px) !important;
  letter-spacing: .24em !important;
  margin: 0 0 clamp(18px, 2.4vh, 30px) 0 !important;
}
body.personal-v146 .pa144-gallery-layout {
  display: grid !important;
  grid-template-columns: minmax(270px, 34vw) minmax(560px, 1fr) !important;
  gap: clamp(34px, 4.4vw, 82px) !important;
  width: 100% !important;
  max-width: min(1540px, calc(100vw - 285px)) !important;
  margin: 0 0 0 auto !important;
  align-items: start !important;
}
body.personal-v146 .pa144-gallery-layout > .pa93-gallery {
  width: min(100%, 520px) !important;
  max-width: 520px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  columns: 2 128px !important;
  column-gap: clamp(8px, .75vw, 13px) !important;
}
body.personal-v146 .pa144-gallery-layout .gallery-item {
  margin-bottom: clamp(8px, .75vw, 13px) !important;
  break-inside: avoid !important;
}
body.personal-v146 .pa144-gallery-layout .gallery-item button {
  display: block !important;
  width: 100% !important;
}
body.personal-v146 .pa144-gallery-layout .gallery-item img {
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
}
body.personal-v146 .pa144-gallery-preview {
  position: sticky !important;
  top: calc(var(--header-h) + 34px) !important;
  min-height: 62vh !important;
  display: grid !important;
  align-content: start !important;
  justify-items: center !important;
}
body.personal-v146 .pa144-gallery-preview figure {
  width: 100% !important;
  max-width: min(100%, 1080px) !important;
  margin: 0 auto !important;
}
body.personal-v146 .pa144-gallery-preview img {
  width: 100% !important;
  max-height: min(78vh, 920px) !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: transparent !important;
}
body.personal-v146 .pa144-gallery-preview figcaption {
  width: 100% !important;
  max-width: min(100%, 1080px) !important;
  margin: clamp(14px, 1.5vh, 22px) auto 0 !important;
  grid-template-columns: minmax(72px, .16fr) minmax(130px, .28fr) minmax(250px, 1fr) !important;
}
@media (max-width: 1180px) {
  body.personal-v146 .personal-v146-rail,
  body.personal-v146 .personal-v145-rail,
  body.personal-v146 .personal-v144-rail,
  body.personal-v146 .personal-v123-rail {
    position: sticky !important;
    top: var(--header-h) !important;
    left: auto !important;
    width: auto !important;
    display: flex !important;
    gap: 20px !important;
    padding: 14px 18px !important;
    background: rgba(0,0,0,.88) !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
  }
  body.personal-v146 .personal-v123-art-section {
    padding-left: clamp(22px, 4vw, 48px) !important;
    padding-right: clamp(22px, 4vw, 48px) !important;
  }
  body.personal-v146 .pa144-gallery-layout {
    max-width: none !important;
    grid-template-columns: 1fr !important;
  }
  body.personal-v146 .pa144-gallery-preview {
    position: relative !important;
    top: auto !important;
  }
}


/* v147 — stable grid repair for Professional Works + Personal Art. */

/* HOMEPAGE: keep lower tile labels/logos locked in place, no sideways hover shift. */
body.home-v147.home-page .home-routes-v143 .home-route-card,
body.home-v147.home-page .home-routes-v143 .home-route-card:hover,
body.home-v147.home-page .home-routes-v143 .home-route-card *:not(.home-route-cycle-img),
body.home-v147.home-page .home-routes-v143 .home-route-card:hover *:not(.home-route-cycle-img) {
  transform: none !important;
}
body.home-v147.home-page .home-routes-v143 .home-route-title,
body.home-v147.home-page .home-routes-v143 .home-route-card:hover .home-route-title,
body.home-v147.home-page .home-routes-v143 .home-route-logo-title,
body.home-v147.home-page .home-routes-v143 .home-route-card:hover .home-route-logo-title {
  transform: none !important;
  transition: none !important;
}
body.home-v147.home-page .home-routes-v143 .home-route-logo-title,
body.home-v147.home-page .home-routes-v143 .home-route-card:hover .home-route-logo-title {
  left: clamp(34px, 2.4vw, 52px) !important;
  bottom: clamp(30px, 2.2vw, 48px) !important;
  right: auto !important;
  top: auto !important;
  overflow: visible !important;
  max-height: none !important;
  max-width: 230px !important;
}
body.home-v147.home-page .home-routes-v143 .home-route-logo-sancticide,
body.home-v147.home-page .home-routes-v143 .home-route-card:hover .home-route-logo-sancticide {
  width: clamp(110px, 8vw, 152px) !important;
  max-width: clamp(110px, 8vw, 152px) !important;
  max-height: 42px !important;
}
body.home-v147.home-page .home-routes-v143 .home-route-logo-slavicpunk,
body.home-v147.home-page .home-routes-v143 .home-route-card:hover .home-route-logo-slavicpunk {
  width: clamp(92px, 6.5vw, 132px) !important;
  max-width: clamp(92px, 6.5vw, 132px) !important;
  max-height: 62px !important;
  object-fit: contain !important;
  object-position: left bottom !important;
}
body.home-v147.home-page .home-routes-v143 .home-route-third .home-route-title,
body.home-v147.home-page .home-routes-v143 .home-route-third:hover .home-route-title {
  left: clamp(34px, 2.4vw, 52px) !important;
  bottom: clamp(28px, 2.2vw, 46px) !important;
  right: auto !important;
  top: auto !important;
  text-align: left !important;
}

/* WORKS: tighter single grid, no giant empty gap; facts become part of the same header block. */
body.works-v147 .works-v92-intro,
body.works-v147 .works-v92-content {
  width: min(1160px, calc(100vw - 300px)) !important;
  max-width: 1160px !important;
}
body.works-v147 .works-v92-intro {
  padding-top: calc(var(--header-h) + clamp(42px, 6vh, 76px)) !important;
  padding-bottom: clamp(28px, 4.2vh, 48px) !important;
}
body.works-v147 .works-v92-content {
  padding-top: 0 !important;
}
body.works-v147 .works-v92-case {
  padding-top: clamp(34px, 4.8vh, 58px) !important;
  padding-bottom: clamp(92px, 12vh, 150px) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 320px) !important;
  column-gap: clamp(58px, 7vw, 118px) !important;
  align-items: start !important;
}
body.works-v147 .works-v92-case-head {
  display: contents !important;
}
body.works-v147 .works-v92-titleblock {
  grid-column: 1 !important;
  align-self: start !important;
}
body.works-v147 .works-v92-facts {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  align-self: start !important;
  margin-top: clamp(64px, 7.2vh, 98px) !important;
  padding-top: 0 !important;
  transform: none !important;
  width: 100% !important;
}
body.works-v147 .works-v92-desc {
  grid-column: 1 !important;
  width: min(650px, 100%) !important;
  margin-top: clamp(20px, 2.4vh, 34px) !important;
  margin-bottom: clamp(34px, 4.2vh, 54px) !important;
}
body.works-v147 .works-v92-hero-frame,
body.works-v147 .works-v92-grid,
body.works-v147 .works-v92-mosaic {
  grid-column: 1 / -1 !important;
}
body.works-v147.works-page .works-v92-titleblock .works-logo-title {
  line-height: 0 !important;
  overflow: visible !important;
}
body.works-v147.works-page .works-v92-titleblock .works-logo-title-sancticide img {
  width: clamp(118px, 9.4vw, 166px) !important;
  max-width: clamp(118px, 9.4vw, 166px) !important;
  height: auto !important;
}
body.works-v147.works-page .works-v92-titleblock .works-logo-title-slavicpunk img {
  width: clamp(88px, 7vw, 126px) !important;
  max-width: clamp(88px, 7vw, 126px) !important;
  max-height: 72px !important;
  object-fit: contain !important;
  object-position: left center !important;
  height: auto !important;
}
body.works-v147 .works-fact-studio {
  grid-template-columns: 88px 1fr !important;
  align-items: center !important;
  margin-top: 0 !important;
  padding-top: 14px !important;
}
body.works-v147 .works-fact-studio img {
  width: clamp(58px, 4.6vw, 76px) !important;
  height: auto !important;
  max-height: 38px !important;
  object-fit: contain !important;
  object-position: left center !important;
  opacity: .78 !important;
  filter: none !important;
}
body.works-v147 .works-fact-studio span {
  font-size: 8px !important;
  letter-spacing: .18em !important;
  color: rgba(243,240,232,.42) !important;
}

/* PERSONAL ART: fixed rail + real 3-zone composition: rail / thumbs / preview. */
body.personal-v147 .personal-v113-top-art,
body.personal-v147 .personal-v93-main::before,
body.personal-v147 .personal-v113-intro {
  display: none !important;
}
body.personal-v147 .pa93-opener {
  padding-top: calc(var(--header-h) + clamp(4px, .8vh, 12px)) !important;
  padding-bottom: clamp(28px, 4vh, 54px) !important;
  margin-top: 0 !important;
}
body.personal-v147 .pa94-carousel {
  margin-top: 0 !important;
}
body.personal-v147 .personal-v147-rail,
body.personal-v147 .personal-v146-rail,
body.personal-v147 .personal-v145-rail,
body.personal-v147 .personal-v144-rail,
body.personal-v147 .personal-v123-rail {
  position: fixed !important;
  z-index: 999999 !important;
  left: clamp(34px, 3.1vw, 56px) !important;
  top: clamp(286px, 38vh, 380px) !important;
  width: clamp(190px, 13.5vw, 248px) !important;
  display: grid !important;
  gap: 13px !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  background: transparent !important;
  transform: none !important;
}
body.personal-v147 .personal-v123-art-section {
  margin-top: clamp(18px, 3vh, 40px) !important;
  padding-top: clamp(18px, 2.6vh, 34px) !important;
  padding-bottom: clamp(82px, 11vh, 150px) !important;
  padding-left: clamp(295px, 17vw, 352px) !important;
  padding-right: clamp(48px, 4.6vw, 92px) !important;
  min-height: 92vh !important;
}
body.personal-v147 .personal-v123-art-section > h2 {
  margin: 0 0 clamp(20px, 2.4vh, 30px) 0 !important;
  font-size: clamp(10px, .68vw, 12px) !important;
  line-height: 1.2 !important;
  letter-spacing: .24em !important;
  color: rgba(243,240,232,.92) !important;
}
body.personal-v147 .pa144-gallery-layout {
  display: grid !important;
  grid-template-columns: clamp(360px, 28vw, 520px) minmax(560px, 760px) !important;
  gap: clamp(58px, 5.6vw, 108px) !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  justify-content: start !important;
  align-items: start !important;
}
body.personal-v147 .pa144-gallery-layout > .pa93-gallery {
  width: 100% !important;
  max-width: none !important;
  columns: 2 !important;
  column-gap: clamp(10px, .85vw, 16px) !important;
  margin: 0 !important;
}
body.personal-v147 .pa144-gallery-layout .gallery-item {
  margin: 0 0 clamp(10px, .85vw, 16px) !important;
  break-inside: avoid !important;
  overflow: hidden !important;
}
body.personal-v147 .pa144-gallery-layout .gallery-item button {
  display: block !important;
  width: 100% !important;
}
body.personal-v147 .pa144-gallery-layout .gallery-item img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
}
body.personal-v147 .pa144-gallery-preview {
  position: sticky !important;
  top: calc(var(--header-h) + 34px) !important;
  min-height: auto !important;
  width: 100% !important;
  display: block !important;
  justify-self: start !important;
  align-self: start !important;
}
body.personal-v147 .pa144-gallery-preview figure {
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 !important;
}
body.personal-v147 .pa144-gallery-preview img {
  display: block !important;
  width: 100% !important;
  height: min(68vh, 760px) !important;
  max-height: 760px !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: transparent !important;
}
body.personal-v147 .pa144-gallery-preview figcaption {
  width: 100% !important;
  margin-top: clamp(14px, 1.5vh, 22px) !important;
  display: grid !important;
  grid-template-columns: minmax(60px, .16fr) minmax(140px, .32fr) minmax(240px, 1fr) !important;
  gap: clamp(18px, 2vw, 34px) !important;
  align-items: start !important;
}
body.personal-v147 .pa144-preview-meta,
body.personal-v147 .pa144-gallery-preview h3,
body.personal-v147 .pa144-preview-desc {
  margin-top: 0 !important;
}
@media (max-width: 1280px) {
  body.works-v147 .works-v92-intro,
  body.works-v147 .works-v92-content {
    width: min(1080px, calc(100vw - 90px)) !important;
  }
  body.personal-v147 .personal-v147-rail,
  body.personal-v147 .personal-v146-rail,
  body.personal-v147 .personal-v145-rail,
  body.personal-v147 .personal-v144-rail,
  body.personal-v147 .personal-v123-rail {
    position: sticky !important;
    top: var(--header-h) !important;
    left: auto !important;
    width: auto !important;
    display: flex !important;
    gap: 20px !important;
    padding: 14px 18px !important;
    background: rgba(0,0,0,.9) !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
  }
  body.personal-v147 .personal-v123-art-section {
    padding-left: clamp(28px, 4.2vw, 58px) !important;
    padding-right: clamp(28px, 4.2vw, 58px) !important;
  }
  body.personal-v147 .pa144-gallery-layout {
    grid-template-columns: minmax(320px, 430px) minmax(420px, 1fr) !important;
    gap: clamp(34px, 4vw, 62px) !important;
  }
}
@media (max-width: 860px) {
  body.works-v147 .works-v92-case {
    display: block !important;
  }
  body.works-v147 .works-v92-facts {
    margin-top: 24px !important;
  }
  body.personal-v147 .pa144-gallery-layout {
    grid-template-columns: 1fr !important;
  }
  body.personal-v147 .pa144-gallery-preview {
    position: relative !important;
    top: auto !important;
  }
  body.personal-v147 .pa144-gallery-preview img {
    height: auto !important;
    max-height: none !important;
  }
}


/* v148 — repair after v147: cleaner Professional Works header/logos and Personal Art as archive grid below carousel. */

/* WORKS HEADER: keep the main title on one line and remove the intro copy that forced the split. */
body.works-v148 .works-v92-intro {
  width: min(1180px, calc(100vw - 300px)) !important;
  max-width: 1180px !important;
  grid-template-columns: 1fr !important;
  align-items: end !important;
  padding-top: calc(var(--header-h) + clamp(54px, 8vh, 96px)) !important;
  padding-bottom: clamp(34px, 5vh, 62px) !important;
}
body.works-v148 .works-v92-intro-copy {
  display: none !important;
}
body.works-v148 .works-v92-intro-left {
  max-width: none !important;
  min-width: 0 !important;
}
body.works-v148 .works-v92-intro h1 {
  white-space: nowrap !important;
  width: max-content !important;
  max-width: none !important;
  font-size: clamp(38px, 4.4vw, 76px) !important;
  line-height: .95 !important;
  letter-spacing: .24em !important;
}

/* WORKS CASE: increase project logos, reduce RSG logo heavily, keep facts tucked into the project header. */
body.works-v148 .works-v92-case {
  padding-top: clamp(26px, 4vh, 48px) !important;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 300px) !important;
  column-gap: clamp(54px, 6vw, 96px) !important;
}
body.works-v148 .works-v92-facts {
  margin-top: clamp(52px, 6.6vh, 86px) !important;
}
body.works-v148.works-page .works-v92-titleblock .works-logo-title-sancticide img {
  width: clamp(178px, 13.4vw, 250px) !important;
  max-width: clamp(178px, 13.4vw, 250px) !important;
  max-height: none !important;
}
body.works-v148.works-page .works-v92-titleblock .works-logo-title-slavicpunk img {
  width: clamp(152px, 12vw, 224px) !important;
  max-width: clamp(152px, 12vw, 224px) !important;
  max-height: 112px !important;
  object-fit: contain !important;
  object-position: left center !important;
}
body.works-v148 .works-fact-studio {
  grid-template-columns: 34px 1fr !important;
  column-gap: 10px !important;
  align-items: center !important;
  margin-top: 0 !important;
  padding-top: 12px !important;
}
body.works-v148 .works-fact-studio img {
  width: 28px !important;
  max-width: 28px !important;
  max-height: 18px !important;
  object-fit: contain !important;
  object-position: left center !important;
  opacity: .66 !important;
}
body.works-v148 .works-fact-studio span {
  font-size: 7px !important;
  letter-spacing: .16em !important;
  color: rgba(243,240,232,.34) !important;
}

/* PERSONAL ART: carousel is the feature; below it the sections are archive grids. No right-side preview. */
body.personal-v148 .pa93-opener {
  padding-top: calc(var(--header-h) + clamp(0px, .4vh, 6px)) !important;
  padding-bottom: clamp(34px, 5vh, 70px) !important;
  margin-top: 0 !important;
}
body.personal-v148 .personal-v123-art-section {
  margin-top: clamp(16px, 2.8vh, 36px) !important;
  padding-top: clamp(18px, 2.8vh, 38px) !important;
  padding-bottom: clamp(76px, 11vh, 140px) !important;
  padding-left: clamp(248px, 15.2vw, 310px) !important;
  padding-right: clamp(44px, 5vw, 94px) !important;
  min-height: auto !important;
}
body.personal-v148 .personal-v123-art-section > h2 {
  margin: 0 0 clamp(18px, 2.4vh, 30px) 0 !important;
  font-size: clamp(10px, .66vw, 12px) !important;
  line-height: 1.1 !important;
  letter-spacing: .23em !important;
}
body.personal-v148 .pa144-gallery-preview {
  display: none !important;
}
body.personal-v148 .pa144-gallery-layout {
  display: block !important;
  width: 100% !important;
  max-width: min(1180px, calc(100vw - 360px)) !important;
  margin: 0 !important;
}
body.personal-v148 .pa144-gallery-layout > .pa93-gallery {
  display: block !important;
  width: 100% !important;
  max-width: 1180px !important;
  columns: 4 170px !important;
  column-gap: clamp(10px, .78vw, 15px) !important;
  margin: 0 !important;
}
body.personal-v148 .pa144-gallery-layout .gallery-item {
  display: block !important;
  margin: 0 0 clamp(10px, .78vw, 15px) !important;
  break-inside: avoid !important;
  overflow: hidden !important;
  background: transparent !important;
}
body.personal-v148 .pa144-gallery-layout .gallery-item button {
  display: block !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  cursor: pointer !important;
}
body.personal-v148 .pa144-gallery-layout .gallery-item img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  filter: brightness(.86) contrast(1.04) saturate(.92) !important;
  transition: filter .18s ease, opacity .18s ease !important;
}
body.personal-v148 .pa144-gallery-layout .gallery-item:hover img {
  filter: brightness(.98) contrast(1.04) saturate(.98) !important;
}
body.personal-v148 .pa144-gallery-layout .gallery-item figcaption {
  position: static !important;
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  gap: 10px !important;
  padding-top: 8px !important;
  font-family: var(--mono) !important;
  text-transform: uppercase !important;
  letter-spacing: .15em !important;
  font-size: 8px !important;
  color: rgba(243,240,232,.46) !important;
}
body.personal-v148 .pa144-gallery-layout .gallery-item figcaption span,
body.personal-v148 .pa144-gallery-layout .gallery-item figcaption em {
  font-style: normal !important;
  color: rgba(243,240,232,.42) !important;
}
body.personal-v148 .pa144-gallery-layout .gallery-item::after {
  display: none !important;
}
@media (max-width: 1280px) {
  body.personal-v148 .personal-v123-art-section {
    padding-left: clamp(38px, 4.5vw, 68px) !important;
    padding-right: clamp(38px, 4.5vw, 68px) !important;
  }
  body.personal-v148 .pa144-gallery-layout {
    max-width: none !important;
  }
  body.personal-v148 .pa144-gallery-layout > .pa93-gallery {
    columns: 3 180px !important;
  }
}
@media (max-width: 760px) {
  body.works-v148 .works-v92-intro h1 { white-space: normal !important; width: auto !important; }
  body.personal-v148 .pa144-gallery-layout > .pa93-gallery { columns: 2 150px !important; }
}

/* v151 — restore original Personal Art carousel and replace lower archive with full-width brick gallery. */
body.personal-v151 .personal-v113-top-art,
body.personal-v151 .personal-v93-main::before,
body.personal-v151 .personal-v113-intro,
body.personal-v151 .pa100-under-carousel,
body.personal-v151 .personal-v123-rail,
body.personal-v151 .personal-v144-rail,
body.personal-v151 .personal-v145-rail,
body.personal-v151 .personal-v146-rail,
body.personal-v151 .personal-v147-rail,
body.personal-v151 .personal-tabs,
body.personal-v151 .personal-thumb-strip {
  display: none !important;
}

body.personal-v151 .personal-v151-main,
body.personal-v151 .personal-v93-main {
  padding-top: 0 !important;
  background: #000 !important;
  overflow: visible !important;
}

body.personal-v151 .pa93-opener {
  padding-top: calc(var(--header-h) + clamp(0px, .4vh, 6px)) !important;
  padding-bottom: clamp(24px, 4vh, 54px) !important;
  margin-top: 0 !important;
  min-height: auto !important;
}

body.personal-v151 .pa94-carousel {
  margin-top: 0 !important;
}

body.personal-v151 .pa151-brick-section {
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding: 0 0 clamp(70px, 10vh, 140px) !important;
  background: #000 !important;
  border-top: 1px solid rgba(243,240,232,.045) !important;
}

body.personal-v151 .pa151-brick-gallery {
  width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.personal-v151 .pa151-brick-row {
  display: flex !important;
  gap: clamp(4px, .34vw, 7px) !important;
  width: 100% !important;
  height: clamp(145px, 15.2vw, 285px) !important;
  margin: 0 0 clamp(4px, .34vw, 7px) !important;
}

body.personal-v151 .pa151-row-2 { height: clamp(138px, 13.6vw, 255px) !important; }
body.personal-v151 .pa151-row-3 { height: clamp(150px, 14.6vw, 276px) !important; }
body.personal-v151 .pa151-row-4 { height: clamp(132px, 12.8vw, 245px) !important; margin-bottom: 0 !important; }

body.personal-v151 .pa151-tile {
  position: relative !important;
  display: block !important;
  height: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: #050505 !important;
  min-width: 0 !important;
  break-inside: auto !important;
}

body.personal-v151 .pa151-tile.is-wide { flex: 2.25 1 0 !important; }
body.personal-v151 .pa151-tile.is-medium { flex: 1.25 1 0 !important; }
body.personal-v151 .pa151-tile.is-portrait { flex: .86 1 0 !important; }
body.personal-v151 .pa151-tile.is-narrow { flex: .68 1 0 !important; }

body.personal-v151 .pa151-tile button {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  cursor: pointer !important;
}

body.personal-v151 .pa151-tile img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  filter: brightness(.9) contrast(1.04) saturate(.94) !important;
  transform: scale(1.0001) !important;
  transition: filter .18s ease, transform .24s ease !important;
}

body.personal-v151 .pa151-tile:hover img {
  filter: brightness(1) contrast(1.05) saturate(.98) !important;
  transform: scale(1.018) !important;
}

body.personal-v151 .pa151-tile figcaption {
  position: absolute !important;
  left: clamp(10px, 1vw, 18px) !important;
  right: clamp(10px, 1vw, 18px) !important;
  bottom: clamp(9px, .9vw, 15px) !important;
  z-index: 2 !important;
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 !important;
  font-family: var(--mono) !important;
  font-size: clamp(7px, .48vw, 9px) !important;
  line-height: 1 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,.78) !important;
  opacity: 0 !important;
  transform: translateY(4px) !important;
  transition: opacity .18s ease, transform .18s ease !important;
  pointer-events: none !important;
}

body.personal-v151 .pa151-tile:hover figcaption {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

body.personal-v151 .pa151-tile figcaption span,
body.personal-v151 .pa151-tile figcaption em {
  font-style: normal !important;
  color: inherit !important;
}

body.personal-v151 .pa151-tile::after {
  content: '' !important;
  position: absolute !important;
  inset: auto 0 0 0 !important;
  height: 48% !important;
  background: linear-gradient(to top, rgba(0,0,0,.62), rgba(0,0,0,0)) !important;
  opacity: .15 !important;
  pointer-events: none !important;
  transition: opacity .18s ease !important;
}

body.personal-v151 .pa151-tile:hover::after { opacity: .82 !important; }

@media (max-width: 860px) {
  body.personal-v151 .pa151-brick-row {
    height: clamp(130px, 24vw, 220px) !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
  }
  body.personal-v151 .pa151-brick-row::-webkit-scrollbar { display: none !important; }
  body.personal-v151 .pa151-tile { flex-basis: 44vw !important; flex-grow: 0 !important; }
  body.personal-v151 .pa151-tile.is-wide { flex-basis: 70vw !important; }
  body.personal-v151 .pa151-tile.is-portrait,
  body.personal-v151 .pa151-tile.is-narrow { flex-basis: 34vw !important; }
}

/* v152 — Personal Art archive filter buttons */
body.personal-v151 .pa151-filter-bar {
  width: 100vw !important;
  margin: 0 !important;
  padding: clamp(22px, 3vw, 44px) clamp(18px, 3.6vw, 68px) clamp(18px, 2.4vw, 34px) !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: clamp(16px, 2.2vw, 42px) !important;
  background: #000 !important;
  border-bottom: 1px solid rgba(243,240,232,.05) !important;
}

body.personal-v151 .pa151-filter {
  appearance: none !important;
  border: 0 !important;
  background: transparent !important;
  color: rgba(243,240,232,.42) !important;
  font-family: var(--mono) !important;
  font-size: clamp(7px, .52vw, 10px) !important;
  line-height: 1 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
  padding: 0 !important;
  cursor: pointer !important;
  transition: color .16s ease, opacity .16s ease !important;
}

body.personal-v151 .pa151-filter:hover,
body.personal-v151 .pa151-filter.is-active {
  color: rgba(255,255,255,.92) !important;
}

body.personal-v151 .pa151-filter.is-active::before {
  content: '' !important;
  display: inline-block !important;
  width: clamp(18px, 2.4vw, 46px) !important;
  height: 1px !important;
  margin: 0 clamp(8px, .8vw, 14px) .22em 0 !important;
  background: rgba(255,255,255,.56) !important;
  vertical-align: middle !important;
}

body.personal-v151 .pa151-tile[hidden],
body.personal-v151 .pa151-brick-row.is-empty-filter-row {
  display: none !important;
}

body.personal-v151 .pa151-tile {
  transition: opacity .14s ease, filter .14s ease !important;
}

@media (max-width: 860px) {
  body.personal-v151 .pa151-filter-bar {
    justify-content: flex-start !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
  body.personal-v151 .pa151-filter-bar::-webkit-scrollbar { display: none !important; }
  body.personal-v151 .pa151-filter { white-space: nowrap !important; }
}


/* v153 — final cleanup requested: no homepage statement strip, project tile information locked, Works logo/meta repair. */

/* HOMEPAGE: remove the black statement strip and pull tiles directly under Twój K. */
body.home-v153.home-page .home-statement,
body.home-v153.home-page .home-route-section-break {
  display: none !important;
}
body.home-v153.home-page .home-hero {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
body.home-v153.home-page .home-routes,
body.home-v153.home-page .home-routes-v132,
body.home-v153.home-page .home-routes-v143 {
  margin-top: 0 !important;
  padding-top: 0 !important;
  background: #000 !important;
  border-top: 0 !important;
}
body.home-v153.home-page .home-routes-inner {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.home-v153.home-page .home-route-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 0 !important;
  width: 100% !important;
}
body.home-v153.home-page .home-route-half { grid-column: span 3 !important; }
body.home-v153.home-page .home-route-third { grid-column: span 2 !important; }
body.home-v153.home-page .home-route-card,
body.home-v153.home-page .home-route-card:hover,
body.home-v153.home-page .home-route-card *:not(.home-route-cycle-img),
body.home-v153.home-page .home-route-card:hover *:not(.home-route-cycle-img) {
  transform: none !important;
}
body.home-v153.home-page .home-route-card {
  min-height: clamp(310px, 37vw, 620px) !important;
  overflow: hidden !important;
}
body.home-v153.home-page .home-route-third {
  min-height: clamp(250px, 24vw, 420px) !important;
}
body.home-v153.home-page .home-route-cycle-img,
body.home-v153.home-page .home-route-card:hover .home-route-cycle-img {
  filter: brightness(.9) contrast(1.04) saturate(.94) !important;
  transform: none !important;
}
body.home-v153.home-page .home-route-card::before,
body.home-v153.home-page .home-route-card::after {
  pointer-events: none !important;
}
body.home-v153.home-page .home-route-scrim {
  position: absolute !important;
  inset: 0 !important;
  z-index: 10 !important;
  background:
    linear-gradient(to left, rgba(0,0,0,.82) 0%, rgba(0,0,0,.34) 38%, rgba(0,0,0,.08) 70%),
    linear-gradient(to top, rgba(0,0,0,.72) 0%, rgba(0,0,0,.16) 50%, rgba(0,0,0,.10) 100%) !important;
  opacity: 1 !important;
}
body.home-v153.home-page .home-route-logo-title,
body.home-v153.home-page .home-route-card:hover .home-route-logo-title,
body.home-v153.home-page .home-route-title,
body.home-v153.home-page .home-route-card:hover .home-route-title {
  position: absolute !important;
  z-index: 25 !important;
  left: auto !important;
  right: clamp(26px, 2.4vw, 54px) !important;
  bottom: clamp(92px, 6.8vw, 142px) !important;
  top: auto !important;
  margin: 0 !important;
  width: auto !important;
  max-width: min(42%, 360px) !important;
  text-align: right !important;
  transform: none !important;
  transition: none !important;
  line-height: 0 !important;
  overflow: visible !important;
}
body.home-v153.home-page .home-route-third .home-route-title,
body.home-v153.home-page .home-route-third:hover .home-route-title {
  bottom: clamp(88px, 6vw, 120px) !important;
  font-size: clamp(13px, 1.05vw, 20px) !important;
  line-height: 1 !important;
  letter-spacing: .24em !important;
}
body.home-v153.home-page .home-route-logo,
body.home-v153.home-page .home-route-card:hover .home-route-logo {
  display: block !important;
  margin-left: auto !important;
  margin-right: 0 !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: right center !important;
  transform: none !important;
  transition: none !important;
  filter: drop-shadow(0 12px 30px rgba(0,0,0,.86)) !important;
  opacity: .95 !important;
}
body.home-v153.home-page .home-route-logo-sancticide,
body.home-v153.home-page .home-route-card:hover .home-route-logo-sancticide {
  width: clamp(132px, 11.5vw, 210px) !important;
  max-width: clamp(132px, 11.5vw, 210px) !important;
  max-height: 76px !important;
}
body.home-v153.home-page .home-route-logo-slavicpunk,
body.home-v153.home-page .home-route-card:hover .home-route-logo-slavicpunk {
  width: clamp(116px, 10vw, 188px) !important;
  max-width: clamp(116px, 10vw, 188px) !important;
  max-height: 92px !important;
}
body.home-v153.home-page .home-route-desc,
body.home-v153.home-page .home-route-card:hover .home-route-desc {
  position: absolute !important;
  z-index: 25 !important;
  right: clamp(26px, 2.4vw, 54px) !important;
  bottom: clamp(58px, 4.5vw, 88px) !important;
  left: auto !important;
  width: min(360px, 42%) !important;
  margin: 0 !important;
  color: rgba(243,240,232,.68) !important;
  font: 400 clamp(10px, .72vw, 13px)/1.45 var(--sans) !important;
  letter-spacing: .01em !important;
  text-align: right !important;
  transform: none !important;
  transition: none !important;
}
body.home-v153.home-page .home-route-meta,
body.home-v153.home-page .home-route-card:hover .home-route-meta,
body.home-v153.home-page .home-route-card > small.home-route-meta,
body.home-v153.home-page .home-route-card:hover > small.home-route-meta {
  position: absolute !important;
  z-index: 25 !important;
  right: clamp(26px, 2.4vw, 54px) !important;
  bottom: clamp(26px, 2.2vw, 44px) !important;
  left: auto !important;
  display: inline-flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: clamp(10px, .8vw, 16px) !important;
  width: min(400px, 50%) !important;
  margin: 0 !important;
  color: rgba(243,240,232,.56) !important;
  font-family: var(--mono) !important;
  font-size: clamp(7px, .52vw, 10px) !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  text-align: right !important;
  transform: none !important;
  transition: none !important;
  opacity: 1 !important;
}
body.home-v153.home-page .home-route-meta span,
body.home-v153.home-page .home-route-meta em {
  color: inherit !important;
  font-style: normal !important;
}
@media (max-width: 900px) {
  body.home-v153.home-page .home-route-grid { grid-template-columns: 1fr !important; }
  body.home-v153.home-page .home-route-half,
  body.home-v153.home-page .home-route-third { grid-column: auto !important; }
  body.home-v153.home-page .home-route-title,
  body.home-v153.home-page .home-route-logo-title,
  body.home-v153.home-page .home-route-desc,
  body.home-v153.home-page .home-route-meta { right: 22px !important; width: min(360px, 70%) !important; max-width: 70% !important; }
}

/* PROFESSIONAL WORKS: keep header clean, increase game logos, fix Red Square Games block so it never hides behind artwork. */
body.works-v153 .works-v92-intro {
  grid-template-columns: 1fr !important;
  padding-bottom: clamp(28px, 4.2vh, 52px) !important;
}
body.works-v153 .works-v92-intro-copy { display: none !important; }
body.works-v153 .works-v92-intro h1 {
  white-space: nowrap !important;
  width: auto !important;
  max-width: 100% !important;
  display: block !important;
  font-size: clamp(34px, 4vw, 68px) !important;
  line-height: .95 !important;
  letter-spacing: .22em !important;
}
body.works-v153 .works-v92-content {
  padding-top: 0 !important;
}
body.works-v153 .works-v92-case {
  position: relative !important;
  overflow: visible !important;
  padding-top: clamp(30px, 4.6vh, 58px) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 300px) !important;
  column-gap: clamp(54px, 6vw, 96px) !important;
  align-items: start !important;
}
body.works-v153 .works-v92-case-head { display: contents !important; }
body.works-v153 .works-v92-titleblock { grid-column: 1 !important; grid-row: 1 !important; }
body.works-v153 .works-v92-desc { grid-column: 1 !important; grid-row: 2 !important; margin-bottom: clamp(34px, 4.6vh, 62px) !important; }
body.works-v153 .works-v92-facts {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  align-self: end !important;
  margin-top: 0 !important;
  margin-bottom: clamp(34px, 4.6vh, 62px) !important;
  position: relative !important;
  z-index: 6 !important;
  background: linear-gradient(to bottom, rgba(0,0,0,.12), rgba(0,0,0,.02)) !important;
}
body.works-v153 .works-v92-hero-frame,
body.works-v153 .works-v92-grid,
body.works-v153 .works-v92-mosaic {
  grid-column: 1 / -1 !important;
  position: relative !important;
  z-index: 1 !important;
  margin-top: 0 !important;
}
body.works-v153.works-page .works-v92-titleblock .works-logo-title { overflow: visible !important; line-height: 0 !important; }
body.works-v153.works-page .works-v92-titleblock .works-logo-title-sancticide img {
  width: clamp(210px, 16.5vw, 330px) !important;
  max-width: clamp(210px, 16.5vw, 330px) !important;
  height: auto !important;
}
body.works-v153.works-page .works-v92-titleblock .works-logo-title-slavicpunk img {
  width: clamp(170px, 14.4vw, 284px) !important;
  max-width: clamp(170px, 14.4vw, 284px) !important;
  max-height: 138px !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: left center !important;
}
body.works-v153 .works-fact-studio {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  column-gap: 10px !important;
  align-items: center !important;
  margin-top: 0 !important;
  padding-top: 10px !important;
  position: relative !important;
  z-index: 8 !important;
  min-height: 0 !important;
}
body.works-v153 .works-fact-studio img {
  width: clamp(28px, 2.1vw, 40px) !important;
  max-width: clamp(28px, 2.1vw, 40px) !important;
  height: auto !important;
  max-height: 20px !important;
  object-fit: contain !important;
  object-position: left center !important;
  opacity: .62 !important;
  filter: none !important;
  background: transparent !important;
  display: block !important;
}
body.works-v153 .works-fact-studio span {
  font-size: 7px !important;
  line-height: 1 !important;
  letter-spacing: .16em !important;
  color: rgba(243,240,232,.38) !important;
}
@media (max-width: 860px) {
  body.works-v153 .works-v92-case { display: block !important; }
  body.works-v153 .works-v92-facts { margin: 22px 0 28px !important; }
  body.works-v153 .works-v92-intro h1 { white-space: normal !important; }
}

/* v154 — repair pass: keep images natural, rebuild homepage tile info, use original RSG logo without cropping/editing. */
body.home-v154.home-page .home-route-card,
body.home-v154.home-page .home-route-card:hover,
body.home-v154.home-page .home-route-card *:not(.home-route-cycle-img),
body.home-v154.home-page .home-route-card:hover *:not(.home-route-cycle-img) {
  transform: none !important;
  transition-property: opacity, filter !important;
}

body.home-v154.home-page .home-route-card {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background: #000 !important;
}

body.home-v154.home-page .home-route-cycle-img,
body.home-v154.home-page .home-route-card img.home-route-cycle-img,
body.home-v154.home-page .home-route-card:hover img,
body.home-v154.home-page .home-route-card:hover .home-route-cycle-img,
body.home-v154.home-page .home-route-card.is-switching .home-route-cycle-img.is-active {
  filter: none !important;
  opacity: 0 !important;
  transform: none !important;
  transition: opacity .05s steps(1, end), filter .05s steps(1, end) !important;
}

body.home-v154.home-page .home-route-cycle-img.is-active,
body.home-v154.home-page .home-route-card img.home-route-cycle-img.is-active,
body.home-v154.home-page .home-route-card:hover img.home-route-cycle-img.is-active,
body.home-v154.home-page .home-route-card:hover .home-route-cycle-img.is-active {
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

body.home-v154.home-page .home-route-scrim {
  display: none !important;
  opacity: 0 !important;
  background: none !important;
}

/* Keep only the VHS cut during image switches; no hover darkening. */
body.home-v154.home-page .home-route-card::before,
body.home-v154.home-page .home-route-card::after {
  z-index: 12 !important;
  pointer-events: none !important;
}

body.home-v154.home-page .home-route-info-plate {
  position: absolute !important;
  z-index: 20 !important;
  right: clamp(18px, 2.2vw, 44px) !important;
  bottom: clamp(18px, 2.1vw, 40px) !important;
  width: min(360px, 38%) !important;
  min-height: clamp(116px, 10vw, 158px) !important;
  background: rgba(4, 4, 4, .82) !important;
  border-top: 1px solid rgba(244,242,236,.18) !important;
  box-shadow: 0 22px 70px rgba(0,0,0,.55) !important;
  pointer-events: none !important;
}

body.home-v154.home-page .home-route-logo-title,
body.home-v154.home-page .home-route-card:hover .home-route-logo-title,
body.home-v154.home-page .home-route-title,
body.home-v154.home-page .home-route-card:hover .home-route-title {
  position: absolute !important;
  z-index: 25 !important;
  right: clamp(34px, 3vw, 66px) !important;
  bottom: clamp(106px, 8.5vw, 152px) !important;
  left: auto !important;
  top: auto !important;
  margin: 0 !important;
  width: min(300px, 32%) !important;
  max-width: min(300px, 32%) !important;
  text-align: right !important;
  line-height: 1 !important;
  transform: none !important;
  transition: none !important;
  overflow: visible !important;
}

body.home-v154.home-page .home-route-third .home-route-title,
body.home-v154.home-page .home-route-third:hover .home-route-title {
  bottom: clamp(106px, 7.2vw, 132px) !important;
  font-size: clamp(12px, .9vw, 17px) !important;
  line-height: 1.1 !important;
  letter-spacing: .24em !important;
  font-family: var(--mono) !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: rgba(248,246,240,.94) !important;
}

body.home-v154.home-page .home-route-logo,
body.home-v154.home-page .home-route-card:hover .home-route-logo {
  display: block !important;
  margin-left: auto !important;
  margin-right: 0 !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: right center !important;
  transform: none !important;
  transition: none !important;
  filter: none !important;
  opacity: .96 !important;
}

body.home-v154.home-page .home-route-logo-sancticide,
body.home-v154.home-page .home-route-card:hover .home-route-logo-sancticide {
  width: clamp(142px, 10vw, 220px) !important;
  max-width: clamp(142px, 10vw, 220px) !important;
  max-height: none !important;
}

body.home-v154.home-page .home-route-logo-slavicpunk,
body.home-v154.home-page .home-route-card:hover .home-route-logo-slavicpunk {
  width: clamp(120px, 8.8vw, 190px) !important;
  max-width: clamp(120px, 8.8vw, 190px) !important;
  max-height: none !important;
}

body.home-v154.home-page .home-route-desc,
body.home-v154.home-page .home-route-card:hover .home-route-desc {
  position: absolute !important;
  z-index: 25 !important;
  right: clamp(34px, 3vw, 66px) !important;
  bottom: clamp(62px, 5.1vw, 92px) !important;
  left: auto !important;
  width: min(300px, 32%) !important;
  margin: 0 !important;
  color: rgba(243,240,232,.70) !important;
  font: 400 clamp(9px, .66vw, 12px)/1.45 var(--sans) !important;
  letter-spacing: .02em !important;
  text-align: right !important;
  transform: none !important;
  transition: none !important;
}

body.home-v154.home-page .home-route-meta,
body.home-v154.home-page .home-route-card:hover .home-route-meta,
body.home-v154.home-page .home-route-card > small.home-route-meta,
body.home-v154.home-page .home-route-card:hover > small.home-route-meta {
  position: absolute !important;
  z-index: 25 !important;
  right: clamp(34px, 3vw, 66px) !important;
  bottom: clamp(32px, 2.7vw, 50px) !important;
  left: auto !important;
  width: min(300px, 32%) !important;
  display: inline-flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: clamp(9px, .7vw, 14px) !important;
  margin: 0 !important;
  color: rgba(243,240,232,.55) !important;
  font-family: var(--mono) !important;
  font-size: clamp(7px, .48vw, 9px) !important;
  letter-spacing: .18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-align: right !important;
  transform: none !important;
  transition: none !important;
  opacity: 1 !important;
}

body.home-v154.home-page .home-route-meta span,
body.home-v154.home-page .home-route-meta em {
  color: inherit !important;
  font-style: normal !important;
  white-space: nowrap !important;
}

body.home-v154.home-page .home-route-section-break {
  background: #000 !important;
}

@media (max-width: 900px) {
  body.home-v154.home-page .home-route-info-plate {
    right: 18px !important;
    bottom: 18px !important;
    width: min(360px, 74%) !important;
  }
  body.home-v154.home-page .home-route-title,
  body.home-v154.home-page .home-route-logo-title,
  body.home-v154.home-page .home-route-desc,
  body.home-v154.home-page .home-route-meta {
    right: 34px !important;
    width: min(300px, 62%) !important;
    max-width: min(300px, 62%) !important;
  }
}

/* Professional Works v154: official project logos readable, original RSG mark unedited and never cropped. */
body.works-v154.works-page .works-v92-titleblock .works-logo-title,
body.works-v154.works-page .works-v92-titleblock .works-logo-title img {
  overflow: visible !important;
}

body.works-v154.works-page .works-v92-titleblock .works-logo-title-sancticide img {
  width: clamp(250px, 19vw, 410px) !important;
  max-width: clamp(250px, 19vw, 410px) !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: left center !important;
}

body.works-v154.works-page .works-v92-titleblock .works-logo-title-slavicpunk img {
  width: clamp(230px, 17vw, 360px) !important;
  max-width: clamp(230px, 17vw, 360px) !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: left center !important;
}

body.works-v154 .works-v92-case {
  overflow: visible !important;
}

body.works-v154 .works-v92-facts {
  position: relative !important;
  z-index: 30 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.works-v154 .works-fact-studio {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  column-gap: 11px !important;
  align-items: center !important;
  margin-top: 14px !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(244,242,236,.10) !important;
  overflow: visible !important;
  position: relative !important;
  z-index: 35 !important;
}

body.works-v154 .works-fact-studio img {
  display: block !important;
  width: clamp(26px, 1.9vw, 36px) !important;
  max-width: clamp(26px, 1.9vw, 36px) !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  opacity: .72 !important;
  filter: none !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  clip-path: none !important;
}

body.works-v154 .works-fact-studio span {
  font-size: 7px !important;
  line-height: 1 !important;
  letter-spacing: .16em !important;
  color: rgba(243,240,232,.42) !important;
  text-transform: uppercase !important;
}

/* v155 — rebuild homepage route tiles from scratch. Clean fixed grid, no hover dimming/zooming, stable captions. */
body.home-v155.home-page .home-routes,
body.home-v155.home-page .home-routes-v155 {
  margin: 0 !important;
  padding: 0 !important;
  background: #000 !important;
  max-width: none !important;
  width: 100% !important;
  overflow: hidden !important;
}
body.home-v155.home-page .home-routes::before,
body.home-v155.home-page .home-routes::after,
body.home-v155.home-page .home-routes-v155::before,
body.home-v155.home-page .home-routes-v155::after {
  display: none !important;
  content: none !important;
}
body.home-v155.home-page .home-routes-v155 > .home-route-grid,
body.home-v155.home-page .home-route-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: none !important;
}
body.home-v155.home-page .home-route-card {
  position: relative !important;
  display: block !important;
  overflow: hidden !important;
  isolation: isolate !important;
  background: #000 !important;
  border: 0 !important;
  transform: none !important;
  filter: none !important;
  cursor: pointer !important;
}
body.home-v155.home-page .home-route-game {
  grid-column: span 3 !important;
  min-height: clamp(420px, 36vw, 720px) !important;
}
body.home-v155.home-page .home-route-personal {
  grid-column: span 2 !important;
  min-height: clamp(320px, 27vw, 520px) !important;
}
body.home-v155.home-page .home-route-card,
body.home-v155.home-page .home-route-card:hover,
body.home-v155.home-page .home-route-card:focus-visible {
  transform: none !important;
  filter: none !important;
}
body.home-v155.home-page .home-route-card::before,
body.home-v155.home-page .home-route-card::after {
  z-index: 40 !important;
  pointer-events: none !important;
}
body.home-v155.home-page .home-route-cycle-img,
body.home-v155.home-page .home-route-card img.home-route-cycle-img,
body.home-v155.home-page .home-route-card:hover img.home-route-cycle-img,
body.home-v155.home-page .home-route-card.is-switching .home-route-cycle-img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  opacity: 0 !important;
  filter: none !important;
  transform: none !important;
  transition: opacity .08s steps(1, end) !important;
}
body.home-v155.home-page .home-route-cycle-img.is-active,
body.home-v155.home-page .home-route-card img.home-route-cycle-img.is-active,
body.home-v155.home-page .home-route-card:hover img.home-route-cycle-img.is-active,
body.home-v155.home-page .home-route-card.is-switching .home-route-cycle-img.is-active {
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}
body.home-v155.home-page .home-route-sancticide .home-route-cycle-img { object-position: 48% center !important; }
body.home-v155.home-page .home-route-slavicpunk .home-route-cycle-img { object-position: 54% center !important; }
body.home-v155.home-page .home-route-digital .home-route-cycle-img { object-position: center center !important; }
body.home-v155.home-page .home-route-traditional .home-route-cycle-img { object-position: center center !important; }
body.home-v155.home-page .home-route-explorations .home-route-cycle-img { object-position: center center !important; }
body.home-v155.home-page .route-v155-caption,
body.home-v155.home-page .home-route-card:hover .route-v155-caption {
  position: absolute !important;
  z-index: 55 !important;
  left: clamp(24px, 2.4vw, 52px) !important;
  right: auto !important;
  bottom: clamp(22px, 2.2vw, 48px) !important;
  width: min(390px, 48%) !important;
  max-width: min(390px, 48%) !important;
  margin: 0 !important;
  padding: clamp(12px, 1vw, 18px) 0 0 0 !important;
  border-top: 1px solid rgba(247,245,238,.38) !important;
  color: rgba(246,244,238,.92) !important;
  text-align: left !important;
  transform: none !important;
  transition: none !important;
  text-shadow: 0 2px 18px rgba(0,0,0,.94), 0 18px 50px rgba(0,0,0,.86) !important;
}
body.home-v155.home-page .route-v155-caption::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  left: -18px !important;
  right: -18px !important;
  top: -10px !important;
  bottom: -18px !important;
  background: linear-gradient(90deg, rgba(0,0,0,.68), rgba(0,0,0,.30) 64%, rgba(0,0,0,0)) !important;
  pointer-events: none !important;
}
body.home-v155.home-page .route-v155-logo,
body.home-v155.home-page .home-route-card:hover .route-v155-logo {
  position: relative !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: left center !important;
  margin: 0 0 clamp(12px, 1.1vw, 20px) 0 !important;
  padding: 0 !important;
  opacity: .96 !important;
  transform: none !important;
  filter: drop-shadow(0 10px 30px rgba(0,0,0,.82)) !important;
  transition: none !important;
  clip-path: none !important;
}
body.home-v155.home-page .route-v155-logo-sancticide,
body.home-v155.home-page .home-route-card:hover .route-v155-logo-sancticide {
  max-width: clamp(180px, 17vw, 330px) !important;
}
body.home-v155.home-page .route-v155-logo-slavicpunk,
body.home-v155.home-page .home-route-card:hover .route-v155-logo-slavicpunk {
  max-width: clamp(138px, 13.2vw, 250px) !important;
}
body.home-v155.home-page .route-v155-caption strong,
body.home-v155.home-page .home-route-card:hover .route-v155-caption strong {
  display: block !important;
  margin: 0 0 clamp(10px, .9vw, 16px) 0 !important;
  color: rgba(248,246,240,.94) !important;
  font: 700 clamp(10px, .78vw, 14px)/1 var(--mono) !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
  transform: none !important;
  transition: none !important;
}
body.home-v155.home-page .route-v155-caption p,
body.home-v155.home-page .home-route-card:hover .route-v155-caption p {
  display: block !important;
  margin: 0 !important;
  max-width: 34em !important;
  color: rgba(244,242,236,.70) !important;
  font: 400 clamp(10px, .72vw, 13px)/1.5 var(--sans) !important;
  letter-spacing: .01em !important;
  transform: none !important;
  transition: none !important;
}
body.home-v155.home-page .route-v155-caption small,
body.home-v155.home-page .home-route-card:hover .route-v155-caption small {
  display: inline-flex !important;
  align-items: center !important;
  gap: clamp(9px, .7vw, 14px) !important;
  margin-top: clamp(14px, 1.15vw, 22px) !important;
  color: rgba(244,242,236,.55) !important;
  font: 600 clamp(7px, .52vw, 9.5px)/1 var(--mono) !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  transform: none !important;
  transition: none !important;
  opacity: 1 !important;
}
body.home-v155.home-page .route-v155-caption small span,
body.home-v155.home-page .route-v155-caption small em {
  color: inherit !important;
  font-style: normal !important;
  white-space: nowrap !important;
}
body.home-v155.home-page .route-v155-caption-small {
  width: min(320px, 58%) !important;
  max-width: min(320px, 58%) !important;
  bottom: clamp(20px, 1.8vw, 36px) !important;
  left: clamp(20px, 1.8vw, 38px) !important;
}
body.home-v155.home-page .route-v155-caption-small::before {
  background: linear-gradient(90deg, rgba(0,0,0,.62), rgba(0,0,0,.24) 70%, rgba(0,0,0,0)) !important;
}
body.home-v155.home-page .home-route-card:hover .route-v155-caption,
body.home-v155.home-page .home-route-card:hover .route-v155-caption *,
body.home-v155.home-page .home-route-card:hover .route-v155-caption img {
  transform: none !important;
}
@media (max-width: 980px) {
  body.home-v155.home-page .home-route-grid { grid-template-columns: 1fr !important; }
  body.home-v155.home-page .home-route-game,
  body.home-v155.home-page .home-route-personal { grid-column: auto !important; min-height: 390px !important; }
  body.home-v155.home-page .route-v155-caption { width: min(390px, 72%) !important; max-width: min(390px, 72%) !important; }
}

/* v155 — Professional Works: keep original RSG PNG uncropped and keep project logos readable. */
body.works-v155.works-page .works-v92-titleblock .works-logo-title,
body.works-v155.works-page .works-v92-titleblock .works-logo-title img {
  overflow: visible !important;
  clip-path: none !important;
}
body.works-v155.works-page .works-v92-titleblock .works-logo-title-sancticide img {
  width: clamp(300px, 22vw, 470px) !important;
  max-width: clamp(300px, 22vw, 470px) !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
}
body.works-v155.works-page .works-v92-titleblock .works-logo-title-slavicpunk img {
  width: clamp(245px, 18.5vw, 390px) !important;
  max-width: clamp(245px, 18.5vw, 390px) !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
}
body.works-v155 .works-v92-case,
body.works-v155 .works-v92-case-head,
body.works-v155 .works-v92-facts {
  overflow: visible !important;
}
body.works-v155 .works-v92-facts {
  position: relative !important;
  z-index: 60 !important;
}
body.works-v155 .works-fact-studio {
  position: relative !important;
  z-index: 70 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 14px !important;
  padding-top: 14px !important;
  width: auto !important;
  overflow: visible !important;
  border-top: 1px solid rgba(244,242,236,.08) !important;
}
body.works-v155 .works-fact-studio img {
  display: block !important;
  width: clamp(48px, 3.8vw, 72px) !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  clip-path: none !important;
  opacity: .78 !important;
  filter: none !important;
  background: transparent !important;
}
body.works-v155 .works-fact-studio span {
  font: 600 clamp(7px, .5vw, 9px)/1 var(--mono) !important;
  letter-spacing: .16em !important;
  color: rgba(243,240,232,.42) !important;
  text-transform: uppercase !important;
}

/* v156 — final homepage tile polish: no divider line, flat caption backing, subtle logo-only hover. */
body.home-v156.home-page .route-v155-caption,
body.home-v156.home-page .home-route-card:hover .route-v155-caption {
  border-top: 0 !important;
  padding-top: 0 !important;
}

body.home-v156.home-page .route-v155-caption::before,
body.home-v156.home-page .route-v155-caption-small::before {
  background: rgba(0, 0, 0, .48) !important;
}

body.home-v156.home-page .route-v155-logo {
  transform-origin: left center !important;
  transition: transform .28s cubic-bezier(.22, .61, .36, 1), opacity .28s ease, filter .28s ease !important;
}

body.home-v156.home-page .home-route-card:hover .route-v155-logo {
  transform: scale(1.035) !important;
  opacity: 1 !important;
  filter: drop-shadow(0 12px 34px rgba(0,0,0,.86)) !important;
}

/* Preserve the rebuilt tile behavior: no image dimming, no tile zoom, no caption drift. */
body.home-v156.home-page .home-route-card,
body.home-v156.home-page .home-route-card:hover,
body.home-v156.home-page .home-route-card:focus-visible,
body.home-v156.home-page .home-route-card:hover .route-v155-caption,
body.home-v156.home-page .home-route-card:hover .route-v155-caption p,
body.home-v156.home-page .home-route-card:hover .route-v155-caption small,
body.home-v156.home-page .home-route-card:hover .route-v155-caption strong,
body.home-v156.home-page .home-route-card:hover img.home-route-cycle-img {
  transform: none !important;
  filter: none !important;
}

body.home-v156.home-page .home-route-card:hover .route-v155-logo {
  transform: scale(1.035) !important;
  filter: drop-shadow(0 12px 34px rgba(0,0,0,.86)) !important;
}

/* v157 — homepage route tiles: calmer art-direction pass.
   Default state shows only a small project mark/title. On hover a flat black
   information plate slides up from the bottom. Images remain untouched. */
body.home-v157.home-page .home-routes-v155 .home-route-card {
  overflow: hidden !important;
}

body.home-v157.home-page .home-routes-v155 .home-route-card,
body.home-v157.home-page .home-routes-v155 .home-route-card:hover,
body.home-v157.home-page .home-routes-v155 .home-route-card:focus-visible,
body.home-v157.home-page .home-routes-v155 .home-route-card:hover img.home-route-cycle-img,
body.home-v157.home-page .home-routes-v155 .home-route-card.is-switching img.home-route-cycle-img {
  transform: none !important;
  filter: none !important;
}

body.home-v157.home-page .home-routes-v155 .home-route-cycle-img,
body.home-v157.home-page .home-routes-v155 .home-route-cycle-img.is-active,
body.home-v157.home-page .home-routes-v155 .home-route-card:hover .home-route-cycle-img,
body.home-v157.home-page .home-routes-v155 .home-route-card:hover .home-route-cycle-img.is-active {
  filter: none !important;
  transform: none !important;
}

body.home-v157.home-page .home-routes-v155 .home-route-card::before,
body.home-v157.home-page .home-routes-v155 .home-route-card::after {
  display: none !important;
  content: none !important;
}

body.home-v157.home-page .home-routes-v155 .route-v155-caption,
body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption {
  position: absolute !important;
  z-index: 60 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(18px, 1.45vw, 30px) clamp(26px, 2.35vw, 52px) clamp(18px, 1.6vw, 34px) !important;
  color: rgba(246,244,238,.92) !important;
  text-align: left !important;
  border: 0 !important;
  text-shadow: 0 10px 34px rgba(0,0,0,.92) !important;
  background: transparent !important;
  transform: translate3d(0, calc(100% - clamp(64px, 5.8vw, 116px)), 0) !important;
  transition: transform .34s cubic-bezier(.2,.78,.25,1), background .24s ease !important;
}

body.home-v157.home-page .home-routes-v155 .route-v155-caption::before,
body.home-v157.home-page .home-routes-v155 .route-v155-caption-small::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: 0 !important;
  background: rgba(0,0,0,.72) !important;
  opacity: 0 !important;
  transform: translate3d(0, 100%, 0) !important;
  transition: transform .34s cubic-bezier(.2,.78,.25,1), opacity .22s ease !important;
  pointer-events: none !important;
}

body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption,
body.home-v157.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption {
  transform: translate3d(0, 0, 0) !important;
}

body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption::before,
body.home-v157.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption::before {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) !important;
}

body.home-v157.home-page .home-routes-v155 .route-v155-logo,
body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo {
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: left center !important;
  opacity: .94 !important;
  clip-path: none !important;
  filter: drop-shadow(0 10px 32px rgba(0,0,0,.80)) !important;
  transform-origin: left center !important;
  transform: none !important;
  transition: transform .28s cubic-bezier(.22,.61,.36,1), opacity .22s ease, filter .22s ease !important;
}

body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo,
body.home-v157.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-logo {
  transform: scale(1.035) !important;
  opacity: 1 !important;
}

body.home-v157.home-page .home-routes-v155 .route-v155-logo-sancticide,
body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo-sancticide {
  max-width: clamp(130px, 12vw, 240px) !important;
}

body.home-v157.home-page .home-routes-v155 .route-v155-logo-slavicpunk,
body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo-slavicpunk {
  max-width: clamp(104px, 9.5vw, 190px) !important;
}

body.home-v157.home-page .home-routes-v155 .route-v155-caption strong,
body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption strong {
  display: block !important;
  margin: 0 !important;
  color: rgba(248,246,240,.94) !important;
  font: 700 clamp(9px, .68vw, 12px)/1 var(--mono) !important;
  letter-spacing: .24em !important;
  text-transform: uppercase !important;
  transform-origin: left center !important;
  transform: none !important;
  transition: transform .28s cubic-bezier(.22,.61,.36,1), opacity .22s ease !important;
}

body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption strong,
body.home-v157.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption strong {
  transform: scale(1.035) !important;
}

body.home-v157.home-page .home-routes-v155 .route-v155-caption p,
body.home-v157.home-page .home-routes-v155 .route-v155-caption small {
  max-width: 46em !important;
  opacity: 0 !important;
  transform: translate3d(0, 8px, 0) !important;
  transition: opacity .22s ease .08s, transform .28s cubic-bezier(.2,.78,.25,1) .06s !important;
}

body.home-v157.home-page .home-routes-v155 .route-v155-caption p,
body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption p {
  margin: clamp(14px, 1.0vw, 22px) 0 0 0 !important;
  color: rgba(244,242,236,.70) !important;
  font: 400 clamp(10px, .70vw, 13px)/1.5 var(--sans) !important;
  letter-spacing: .01em !important;
}

body.home-v157.home-page .home-routes-v155 .route-v155-caption small,
body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption small {
  display: inline-flex !important;
  align-items: center !important;
  gap: clamp(9px, .7vw, 14px) !important;
  margin-top: clamp(12px, .9vw, 18px) !important;
  color: rgba(244,242,236,.52) !important;
  font: 600 clamp(7px, .50vw, 9px)/1 var(--mono) !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}

body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption p,
body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption small,
body.home-v157.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption p,
body.home-v157.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption small {
  opacity: 1 !important;
  transform: translate3d(0,0,0) !important;
}

body.home-v157.home-page .home-routes-v155 .route-v155-caption-small,
body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption-small {
  padding-top: clamp(18px, 1.35vw, 26px) !important;
  padding-bottom: clamp(18px, 1.35vw, 28px) !important;
}

@media (max-width: 980px) {
  body.home-v157.home-page .home-routes-v155 .route-v155-caption,
  body.home-v157.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption {
    transform: translate3d(0,0,0) !important;
    padding: 20px 22px 22px !important;
  }
  body.home-v157.home-page .home-routes-v155 .route-v155-caption::before {
    opacity: 1 !important;
    transform: none !important;
  }
  body.home-v157.home-page .home-routes-v155 .route-v155-caption p,
  body.home-v157.home-page .home-routes-v155 .route-v155-caption small {
    opacity: 1 !important;
    transform: none !important;
  }
}


/* v158 — homepage tile slide-panel fix.
   Move Slavicpunk mark higher, make the reveal plate solid black, and keep
   year/tech metadata left-aligned without disturbing image brightness. */
body.home-v158.home-page .home-routes-v155 .route-v155-caption::before,
body.home-v158.home-page .home-routes-v155 .route-v155-caption-small::before {
  background: #000 !important;
}

body.home-v158.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption::before,
body.home-v158.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption::before {
  opacity: 1 !important;
}

body.home-v158.home-page .home-routes-v155 .home-route-slavicpunk .route-v155-caption,
body.home-v158.home-page .home-routes-v155 .home-route-slavicpunk:hover .route-v155-caption {
  transform: translate3d(0, calc(100% - clamp(88px, 7.1vw, 132px)), 0) !important;
}

body.home-v158.home-page .home-routes-v155 .home-route-slavicpunk:hover .route-v155-caption,
body.home-v158.home-page .home-routes-v155 .home-route-slavicpunk:focus-visible .route-v155-caption {
  transform: translate3d(0, 0, 0) !important;
}

body.home-v158.home-page .home-routes-v155 .route-v155-caption small,
body.home-v158.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption small {
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  text-align: left !important;
  width: fit-content !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

body.home-v158.home-page .home-routes-v155 .route-v155-caption small span,
body.home-v158.home-page .home-routes-v155 .route-v155-caption small em {
  text-align: left !important;
}

body.home-v158.home-page .home-routes-v155 .home-route-card,
body.home-v158.home-page .home-routes-v155 .home-route-card:hover,
body.home-v158.home-page .home-routes-v155 .home-route-card:focus-visible,
body.home-v158.home-page .home-routes-v155 .home-route-card:hover .home-route-cycle-img,
body.home-v158.home-page .home-routes-v155 .home-route-card:hover .home-route-cycle-img.is-active {
  filter: none !important;
  transform: none !important;
}

/* v159 — homepage tile panel metadata alignment + bottom tile title scale.
   Keep v158 visuals intact; only move year/tech to the right and make the
   lower Personal Art tile titles easier to read. */
body.home-v159.home-page .home-routes-v155 .route-v155-caption small,
body.home-v159.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption small,
body.home-v159.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption small {
  width: 100% !important;
  justify-content: flex-end !important;
  text-align: right !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body.home-v159.home-page .home-routes-v155 .route-v155-caption small span,
body.home-v159.home-page .home-routes-v155 .route-v155-caption small em {
  text-align: right !important;
}

body.home-v159.home-page .home-routes-v155 .route-v155-caption-small strong,
body.home-v159.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption-small strong,
body.home-v159.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption-small strong {
  font-size: clamp(12px, .96vw, 18px) !important;
  line-height: 1 !important;
  letter-spacing: .22em !important;
}


/* v160 — rebuild homepage tile hover panel from scratch.
   Goal: full-width solid black panel, stable logo/title, description left, year/tech right.
   No image dim, no tile/image zoom, no caption drift. */
body.home-v160.home-page .home-routes-v155 .home-route-card,
body.home-v160.home-page .home-routes-v155 .home-route-card:hover,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible {
  overflow: hidden !important;
  filter: none !important;
  transform: none !important;
  background: #000 !important;
}

body.home-v160.home-page .home-routes-v155 .home-route-card::before,
body.home-v160.home-page .home-routes-v155 .home-route-card::after {
  display: none !important;
  content: none !important;
}

body.home-v160.home-page .home-routes-v155 .home-route-card .home-route-cycle-img,
body.home-v160.home-page .home-routes-v155 .home-route-card:hover .home-route-cycle-img,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .home-route-cycle-img,
body.home-v160.home-page .home-routes-v155 .home-route-card.is-switching .home-route-cycle-img {
  filter: none !important;
  transform: none !important;
}

body.home-v160.home-page .home-routes-v155 .home-route-card .home-route-cycle-img.is-active,
body.home-v160.home-page .home-routes-v155 .home-route-card:hover .home-route-cycle-img.is-active,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .home-route-cycle-img.is-active {
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

body.home-v160.home-page .home-routes-v155 .route-v155-caption,
body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption {
  --peek: clamp(86px, 6.2vw, 126px);
  position: absolute !important;
  z-index: 70 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  min-height: clamp(150px, 12vw, 230px) !important;
  padding: clamp(24px, 2.0vw, 42px) clamp(28px, 2.4vw, 56px) clamp(24px, 2.0vw, 42px) !important;
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-rows: auto 1fr auto !important;
  grid-template-areas:
    "mark mark"
    "desc desc"
    "meta meta" !important;
  gap: clamp(10px, .85vw, 18px) clamp(22px, 2vw, 44px) !important;
  background: transparent !important;
  transform: translate3d(0, calc(100% - var(--peek)), 0) !important;
  transition: transform .34s cubic-bezier(.2,.8,.2,1) !important;
  isolation: isolate !important;
}

body.home-v160.home-page .home-routes-v155 .route-v155-caption::before,
body.home-v160.home-page .home-routes-v155 .route-v155-caption-small::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  display: block !important;
  background: #000 !important;
  opacity: 0 !important;
  transform: none !important;
  transition: opacity .18s ease !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption {
  transform: translate3d(0, 0, 0) !important;
}

body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption::before,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption::before {
  opacity: 1 !important;
}

body.home-v160.home-page .home-routes-v155 .route-v155-logo,
body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-logo {
  grid-area: mark !important;
  align-self: end !important;
  justify-self: start !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: left center !important;
  clip-path: none !important;
  overflow: visible !important;
  opacity: .96 !important;
  filter: drop-shadow(0 9px 24px rgba(0,0,0,.75)) !important;
  transform-origin: left center !important;
  transform: none !important;
  transition: transform .26s cubic-bezier(.22,.61,.36,1), opacity .2s ease !important;
}

body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-logo {
  transform: scale(1.035) !important;
  opacity: 1 !important;
}

body.home-v160.home-page .home-routes-v155 .route-v155-logo-sancticide,
body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo-sancticide {
  max-width: clamp(132px, 11.2vw, 230px) !important;
}

body.home-v160.home-page .home-routes-v155 .route-v155-logo-slavicpunk,
body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo-slavicpunk {
  max-width: clamp(118px, 10.4vw, 214px) !important;
}

body.home-v160.home-page .home-routes-v155 .route-v155-caption strong,
body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption strong,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption strong {
  grid-area: mark !important;
  align-self: end !important;
  justify-self: start !important;
  margin: 0 !important;
  padding: 0 !important;
  color: rgba(248,246,240,.96) !important;
  font: 700 clamp(13px, 1.0vw, 19px)/1 var(--mono) !important;
  letter-spacing: .24em !important;
  text-transform: uppercase !important;
  transform-origin: left center !important;
  transform: none !important;
  transition: transform .26s cubic-bezier(.22,.61,.36,1), opacity .2s ease !important;
}

body.home-v160.home-page .home-routes-v155 .route-v155-caption-small strong,
body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption-small strong,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption-small strong {
  font-size: clamp(15px, 1.14vw, 22px) !important;
  letter-spacing: .24em !important;
}

body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption strong,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption strong {
  transform: scale(1.035) !important;
}

body.home-v160.home-page .home-routes-v155 .route-v155-caption p,
body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption p,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption p {
  grid-area: desc !important;
  justify-self: start !important;
  align-self: end !important;
  width: min(46em, 70%) !important;
  max-width: 46em !important;
  margin: 0 !important;
  padding: 0 !important;
  color: rgba(244,242,236,.72) !important;
  font: 400 clamp(10px, .72vw, 13px)/1.5 var(--sans) !important;
  letter-spacing: .01em !important;
  text-align: left !important;
  opacity: 0 !important;
  transform: translate3d(0, 8px, 0) !important;
  transition: opacity .20s ease .08s, transform .24s cubic-bezier(.2,.78,.25,1) .06s !important;
}

body.home-v160.home-page .home-routes-v155 .route-v155-caption small,
body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption small,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption small {
  grid-area: meta !important;
  justify-self: end !important;
  align-self: end !important;
  display: inline-flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: clamp(9px, .75vw, 15px) !important;
  width: auto !important;
  max-width: 46% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: rgba(244,242,236,.52) !important;
  font: 600 clamp(7px, .50vw, 9px)/1 var(--mono) !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  text-align: right !important;
  opacity: 0 !important;
  transform: translate3d(0, 8px, 0) !important;
  transition: opacity .20s ease .10s, transform .24s cubic-bezier(.2,.78,.25,1) .08s !important;
}

body.home-v160.home-page .home-routes-v155 .route-v155-caption small span,
body.home-v160.home-page .home-routes-v155 .route-v155-caption small em {
  display: inline-block !important;
  text-align: right !important;
  white-space: nowrap !important;
}

body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption p,
body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption small,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption p,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption small {
  opacity: 1 !important;
  transform: translate3d(0,0,0) !important;
}

body.home-v160.home-page .home-routes-v155 .route-v155-caption-small,
body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption-small,
body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption-small {
  --peek: clamp(74px, 5.6vw, 112px);
  min-height: clamp(136px, 11vw, 210px) !important;
  padding: clamp(22px, 1.8vw, 38px) clamp(26px, 2.1vw, 46px) clamp(22px, 1.8vw, 36px) !important;
}

@media (max-width: 980px) {
  body.home-v160.home-page .home-routes-v155 .route-v155-caption,
  body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption,
  body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption {
    --peek: 92px;
    transform: translate3d(0, calc(100% - var(--peek)), 0) !important;
    padding: 22px 24px 24px !important;
  }
  body.home-v160.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption,
  body.home-v160.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption {
    transform: translate3d(0,0,0) !important;
  }
  body.home-v160.home-page .home-routes-v155 .route-v155-caption p,
  body.home-v160.home-page .home-routes-v155 .route-v155-caption small {
    width: 100% !important;
    max-width: none !important;
    justify-self: start !important;
    text-align: left !important;
  }
}


/* v161 — homepage slide-panel composition repair.
   Logo stays high-left, description sits to the right, metadata is separate on the far side.
   Slavicpunk logo gets more visible room so it does not clip. */
body.home-v161.home-page .home-routes-v155 .route-v155-caption,
body.home-v161.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption,
body.home-v161.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption {
  --peek: clamp(98px, 7.0vw, 144px);
  min-height: clamp(150px, 11.2vw, 218px) !important;
  padding: clamp(18px, 1.45vw, 30px) clamp(30px, 2.5vw, 58px) clamp(22px, 1.75vw, 36px) !important;
  display: grid !important;
  grid-template-columns: minmax(118px, max-content) minmax(220px, 1fr) max-content !important;
  grid-template-rows: 1fr auto !important;
  grid-template-areas:
    "mark desc meta"
    "mark desc meta" !important;
  align-items: center !important;
  column-gap: clamp(28px, 3.2vw, 72px) !important;
  row-gap: 0 !important;
  background: transparent !important;
  transform: translate3d(0, calc(100% - var(--peek)), 0) !important;
}

body.home-v161.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption,
body.home-v161.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption {
  transform: translate3d(0,0,0) !important;
}

body.home-v161.home-page .home-routes-v155 .route-v155-caption::before,
body.home-v161.home-page .home-routes-v155 .route-v155-caption-small::before {
  background: #000 !important;
  opacity: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}
body.home-v161.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption::before,
body.home-v161.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption::before {
  opacity: 1 !important;
}

body.home-v161.home-page .home-routes-v155 .route-v155-logo,
body.home-v161.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo,
body.home-v161.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-logo,
body.home-v161.home-page .home-routes-v155 .route-v155-caption strong,
body.home-v161.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption strong,
body.home-v161.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption strong {
  grid-area: mark !important;
  align-self: start !important;
  justify-self: start !important;
  margin: 0 !important;
  transform-origin: left center !important;
}

body.home-v161.home-page .home-routes-v155 .route-v155-caption p,
body.home-v161.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption p,
body.home-v161.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption p {
  grid-area: desc !important;
  align-self: center !important;
  justify-self: start !important;
  width: min(40em, 100%) !important;
  max-width: 40em !important;
  margin: 0 !important;
  text-align: left !important;
}

body.home-v161.home-page .home-routes-v155 .route-v155-caption small,
body.home-v161.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption small,
body.home-v161.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption small {
  grid-area: meta !important;
  align-self: end !important;
  justify-self: end !important;
  max-width: none !important;
  width: auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
  text-align: right !important;
  margin: 0 !important;
}

body.home-v161.home-page .home-routes-v155 .route-v155-caption small span,
body.home-v161.home-page .home-routes-v155 .route-v155-caption small em {
  display: block !important;
  white-space: nowrap !important;
  text-align: right !important;
}

body.home-v161.home-page .home-routes-v155 .route-v155-logo-sancticide,
body.home-v161.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo-sancticide,
body.home-v161.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-logo-sancticide {
  max-width: clamp(128px, 10.6vw, 218px) !important;
}

body.home-v161.home-page .home-routes-v155 .home-route-slavicpunk .route-v155-caption,
body.home-v161.home-page .home-routes-v155 .home-route-slavicpunk:hover .route-v155-caption,
body.home-v161.home-page .home-routes-v155 .home-route-slavicpunk:focus-visible .route-v155-caption {
  --peek: clamp(118px, 8.2vw, 166px);
  padding-top: clamp(14px, 1.1vw, 22px) !important;
}

body.home-v161.home-page .home-routes-v155 .route-v155-logo-slavicpunk,
body.home-v161.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo-slavicpunk,
body.home-v161.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-logo-slavicpunk {
  max-width: clamp(118px, 9.7vw, 202px) !important;
  transform: translate3d(0,-16px,0) !important;
}

body.home-v161.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo-slavicpunk,
body.home-v161.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-logo-slavicpunk {
  transform: translate3d(0,-16px,0) scale(1.035) !important;
}

body.home-v161.home-page .home-routes-v155 .route-v155-caption-small strong,
body.home-v161.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption-small strong,
body.home-v161.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption-small strong {
  font-size: clamp(16px, 1.25vw, 24px) !important;
}

@media (max-width: 980px) {
  body.home-v161.home-page .home-routes-v155 .route-v155-caption,
  body.home-v161.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption,
  body.home-v161.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "mark"
      "desc"
      "meta" !important;
    align-items: start !important;
    row-gap: 12px !important;
    --peek: 100px;
  }
  body.home-v161.home-page .home-routes-v155 .route-v155-caption small,
  body.home-v161.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption small,
  body.home-v161.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption small {
    justify-self: start !important;
    align-items: flex-start !important;
    text-align: left !important;
  }
}


/* v164 — Commercial Work title scale + homepage tile panel composition repair. */
body.works-v164.works-page .works-v92-intro h1 {
  font-size: clamp(24px, 2.55vw, 43px) !important;
  letter-spacing: .34em !important;
  line-height: .98 !important;
  white-space: nowrap !important;
  max-width: none !important;
}

/* Keep project logos in Commercial Work larger/readable, but keep RSG small and uncropped. */
body.works-v164.works-page .works-v92-titleblock .works-logo-title-sancticide img {
  width: clamp(330px, 24.5vw, 520px) !important;
  max-width: clamp(330px, 24.5vw, 520px) !important;
}
body.works-v164.works-page .works-v92-titleblock .works-logo-title-slavicpunk img {
  width: clamp(275px, 20.5vw, 430px) !important;
  max-width: clamp(275px, 20.5vw, 430px) !important;
}
body.works-v164.works-page .works-fact-studio,
body.works-v164.works-page .works-fact-studio * {
  overflow: visible !important;
  clip-path: none !important;
}
body.works-v164.works-page .works-fact-studio img {
  width: clamp(34px, 2.45vw, 48px) !important;
  max-width: none !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: center !important;
  clip-path: none !important;
  transform: none !important;
  opacity: .78 !important;
}

/* Homepage route tiles: reset the black plate into a clean three-zone composition. */
body.home-v164.home-page .home-routes-v155 .home-route-card,
body.home-v164.home-page .home-routes-v155 .home-route-card:hover,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible {
  overflow: hidden !important;
  transform: none !important;
  filter: none !important;
}
body.home-v164.home-page .home-routes-v155 .home-route-card::before,
body.home-v164.home-page .home-routes-v155 .home-route-card::after {
  display: none !important;
  content: none !important;
}
body.home-v164.home-page .home-routes-v155 .home-route-cycle-img,
body.home-v164.home-page .home-routes-v155 .home-route-cycle-img.is-active,
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .home-route-cycle-img,
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .home-route-cycle-img.is-active,
body.home-v164.home-page .home-routes-v155 .home-route-card.is-switching .home-route-cycle-img {
  filter: none !important;
  transform: none !important;
}

body.home-v164.home-page .home-routes-v155 .route-v155-caption,
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption {
  --peek: clamp(92px, 6.8vw, 136px);
  position: absolute !important;
  z-index: 70 !important;
  inset: auto 0 0 0 !important;
  width: 100% !important;
  max-width: none !important;
  min-height: clamp(132px, 9.9vw, 190px) !important;
  margin: 0 !important;
  padding: clamp(18px, 1.38vw, 28px) clamp(30px, 2.5vw, 58px) clamp(18px, 1.45vw, 32px) !important;
  background: transparent !important;
  border: 0 !important;
  text-align: left !important;
  text-shadow: 0 12px 38px rgba(0,0,0,.88) !important;
  display: grid !important;
  grid-template-columns: minmax(120px, max-content) minmax(260px, 1fr) max-content !important;
  grid-template-areas: "mark desc meta" !important;
  align-items: start !important;
  column-gap: clamp(34px, 3.4vw, 84px) !important;
  transform: translate3d(0, calc(100% - var(--peek)), 0) !important;
  transition: transform .34s cubic-bezier(.2,.78,.25,1) !important;
}
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption {
  transform: translate3d(0,0,0) !important;
}
body.home-v164.home-page .home-routes-v155 .route-v155-caption::before,
body.home-v164.home-page .home-routes-v155 .route-v155-caption-small::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: 0 !important;
  background: #000 !important;
  opacity: 1 !important;
  transform: none !important;
  border: 0 !important;
  box-shadow: none !important;
  pointer-events: none !important;
}
body.home-v164.home-page .home-routes-v155 .route-v155-logo,
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-logo,
body.home-v164.home-page .home-routes-v155 .route-v155-caption strong,
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption strong,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption strong {
  grid-area: mark !important;
  align-self: start !important;
  justify-self: start !important;
  margin: 0 !important;
  transform-origin: left center !important;
  transition: transform .26s cubic-bezier(.2,.78,.25,1) !important;
}
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-logo {
  transform: scale(1.03) !important;
}
body.home-v164.home-page .home-routes-v155 .route-v155-caption p,
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption p,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption p {
  grid-area: desc !important;
  align-self: start !important;
  justify-self: start !important;
  max-width: min(44em, 100%) !important;
  margin: clamp(4px, .32vw, 7px) 0 0 !important;
  color: rgba(244,242,236,.72) !important;
  font: 400 clamp(10px, .70vw, 13px)/1.55 var(--sans) !important;
  letter-spacing: .01em !important;
  text-align: left !important;
  opacity: 0 !important;
  transform: translate3d(0, 8px, 0) !important;
  transition: opacity .20s ease .08s, transform .24s cubic-bezier(.2,.78,.25,1) .06s !important;
}
body.home-v164.home-page .home-routes-v155 .route-v155-caption small,
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption small,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption small {
  grid-area: meta !important;
  align-self: start !important;
  justify-self: end !important;
  display: grid !important;
  gap: 8px !important;
  width: auto !important;
  max-width: none !important;
  margin: clamp(7px, .45vw, 10px) 0 0 !important;
  color: rgba(244,242,236,.55) !important;
  font: 600 clamp(7px, .48vw, 9px)/1 var(--mono) !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  text-align: right !important;
  opacity: 0 !important;
  transform: translate3d(0, 8px, 0) !important;
  transition: opacity .20s ease .12s, transform .24s cubic-bezier(.2,.78,.25,1) .10s !important;
}
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption p,
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption small,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption p,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption small {
  opacity: 1 !important;
  transform: translate3d(0,0,0) !important;
}
body.home-v164.home-page .home-routes-v155 .route-v155-caption small span,
body.home-v164.home-page .home-routes-v155 .route-v155-caption small em {
  display: block !important;
  white-space: nowrap !important;
  text-align: right !important;
  font-style: normal !important;
}
body.home-v164.home-page .home-routes-v155 .route-v155-logo-sancticide,
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo-sancticide,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-logo-sancticide {
  max-width: clamp(120px, 9.8vw, 200px) !important;
}
body.home-v164.home-page .home-routes-v155 .route-v155-logo-slavicpunk,
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo-slavicpunk,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-logo-slavicpunk {
  max-width: clamp(92px, 7.7vw, 160px) !important;
  transform: translate3d(0, -20px, 0) !important;
}
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-logo-slavicpunk,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-logo-slavicpunk {
  transform: translate3d(0, -20px, 0) scale(1.03) !important;
}
body.home-v164.home-page .home-routes-v155 .home-route-slavicpunk .route-v155-caption,
body.home-v164.home-page .home-routes-v155 .home-route-slavicpunk:hover .route-v155-caption,
body.home-v164.home-page .home-routes-v155 .home-route-slavicpunk:focus-visible .route-v155-caption {
  --peek: clamp(116px, 8.4vw, 164px);
  padding-top: clamp(24px, 1.8vw, 38px) !important;
}

body.home-v164.home-page .home-routes-v155 .route-v155-caption-small,
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption-small,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption-small {
  grid-template-columns: minmax(170px, 1fr) minmax(180px, .9fr) max-content !important;
}
body.home-v164.home-page .home-routes-v155 .route-v155-caption-small strong,
body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption-small strong,
body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption-small strong {
  font-size: clamp(17px, 1.32vw, 26px) !important;
}

@media (max-width: 980px) {
  body.works-v164.works-page .works-v92-intro h1 {
    white-space: normal !important;
    font-size: clamp(28px, 9vw, 48px) !important;
  }
  body.home-v164.home-page .home-routes-v155 .route-v155-caption,
  body.home-v164.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption,
  body.home-v164.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption {
    grid-template-columns: 1fr !important;
    grid-template-areas: "mark" "desc" "meta" !important;
    row-gap: 12px !important;
    --peek: 100px;
  }
  body.home-v164.home-page .home-routes-v155 .route-v155-caption p,
  body.home-v164.home-page .home-routes-v155 .route-v155-caption small {
    justify-self: start !important;
    text-align: left !important;
    align-items: start !important;
  }
  body.home-v164.home-page .home-routes-v155 .route-v155-caption small span,
  body.home-v164.home-page .home-routes-v155 .route-v155-caption small em {
    text-align: left !important;
  }
}


/* v165 — Commercial Work title uses the Dragonfly/Ważka title character. */
body.works-v165.works-page .works-v92-intro h1 {
  font-family: "Manrope", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  text-transform: none !important;
  font-weight: 600 !important;
  font-size: clamp(30px, 3.15vw, 54px) !important;
  letter-spacing: -0.048em !important;
  line-height: .9 !important;
  color: rgba(243, 240, 232, .76) !important;
  white-space: nowrap !important;
  max-width: none !important;
}
@media (max-width: 980px) {
  body.works-v165.works-page .works-v92-intro h1 {
    white-space: normal !important;
    font-size: clamp(34px, 10vw, 58px) !important;
  }
}


/* v166 — Personal Work archive filter buttons: pill CTA style + combined MJ Explorations */
body.personal-v151 .pa151-filter-bar {
  padding: clamp(22px, 3vw, 42px) clamp(18px, 3.6vw, 68px) clamp(20px, 2.6vw, 36px) !important;
  gap: clamp(10px, 1.05vw, 18px) !important;
  background: #000 !important;
  border-top: 1px solid rgba(243,240,232,.055) !important;
  border-bottom: 1px solid rgba(243,240,232,.055) !important;
}

body.personal-v151 .pa151-filter {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: clamp(30px, 2.35vw, 38px) !important;
  padding: 0 clamp(14px, 1.35vw, 24px) !important;
  border: 1px solid rgba(243,240,232,.22) !important;
  border-radius: 999px !important;
  background: rgba(0,0,0,.14) !important;
  color: rgba(243,240,232,.54) !important;
  font-size: clamp(8.5px, .63vw, 12px) !important;
  line-height: 1 !important;
  letter-spacing: .18em !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.26) !important;
  backdrop-filter: blur(2px) !important;
  -webkit-backdrop-filter: blur(2px) !important;
  transition: color .18s ease, border-color .18s ease, background .18s ease, transform .18s ease !important;
}

body.personal-v151 .pa151-filter:hover,
body.personal-v151 .pa151-filter.is-active {
  color: rgba(255,255,255,.94) !important;
  border-color: rgba(243,240,232,.48) !important;
  background: rgba(0,0,0,.28) !important;
}

body.personal-v151 .pa151-filter:hover {
  transform: translate3d(0,-1px,0) !important;
}

body.personal-v151 .pa151-filter.is-active::before {
  display: none !important;
  content: none !important;
}

@media (max-width: 760px) {
  body.personal-v151 .pa151-filter-bar {
    justify-content: flex-start !important;
    overflow-x: auto !important;
  }
  body.personal-v151 .pa151-filter {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
  }
}

/* v167 — Commercial Work title: smaller + darker Dragonfly/Ważka-style title */
body.works-v165.works-page .works-v92-intro h1,
body.works-v164.works-page .works-v92-intro h1 {
  font-size: clamp(24px, 2.55vw, 43px) !important;
  color: rgba(243, 240, 232, .58) !important;
  opacity: 1 !important;
}
@media (max-width: 980px) {
  body.works-v165.works-page .works-v92-intro h1,
  body.works-v164.works-page .works-v92-intro h1 {
    font-size: clamp(28px, 8vw, 46px) !important;
  }
}


/* v169 — uploaded commercial work integration */
.works-v169 .works-v92-grid-controlled { align-items: start; }
.works-v169 .works-v92-hero-frame img,
.works-v169 .asset-card img { background:#050505; }
.works-v169 .asset-card.contain img,
.works-v169 .works-v92-hero-contained img { object-fit:contain; background:#030303; }
.works-v169 .works-logo-title-sancticide img { width:min(370px,42vw); }
.works-v169 .works-logo-title-slavicpunk img { width:min(300px,36vw); }
.works-v169 .works-fact-studio img { max-width:38px; width:38px; height:auto; object-fit:contain; }
.home-v169 .home-route-sancticide .home-route-cycle-img,
.home-v169 .home-route-slavicpunk .home-route-cycle-img { filter:none !important; object-fit:cover; }
.home-v169 .home-route-sancticide:hover .home-route-cycle-img,
.home-v169 .home-route-slavicpunk:hover .home-route-cycle-img { filter:none !important; }
@media (max-width:900px){
 .works-v169 .works-logo-title-sancticide img{width:min(280px,70vw)}
 .works-v169 .works-logo-title-slavicpunk img{width:min(250px,66vw)}
}


/* v170 — Sibirpunk RPG correction + commercial work layout refinements */
body.works-v170 .works-v92-rail a[href="#sibirpunk-rpg"] span { letter-spacing: .11em; }

/* Sancticide: portraits smaller, side-by-side, while large production images stay full width */
body.works-v170 #sancticide .sancticide-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: start;
}
body.works-v170 #sancticide .sancticide-grid .asset-card.span-wide {
  grid-column: 1 / -1;
}
body.works-v170 #sancticide .sancticide-grid .character-portrait-tile {
  grid-column: span 1;
  min-height: 0;
  height: auto;
  aspect-ratio: 3 / 4.25;
}
body.works-v170 #sancticide .sancticide-grid .character-portrait-tile img {
  object-fit: cover;
  object-position: center top;
}

/* Sibirpunk RPG: one full key art, then all images one under another */
body.works-v170 #sibirpunk-rpg .sibirpunk-rpg-hero {
  min-height: clamp(520px, 76vh, 880px);
  height: min(78vh, 880px);
  background: #020202;
}
body.works-v170 #sibirpunk-rpg .sibirpunk-rpg-hero img {
  object-fit: contain;
  object-position: center center;
}
body.works-v170 #sibirpunk-rpg .sibirpunk-rpg-stack {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(14px, 1.1vw, 22px);
  margin-top: clamp(14px, 1.1vw, 22px);
}
body.works-v170 #sibirpunk-rpg .sibirpunk-rpg-panel {
  grid-column: 1 / -1;
  min-height: unset;
  height: min(86vh, 940px);
  background: #020202;
}
body.works-v170 #sibirpunk-rpg .sibirpunk-rpg-panel img {
  object-fit: contain;
  object-position: center center;
  background: #020202;
}

@media (max-width: 980px) {
  body.works-v170 #sancticide .sancticide-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.works-v170 #sibirpunk-rpg .sibirpunk-rpg-hero,
  body.works-v170 #sibirpunk-rpg .sibirpunk-rpg-panel {
    height: auto;
    min-height: 0;
  }
  body.works-v170 #sibirpunk-rpg .sibirpunk-rpg-hero img,
  body.works-v170 #sibirpunk-rpg .sibirpunk-rpg-panel img {
    height: auto;
  }
}

/* v171 — Commercial Work layout repair: Sibirpunk RPG structured archive, no black letterbox bars */
body.works-v171 .works-v92 figure {
  background: transparent !important;
}
body.works-v171 .works-v92 .contain img,
body.works-v171 .works-v92-hero-contained img {
  background: transparent !important;
}

/* Sancticide portraits: compact row, not giant feature images */
body.works-v171 #sancticide .sancticide-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: start;
}
body.works-v171 #sancticide .sancticide-grid .asset-card.span-wide {
  grid-column: 1 / -1;
}
body.works-v171 #sancticide .sancticide-grid .character-portrait-tile {
  grid-column: span 1;
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: 3 / 4.35;
}
body.works-v171 #sancticide .sancticide-grid .character-portrait-tile img {
  object-fit: cover;
  object-position: center top;
}

/* Sibirpunk RPG: deliberate hierarchy instead of one huge black-contain stack */
body.works-v171 #sibirpunk-rpg .works-v92-desc {
  max-width: 720px;
  margin-bottom: clamp(20px, 2.2vw, 38px);
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(12px, 1.05vw, 20px);
  margin-top: clamp(16px, 1.6vw, 30px);
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-label {
  margin: clamp(24px, 3vw, 56px) 0 0;
  color: rgba(245,241,231,.36);
  font-size: 8px;
  letter-spacing: .32em;
  text-transform: uppercase;
  font-family: var(--mono);
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-grid {
  display: grid;
  gap: clamp(10px, .85vw, 16px);
  align-items: start;
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-grid-two {
  grid-template-columns: 1fr 1fr;
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-grid-three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-grid-four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-layout figure,
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-layout .asset-card,
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-layout .works-v92-hero-frame {
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: auto !important;
  box-shadow: none;
  overflow: hidden;
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-layout img {
  width: 100%;
  height: auto !important;
  object-fit: contain !important;
  object-position: center center;
  background: transparent !important;
  display: block;
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-hero img {
  width: min(100%, 1180px);
  margin: 0 auto;
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-wide img {
  width: 100%;
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-compact,
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-portrait,
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-character {
  align-self: start;
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-character img,
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-portrait img {
  width: 100%;
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-layout figcaption {
  left: 12px;
  bottom: 10px;
  background: rgba(0,0,0,.34);
  padding: 5px 7px;
  color: rgba(245,241,231,.58);
}
body.works-v171 #sibirpunk-rpg .sibirpunk-v171-layout figure:hover img {
  filter: brightness(1) contrast(1.045) saturate(1);
  transform: none;
}

@media (max-width: 1180px) {
  body.works-v171 #sancticide .sancticide-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  body.works-v171 #sibirpunk-rpg .sibirpunk-v171-grid-four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 820px) {
  body.works-v171 #sancticide .sancticide-grid,
  body.works-v171 #sibirpunk-rpg .sibirpunk-v171-grid-two,
  body.works-v171 #sibirpunk-rpg .sibirpunk-v171-grid-three,
  body.works-v171 #sibirpunk-rpg .sibirpunk-v171-grid-four {
    grid-template-columns: 1fr;
  }
}

/* v172 — Commercial Work: restore wide column and rebuild production layouts with clear hierarchy, no black letterbox bars. */
body.works-v172 .works-v92-intro,
body.works-v172 .works-v92-content {
  width: min(1240px, calc(100vw - 280px)) !important;
}

body.works-v172 .works-v92-case {
  overflow: visible !important;
}

body.works-v172 .commercial-v172-layout {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: none !important;
  display: grid !important;
  gap: clamp(10px, .9vw, 18px) !important;
  margin-top: clamp(18px, 2vw, 34px) !important;
}

body.works-v172 .commercial-v172-label {
  margin: clamp(30px, 4vw, 64px) 0 clamp(6px, .75vw, 12px) !important;
  font-family: var(--mono) !important;
  font-size: 8px !important;
  letter-spacing: .32em !important;
  text-transform: uppercase !important;
  color: rgba(245,241,231,.35) !important;
}

body.works-v172 .commercial-v172-layout figure,
body.works-v172 .commercial-v172-layout .asset-card,
body.works-v172 .commercial-v172-layout .works-v92-hero-frame,
body.works-v172 .commercial-v172-layout .asset-card.span-wide,
body.works-v172 .commercial-v172-layout .works-v92-hero-contained {
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: auto !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

body.works-v172 .commercial-v172-layout img,
body.works-v172 .commercial-v172-layout figure:hover img,
body.works-v172 .commercial-v172-layout figure:focus-visible img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: transparent !important;
  transform: none !important;
  filter: brightness(.98) contrast(1.035) saturate(.96) !important;
}

body.works-v172 .commercial-v172-full,
body.works-v172 .commercial-v172-wide,
body.works-v172 .commercial-v172-hero {
  width: 100% !important;
  grid-column: 1 / -1 !important;
}

body.works-v172 .commercial-v172-grid {
  display: grid !important;
  width: 100% !important;
  gap: clamp(10px, .9vw, 18px) !important;
  align-items: start !important;
}
body.works-v172 .commercial-v172-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
body.works-v172 .commercial-v172-grid-three { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }

body.works-v172 .commercial-v172-character-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}
body.works-v172 .commercial-v172-character-grid .commercial-v172-character {
  min-width: 0 !important;
}
body.works-v172 .commercial-v172-character-grid img {
  object-fit: cover !important;
  object-position: center top !important;
}

body.works-v172 .commercial-v172-assets-grid {
  grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr) minmax(0, .7fr) !important;
  align-items: start !important;
}

body.works-v172 .commercial-v172-layout figcaption {
  left: 12px !important;
  bottom: 10px !important;
  padding: 4px 6px !important;
  background: rgba(0,0,0,.28) !important;
  color: rgba(245,241,231,.52) !important;
  letter-spacing: .14em !important;
}

body.works-v172 .slavicpunk-v172-feature {
  display: grid !important;
  grid-template-columns: minmax(270px, .85fr) minmax(0, 1.65fr) !important;
  gap: clamp(10px, .9vw, 18px) !important;
  align-items: start !important;
}
body.works-v172 .slavicpunk-v172-keyart {
  width: 100% !important;
}
body.works-v172 .slavicpunk-v172-keyart img {
  width: 100% !important;
  max-width: none !important;
}
body.works-v172 .slavicpunk-v172-feature-stack {
  display: grid !important;
  gap: clamp(10px, .9vw, 18px) !important;
}

/* Sibirpunk: keep the better hierarchy from v171 but use full Commercial Work column width. */
body.works-v172 #sibirpunk-rpg .sibirpunk-v171-layout,
body.works-v172 #sibirpunk-rpg .sibirpunk-v172-layout {
  width: 100% !important;
  max-width: none !important;
}
body.works-v172 #sibirpunk-rpg .sibirpunk-v171-hero img {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
body.works-v172 #sibirpunk-rpg .sibirpunk-v171-grid-four {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

@media (max-width: 1180px) {
  body.works-v172 .works-v92-intro,
  body.works-v172 .works-v92-content {
    width: min(1000px, calc(100vw - 230px)) !important;
  }
  body.works-v172 .commercial-v172-character-grid,
  body.works-v172 #sibirpunk-rpg .sibirpunk-v171-grid-four {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
  body.works-v172 .commercial-v172-grid-three,
  body.works-v172 .commercial-v172-assets-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 860px) {
  body.works-v172 .works-v92-intro,
  body.works-v172 .works-v92-content {
    width: min(100% - 34px, 720px) !important;
  }
  body.works-v172 .slavicpunk-v172-feature,
  body.works-v172 .commercial-v172-grid-two,
  body.works-v172 .commercial-v172-grid-three,
  body.works-v172 .commercial-v172-assets-grid,
  body.works-v172 .commercial-v172-character-grid,
  body.works-v172 #sibirpunk-rpg .sibirpunk-v171-grid-two,
  body.works-v172 #sibirpunk-rpg .sibirpunk-v171-grid-three,
  body.works-v172 #sibirpunk-rpg .sibirpunk-v171-grid-four {
    grid-template-columns: 1fr !important;
  }
}


/* v173: complete commercial work image coverage and cleaner production grids */
body.works-v173 .commercial-v173-layout {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: none !important;
  display: grid !important;
  gap: clamp(10px, .9vw, 18px) !important;
  margin-top: clamp(18px, 2vw, 34px) !important;
}
body.works-v173 .commercial-v173-label {
  margin: clamp(30px, 4vw, 62px) 0 clamp(6px, .75vw, 12px) !important;
  font-family: var(--mono) !important;
  font-size: 8px !important;
  letter-spacing: .32em !important;
  text-transform: uppercase !important;
  color: rgba(245,241,231,.34) !important;
}
body.works-v173 .commercial-v173-layout figure,
body.works-v173 .commercial-v173-layout .asset-card,
body.works-v173 .commercial-v173-layout .works-v92-hero-frame {
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: auto !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  transform: none !important;
}
body.works-v173 .commercial-v173-layout img,
body.works-v173 .commercial-v173-layout figure:hover img,
body.works-v173 .commercial-v173-layout figure:focus-visible img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
  transform: none !important;
  filter: brightness(.98) contrast(1.035) saturate(.96) !important;
}
body.works-v173 .commercial-v173-full {
  width: 100% !important;
  grid-column: 1 / -1 !important;
}
body.works-v173 .commercial-v173-grid {
  display: grid !important;
  width: 100% !important;
  gap: clamp(10px, .9vw, 18px) !important;
  align-items: start !important;
}
body.works-v173 .commercial-v173-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
body.works-v173 .commercial-v173-grid-three { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
body.works-v173 .commercial-v173-grid-four { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
body.works-v173 .commercial-v173-portrait-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
body.works-v173 .commercial-v173-ui-grid { grid-template-columns: minmax(0, 2fr) minmax(0, .9fr) repeat(3, minmax(90px, .55fr)) !important; }
body.works-v173 .commercial-v173-ui-grid figure:first-child { grid-column: span 2 !important; }
body.works-v173 .commercial-v173-ui-grid img { object-fit: contain !important; }
body.works-v173 .slavicpunk-v173-key-grid { grid-template-columns: minmax(220px, .42fr) minmax(0, 1fr) !important; }
body.works-v173 .slavicpunk-v173-key-side { grid-template-columns: 1fr !important; }
body.works-v173 .commercial-v173-layout figcaption { left: 12px !important; bottom: 10px !important; padding: 0 !important; background: transparent !important; color: rgba(245,241,231,.72) !important; }
@media (max-width: 1180px) {
  body.works-v173 .commercial-v173-portrait-grid,
  body.works-v173 .commercial-v173-grid-four,
  body.works-v173 .commercial-v173-ui-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  body.works-v173 .commercial-v173-ui-grid figure:first-child { grid-column: span 3 !important; }
}
@media (max-width: 860px) {
  body.works-v173 .commercial-v173-grid-two,
  body.works-v173 .commercial-v173-grid-three,
  body.works-v173 .commercial-v173-grid-four,
  body.works-v173 .commercial-v173-portrait-grid,
  body.works-v173 .commercial-v173-ui-grid,
  body.works-v173 .slavicpunk-v173-key-grid,
  body.works-v173 .slavicpunk-v173-key-side { grid-template-columns: 1fr !important; }
  body.works-v173 .commercial-v173-ui-grid figure:first-child { grid-column: auto !important; }
}

/* v175 — Personal Work filter logic only: keep the existing look, but collapse unused archive rows. */
body.personal-v151 .pa151-brick-row.is-empty-filter-row {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
}


/* v176 — Personal Work archive: keep the same brick look, but let portrait images keep portrait-shaped slots. */
body.personal-v151 .pa151-brick-gallery .pa151-tile {
  flex: var(--tile-flex, 1) 1 0 !important;
}
body.personal-v151 .pa151-brick-gallery .pa151-tile.is-wide,
body.personal-v151 .pa151-brick-gallery .pa151-tile.is-medium,
body.personal-v151 .pa151-brick-gallery .pa151-tile.is-portrait,
body.personal-v151 .pa151-brick-gallery .pa151-tile.is-narrow {
  flex: var(--tile-flex, 1) 1 0 !important;
}

/* v178 — homepage route image selection polish */
body.home-v178.home-page .home-routes-v155 .home-route-sancticide .home-route-cycle-img {
  object-position: 50% 50% !important;
}
body.home-v178.home-page .home-routes-v155 .home-route-slavicpunk .home-route-cycle-img {
  object-position: 50% 50% !important;
}
body.home-v178.home-page .home-routes-v155 .home-route-slavicpunk .route-v155-logo-slavicpunk,
body.home-v178.home-page .home-routes-v155 .home-route-slavicpunk:hover .route-v155-logo-slavicpunk,
body.home-v178.home-page .home-routes-v155 .home-route-slavicpunk:focus-visible .route-v155-logo-slavicpunk {
  transform: translate3d(0, -6px, 0) scale(.8) !important;
  transform-origin: left center !important;
}

/* v184 — Twój K. motion preview panel under homepage hero */
body.home-v184 .home-video-panel {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 2048 / 877;
  min-height: clamp(240px, 38vw, 720px);
  max-height: 78vh;
  overflow: hidden;
  background: #000;
  isolation: isolate;
  cursor: default;
}

body.home-v184 .home-video-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(0,0,0,.26), rgba(0,0,0,0) 32%, rgba(0,0,0,.20) 100%),
    linear-gradient(90deg, rgba(0,0,0,.24), rgba(0,0,0,0) 25%, rgba(0,0,0,0) 75%, rgba(0,0,0,.18));
}

body.home-v184 .home-video-poster,
body.home-v184 .home-video-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
  display: block;
}

body.home-v184 .home-video-poster {
  z-index: 1;
  opacity: 1;
  transform: scale(1.001);
}

body.home-v184 .home-video-media {
  z-index: 2;
  opacity: 0;
  transition: opacity .14s linear;
  transform: scale(1.001);
  pointer-events: none;
}

body.home-v184 .home-video-panel.is-playing .home-video-media,
body.home-v184 .home-video-panel:hover .home-video-media {
  opacity: 1;
}

@media (max-width: 820px) {
  body.home-v184 .home-video-panel {
    min-height: 62vw;
    max-height: none;
  }
}

/* v185 — motion video section polish: title overlay, link behavior, and personal placement */
body.home-v185 .home-video-panel {
  text-decoration: none;
  cursor: pointer;
}

body.home-v185 .home-video-title {
  position: absolute;
  left: clamp(28px, 4.2vw, 72px);
  bottom: clamp(24px, 3.2vw, 56px);
  z-index: 4;
  display: inline-block;
  font-family: var(--font-title, inherit);
  font-size: clamp(18px, 1.65vw, 34px);
  line-height: 1;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: rgba(255,255,255,.88);
  text-shadow: 0 12px 34px rgba(0,0,0,.72);
  pointer-events: none;
}

body.personal-v185 .personal-motion-panel {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 2048 / 877;
  min-height: clamp(240px, 38vw, 720px);
  max-height: 78vh;
  overflow: hidden;
  background: #000;
  isolation: isolate;
  cursor: default;
  margin: 0;
}

body.personal-v185 .personal-motion-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(0,0,0,.22), rgba(0,0,0,0) 32%, rgba(0,0,0,.18) 100%),
    linear-gradient(90deg, rgba(0,0,0,.20), rgba(0,0,0,0) 25%, rgba(0,0,0,0) 75%, rgba(0,0,0,.16));
}

body.personal-v185 .personal-motion-poster,
body.personal-v185 .personal-motion-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
  display: block;
}

body.personal-v185 .personal-motion-poster {
  z-index: 1;
  opacity: 1;
  transform: scale(1.001);
}

body.personal-v185 .personal-motion-media {
  z-index: 2;
  opacity: 0;
  transition: opacity .14s linear;
  transform: scale(1.001);
  pointer-events: none;
}

body.personal-v185 .personal-motion-panel.is-playing .personal-motion-media,
body.personal-v185 .personal-motion-panel:hover .personal-motion-media {
  opacity: 1;
}

@media (max-width: 820px) {
  body.personal-v185 .personal-motion-panel {
    min-height: 62vw;
    max-height: none;
  }
  body.home-v185 .home-video-title {
    left: 22px;
    bottom: 22px;
    font-size: 16px;
    letter-spacing: .22em;
  }
}


/* v186 — normal-sized embedded motion section and 02:02 video title polish */
body.personal-v186 .personal-motion-panel.personal-motion-player {
  width: min(1120px, calc(100% - clamp(48px, 10vw, 180px)));
  margin: clamp(64px, 8vw, 132px) auto clamp(84px, 9vw, 150px);
  aspect-ratio: 2048 / 877;
  min-height: 0;
  max-height: none;
  overflow: visible;
  background: transparent;
  isolation: auto;
}

body.personal-v186 .personal-motion-panel.personal-motion-player::after {
  display: none;
}

body.personal-v186 .personal-motion-panel.personal-motion-player .personal-motion-media {
  position: relative;
  inset: auto;
  z-index: 1;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: cover;
  opacity: 1;
  display: block;
  pointer-events: auto;
  transform: none;
  background: #000;
}

body.personal-v186 .personal-motion-panel.personal-motion-player .personal-motion-poster {
  display: none;
}

body.home-v186 .home-video-title {
  letter-spacing: .28em;
}

@media (max-width: 820px) {
  body.personal-v186 .personal-motion-panel.personal-motion-player {
    width: calc(100% - 32px);
    margin: 56px auto 84px;
    aspect-ratio: 16 / 9;
  }
}


/* v187 — move motion preview into homepage route grid under the two game tiles.
   Structure: Sancticide / Slavicpunk, then 2/3 motion tile + 1/3 Personal Work tile. */
body.home-v187.home-page .home-routes-v155 .home-route-motion {
  grid-column: span 4 !important;
  width: 100% !important;
  height: clamp(300px, 29vw, 560px) !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  align-self: stretch !important;
  background: #000 !important;
}

body.home-v187.home-page .home-routes-v155 .home-route-motion .home-video-poster,
body.home-v187.home-page .home-routes-v155 .home-route-motion .home-video-media {
  object-fit: cover !important;
  object-position: center center !important;
}

body.home-v187.home-page .home-routes-v155 .home-route-motion .home-video-title {
  left: clamp(24px, 2.4vw, 52px) !important;
  bottom: clamp(22px, 2.2vw, 48px) !important;
  font-size: clamp(13px, 1.05vw, 20px) !important;
  letter-spacing: .26em !important;
  color: rgba(248,246,240,.88) !important;
}

body.home-v187.home-page .home-routes-v155 .home-route-personal-feature {
  grid-column: span 2 !important;
  height: clamp(300px, 29vw, 560px) !important;
  min-height: 0 !important;
  align-self: stretch !important;
}

body.home-v187.home-page .home-routes-v155 .home-route-personal-feature .home-route-cycle-img {
  object-position: center center !important;
}

body.home-v187.home-page .home-routes-v155 .route-v155-caption-personal-feature {
  width: min(360px, 66%) !important;
  max-width: min(360px, 66%) !important;
}

@media (max-width: 820px) {
  body.home-v187.home-page .home-routes-v155 .home-route-motion,
  body.home-v187.home-page .home-routes-v155 .home-route-personal-feature {
    grid-column: span 6 !important;
    height: auto !important;
    min-height: 62vw !important;
  }
}


/* v188 — homepage route row cleanup.
   Keep the archer motion tile in its native aspect ratio, simplify the
   Personal Work tile and lower archive tiles, and prevent broken/overheavy blocks. */
body.home-v188.home-page .home-routes-v155 .home-route-motion {
  grid-column: span 4 !important;
  aspect-ratio: 1800 / 771 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  align-self: start !important;
  background: #000 !important;
}
body.home-v188.home-page .home-routes-v155 .home-route-motion .home-video-poster,
body.home-v188.home-page .home-routes-v155 .home-route-motion .home-video-media {
  object-fit: cover !important;
  object-position: center center !important;
}
body.home-v188.home-page .home-routes-v155 .home-route-motion::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,0) 32%, rgba(0,0,0,.16) 100%),
    linear-gradient(90deg, rgba(0,0,0,.10), rgba(0,0,0,0) 28%, rgba(0,0,0,0) 72%, rgba(0,0,0,.08)) !important;
}
body.home-v188.home-page .home-routes-v155 .home-route-personal-feature {
  grid-column: span 2 !important;
  min-height: 0 !important;
  height: auto !important;
  align-self: stretch !important;
}
body.home-v188.home-page .home-routes-v155 .home-route-personal-feature .home-route-cycle-img {
  object-fit: cover !important;
  object-position: 52% 42% !important;
}
body.home-v188.home-page .home-routes-v155 .route-v155-caption-personal-feature,
body.home-v188.home-page .home-routes-v155 .home-route-personal-feature:hover .route-v155-caption-personal-feature,
body.home-v188.home-page .home-routes-v155 .home-route-personal-feature:focus-visible .route-v155-caption-personal-feature {
  left: clamp(22px, 2.1vw, 42px) !important;
  right: auto !important;
  bottom: clamp(22px, 2.1vw, 42px) !important;
  width: auto !important;
  max-width: none !important;
  min-height: 0 !important;
  padding: 0 !important;
  display: block !important;
  background: transparent !important;
  transform: none !important;
  transition: none !important;
}
body.home-v188.home-page .home-routes-v155 .route-v155-caption-personal-feature::before {
  display: none !important;
  content: none !important;
}
body.home-v188.home-page .home-routes-v155 .route-v155-caption-personal-feature strong {
  display: block !important;
  font-size: clamp(13px, 1vw, 19px) !important;
  line-height: 1.05 !important;
  letter-spacing: .26em !important;
  color: rgba(248,246,240,.92) !important;
  text-shadow: 0 12px 34px rgba(0,0,0,.88) !important;
}
body.home-v188.home-page .home-routes-v155 .route-v155-caption-personal-feature p,
body.home-v188.home-page .home-routes-v155 .route-v155-caption-personal-feature small {
  display: none !important;
}
body.home-v188.home-page .home-routes-v155 .home-route-digital,
body.home-v188.home-page .home-routes-v155 .home-route-traditional,
body.home-v188.home-page .home-routes-v155 .home-route-explorations {
  margin-top: clamp(8px, .75vw, 16px) !important;
}
body.home-v188.home-page .home-routes-v155 .home-route-digital .route-v155-caption-small,
body.home-v188.home-page .home-routes-v155 .home-route-traditional .route-v155-caption-small,
body.home-v188.home-page .home-routes-v155 .home-route-explorations .route-v155-caption-small,
body.home-v188.home-page .home-routes-v155 .home-route-digital:hover .route-v155-caption-small,
body.home-v188.home-page .home-routes-v155 .home-route-traditional:hover .route-v155-caption-small,
body.home-v188.home-page .home-routes-v155 .home-route-explorations:hover .route-v155-caption-small {
  left: clamp(24px, 2.2vw, 44px) !important;
  bottom: clamp(24px, 2.1vw, 42px) !important;
  width: auto !important;
  max-width: 72% !important;
  min-height: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  transform: none !important;
}
body.home-v188.home-page .home-routes-v155 .home-route-digital .route-v155-caption-small::before,
body.home-v188.home-page .home-routes-v155 .home-route-traditional .route-v155-caption-small::before,
body.home-v188.home-page .home-routes-v155 .home-route-explorations .route-v155-caption-small::before {
  display: none !important;
  content: none !important;
}
body.home-v188.home-page .home-routes-v155 .home-route-digital .route-v155-caption-small strong,
body.home-v188.home-page .home-routes-v155 .home-route-traditional .route-v155-caption-small strong,
body.home-v188.home-page .home-routes-v155 .home-route-explorations .route-v155-caption-small strong {
  display: block !important;
  font-size: clamp(14px, 1.1vw, 21px) !important;
  line-height: .96 !important;
  letter-spacing: .27em !important;
  color: rgba(248,246,240,.94) !important;
  text-shadow: 0 10px 28px rgba(0,0,0,.90) !important;
}
body.home-v188.home-page .home-routes-v155 .home-route-digital .route-v155-caption-small p,
body.home-v188.home-page .home-routes-v155 .home-route-traditional .route-v155-caption-small p,
body.home-v188.home-page .home-routes-v155 .home-route-explorations .route-v155-caption-small p,
body.home-v188.home-page .home-routes-v155 .home-route-digital .route-v155-caption-small small,
body.home-v188.home-page .home-routes-v155 .home-route-traditional .route-v155-caption-small small,
body.home-v188.home-page .home-routes-v155 .home-route-explorations .route-v155-caption-small small {
  display: none !important;
}
@media (max-width: 980px) {
  body.home-v188.home-page .home-routes-v155 .home-route-motion,
  body.home-v188.home-page .home-routes-v155 .home-route-personal-feature {
    grid-column: auto !important;
  }
  body.home-v188.home-page .home-routes-v155 .home-route-motion {
    aspect-ratio: 1800 / 771 !important;
  }
}

/* v189 — homepage hierarchy separators + lightweight motion preview.
   Desktop-only polish: the first commercial row sits under a falling top shadow,
   so Twój K. keeps visual priority when entering the index. The shadow is
   anchored to the route section, so it naturally scrolls away. */
body.home-v189.home-page .home-routes,
body.home-v189.home-page .home-routes-v155 {
  position: relative !important;
  overflow: hidden !important;
  border-top: 1px solid #000 !important;
}

body.home-v189.home-page .home-routes-v155 > .home-route-grid,
body.home-v189.home-page .home-route-grid {
  position: relative !important;
  row-gap: 1px !important;
  column-gap: 0 !important;
  background: #000 !important;
  border-top: 1px solid #000 !important;
}

body.home-v189.home-page .home-routes-v155::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 120 !important;
  pointer-events: none !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  height: clamp(150px, 22vw, 430px) !important;
  background:
    linear-gradient(180deg,
      rgba(0,0,0,.92) 0%,
      rgba(0,0,0,.76) 15%,
      rgba(0,0,0,.50) 38%,
      rgba(0,0,0,.22) 68%,
      rgba(0,0,0,0) 100%) !important;
}

body.home-v189.home-page .home-routes-v155::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 121 !important;
  pointer-events: none !important;
  left: 50% !important;
  top: 0 !important;
  width: min(340px, 24vw) !important;
  height: 1px !important;
  transform: translateX(-50%) !important;
  background: rgba(0,0,0,.98) !important;
}

body.home-v189.home-page .home-routes-v155 .home-route-card,
body.home-v189.home-page .home-routes-v155 .home-route-motion {
  position: relative !important;
}

body.home-v189.home-page .home-routes-v155 .home-route-digital,
body.home-v189.home-page .home-routes-v155 .home-route-traditional,
body.home-v189.home-page .home-routes-v155 .home-route-explorations {
  margin-top: 0 !important;
}

@media (max-width: 980px) {
  body.home-v189.home-page .home-routes-v155 > .home-route-grid,
  body.home-v189.home-page .home-route-grid {
    row-gap: 0 !important;
  }
  body.home-v189.home-page .home-routes-v155::before,
  body.home-v189.home-page .home-routes-v155::after {
    display: none !important;
    content: none !important;
  }
}


/* v190 — homepage separators: black bars, not hairline dividers.
   Keep this desktop-only; mobile cleanup remains for the final pass. */
body.home-v190.home-page .home-routes,
body.home-v190.home-page .home-routes-v155 {
  --home-v190-row-strip: clamp(44px, 3.2vw, 76px);
  background: #000 !important;
  border-top: 0 !important;
  padding-top: var(--home-v190-row-strip) !important;
}

body.home-v190.home-page .home-routes-v155 > .home-route-grid,
body.home-v190.home-page .home-route-grid {
  row-gap: var(--home-v190-row-strip) !important;
  column-gap: 0 !important;
  background: #000 !important;
  border-top: 0 !important;
}

body.home-v190.home-page .home-routes-v155::before {
  top: 0 !important;
  height: clamp(240px, 28vw, 560px) !important;
  background:
    linear-gradient(180deg,
      rgba(0,0,0,1) 0%,
      rgba(0,0,0,.98) 10%,
      rgba(0,0,0,.82) 28%,
      rgba(0,0,0,.56) 48%,
      rgba(0,0,0,.24) 76%,
      rgba(0,0,0,0) 100%) !important;
}

body.home-v190.home-page .home-routes-v155::after {
  display: none !important;
  content: none !important;
}

@media (max-width: 980px) {
  body.home-v190.home-page .home-routes,
  body.home-v190.home-page .home-routes-v155 {
    padding-top: 0 !important;
  }
  body.home-v190.home-page .home-routes-v155 > .home-route-grid,
  body.home-v190.home-page .home-route-grid {
    row-gap: 0 !important;
  }
  body.home-v190.home-page .home-routes-v155::before,
  body.home-v190.home-page .home-routes-v155::after {
    display: none !important;
    content: none !important;
  }
}


/* v191 — scroll-fading row shadows + slightly heavier lower separator.
   The fixed route-section shadow from v189/v190 is replaced with per-row top
   shadows. Each row starts darker when it enters, then fades out as the row is
   scrolled through. Desktop only; mobile remains for the final pass. */
body.home-v191.home-page .home-routes,
body.home-v191.home-page .home-routes-v155 {
  --home-v191-row-strip: clamp(48px, 3.7vw, 84px);
  --home-v191-lower-row-extra: clamp(20px, 1.4vw, 34px);
  --home-v191-shadow-height: clamp(140px, 16vw, 320px);
  background: #000 !important;
  padding-top: var(--home-v191-row-strip) !important;
  overflow: hidden !important;
}

body.home-v191.home-page .home-routes-v155 > .home-route-grid,
body.home-v191.home-page .home-route-grid {
  row-gap: var(--home-v191-row-strip) !important;
  column-gap: 0 !important;
  background: #000 !important;
}

body.home-v191.home-page .home-routes-v155::before,
body.home-v191.home-page .home-routes-v155::after {
  display: none !important;
  content: none !important;
}

body.home-v191.home-page .home-routes-v155 .home-route-card,
body.home-v191.home-page .home-routes-v155 .home-route-motion {
  position: relative !important;
  --home-card-shadow-opacity: 1;
}

body.home-v191.home-page .home-routes-v155 .home-route-card::before,
body.home-v191.home-page .home-routes-v155 .home-route-motion::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 50 !important;
  pointer-events: none !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  height: var(--home-v191-shadow-height) !important;
  opacity: var(--home-card-shadow-opacity, 1) !important;
  background:
    linear-gradient(180deg,
      rgba(0,0,0,.92) 0%,
      rgba(0,0,0,.76) 14%,
      rgba(0,0,0,.48) 38%,
      rgba(0,0,0,.20) 66%,
      rgba(0,0,0,0) 100%) !important;
  transition: opacity .08s linear !important;
}

body.home-v191.home-page .home-routes-v155 .home-route-digital,
body.home-v191.home-page .home-routes-v155 .home-route-traditional,
body.home-v191.home-page .home-routes-v155 .home-route-explorations {
  margin-top: var(--home-v191-lower-row-extra) !important;
}

body.home-v191.home-page .home-routes-v155 .home-video-title,
body.home-v191.home-page .home-routes-v155 .route-v155-caption-small strong,
body.home-v191.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption-small strong,
body.home-v191.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption-small strong {
  letter-spacing: .34em !important;
  word-spacing: .12em !important;
}

body.home-v191.home-page .home-routes-v155 .home-video-title {
  letter-spacing: .38em !important;
}

@media (max-width: 980px) {
  body.home-v191.home-page .home-routes,
  body.home-v191.home-page .home-routes-v155 {
    padding-top: 0 !important;
  }
  body.home-v191.home-page .home-routes-v155 > .home-route-grid,
  body.home-v191.home-page .home-route-grid {
    row-gap: 0 !important;
  }
  body.home-v191.home-page .home-routes-v155 .home-route-digital,
  body.home-v191.home-page .home-routes-v155 .home-route-traditional,
  body.home-v191.home-page .home-routes-v155 .home-route-explorations {
    margin-top: 0 !important;
  }
  body.home-v191.home-page .home-routes-v155 .home-route-card::before,
  body.home-v191.home-page .home-routes-v155 .home-route-motion::before {
    display: none !important;
    content: none !important;
  }
}


/* v192 — homepage cleanup after v191:
   - no black spacer directly under Twój K.
   - only one fading shadow, attached to the hero -> first-row transition
   - lower cards no longer carry persistent top shadows
   - commercial-row image black bands are cropped away; info strip only slides out on hover
   Desktop-focused; mobile remains for the final pass. */
body.home-v192.home-page .home-routes,
body.home-v192.home-page .home-routes-v155 {
  --home-v192-row-strip: clamp(58px, 4.6vw, 98px);
  --home-top-shadow-opacity: 1;
  position: relative !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  background: #000 !important;
  overflow: hidden !important;
}

body.home-v192.home-page .home-routes-v155 > .home-route-grid,
body.home-v192.home-page .home-route-grid {
  row-gap: var(--home-v192-row-strip) !important;
  column-gap: 0 !important;
  background: #000 !important;
}

body.home-v192.home-page .home-routes-v155::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 125 !important;
  pointer-events: none !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  height: clamp(220px, 30vw, 560px) !important;
  opacity: var(--home-top-shadow-opacity, 1) !important;
  background:
    linear-gradient(180deg,
      rgba(0,0,0,.98) 0%,
      rgba(0,0,0,.90) 12%,
      rgba(0,0,0,.70) 32%,
      rgba(0,0,0,.38) 58%,
      rgba(0,0,0,.14) 80%,
      rgba(0,0,0,0) 100%) !important;
  transition: opacity .06s linear !important;
}

body.home-v192.home-page .home-routes-v155::after {
  display: none !important;
  content: none !important;
}

/* Kill v191 per-tile shadows. The only remaining shadow is the first-row transition above. */
body.home-v192.home-page .home-routes-v155 .home-route-card::before,
body.home-v192.home-page .home-routes-v155 .home-route-motion::before {
  display: none !important;
  content: none !important;
}

/* Keep the commercial cards as actual image tiles, not image + permanent black band. */
body.home-v192.home-page .home-routes-v155 .home-route-game {
  min-height: clamp(330px, 28vw, 560px) !important;
}

body.home-v192.home-page .home-routes-v155 .home-route-sancticide .home-route-cycle-img,
body.home-v192.home-page .home-routes-v155 .home-route-sancticide:hover .home-route-cycle-img,
body.home-v192.home-page .home-routes-v155 .home-route-sancticide.is-switching .home-route-cycle-img {
  object-position: 48% 22% !important;
  transform: scale(1.16) !important;
  transform-origin: center top !important;
}

body.home-v192.home-page .home-routes-v155 .home-route-slavicpunk .home-route-cycle-img,
body.home-v192.home-page .home-routes-v155 .home-route-slavicpunk:hover .home-route-cycle-img,
body.home-v192.home-page .home-routes-v155 .home-route-slavicpunk.is-switching .home-route-cycle-img {
  object-position: 54% 18% !important;
  transform: scale(1.28) !important;
  transform-origin: center top !important;
}

/* Logo stays visible; the black information plate comes out only on hover/focus. */
body.home-v192.home-page .home-routes-v155 .home-route-game .route-v155-caption,
body.home-v192.home-page .home-routes-v155 .home-route-game:hover .route-v155-caption,
body.home-v192.home-page .home-routes-v155 .home-route-game:focus-visible .route-v155-caption {
  z-index: 70 !important;
  bottom: 0 !important;
  padding: clamp(17px, 1.35vw, 28px) clamp(28px, 2.3vw, 50px) clamp(18px, 1.45vw, 30px) !important;
  transform: translate3d(0, calc(100% - clamp(54px, 4.6vw, 84px)), 0) !important;
  transition: transform .34s cubic-bezier(.2,.78,.25,1) !important;
}

body.home-v192.home-page .home-routes-v155 .home-route-game:hover .route-v155-caption,
body.home-v192.home-page .home-routes-v155 .home-route-game:focus-visible .route-v155-caption {
  transform: translate3d(0,0,0) !important;
}

body.home-v192.home-page .home-routes-v155 .home-route-game .route-v155-caption::before {
  background: rgba(0,0,0,.78) !important;
  opacity: 0 !important;
  transform: translate3d(0, 100%, 0) !important;
  transition: transform .34s cubic-bezier(.2,.78,.25,1), opacity .2s ease !important;
}

body.home-v192.home-page .home-routes-v155 .home-route-game:hover .route-v155-caption::before,
body.home-v192.home-page .home-routes-v155 .home-route-game:focus-visible .route-v155-caption::before {
  opacity: 1 !important;
  transform: translate3d(0,0,0) !important;
}

body.home-v192.home-page .home-routes-v155 .home-route-game .route-v155-caption p,
body.home-v192.home-page .home-routes-v155 .home-route-game .route-v155-caption small {
  opacity: 0 !important;
  transform: translate3d(0, 8px, 0) !important;
}

body.home-v192.home-page .home-routes-v155 .home-route-game:hover .route-v155-caption p,
body.home-v192.home-page .home-routes-v155 .home-route-game:hover .route-v155-caption small,
body.home-v192.home-page .home-routes-v155 .home-route-game:focus-visible .route-v155-caption p,
body.home-v192.home-page .home-routes-v155 .home-route-game:focus-visible .route-v155-caption small {
  opacity: 1 !important;
  transform: translate3d(0,0,0) !important;
}

body.home-v192.home-page .home-routes-v155 .home-route-game .route-v155-logo,
body.home-v192.home-page .home-routes-v155 .home-route-game:hover .route-v155-logo,
body.home-v192.home-page .home-routes-v155 .home-route-game:focus-visible .route-v155-logo {
  opacity: 1 !important;
  filter: drop-shadow(0 12px 34px rgba(0,0,0,.86)) !important;
}

/* Slightly cleaner title spacing; keep it readable, not scattered. */
body.home-v192.home-page .home-routes-v155 .home-video-title,
body.home-v192.home-page .home-routes-v155 .route-v155-caption-small strong,
body.home-v192.home-page .home-routes-v155 .home-route-card:hover .route-v155-caption-small strong,
body.home-v192.home-page .home-routes-v155 .home-route-card:focus-visible .route-v155-caption-small strong {
  letter-spacing: .30em !important;
  word-spacing: .10em !important;
}

body.home-v192.home-page .home-routes-v155 .home-video-title {
  letter-spacing: .34em !important;
}

body.home-v192.home-page .home-routes-v155 .home-route-digital,
body.home-v192.home-page .home-routes-v155 .home-route-traditional,
body.home-v192.home-page .home-routes-v155 .home-route-explorations {
  margin-top: 0 !important;
}

@media (max-width: 980px) {
  body.home-v192.home-page .home-routes,
  body.home-v192.home-page .home-routes-v155 {
    padding-top: 0 !important;
  }
  body.home-v192.home-page .home-routes-v155 > .home-route-grid,
  body.home-v192.home-page .home-route-grid {
    row-gap: 0 !important;
  }
  body.home-v192.home-page .home-routes-v155::before,
  body.home-v192.home-page .home-routes-v155::after {
    display: none !important;
    content: none !important;
  }
  body.home-v192.home-page .home-routes-v155 .home-route-sancticide .home-route-cycle-img,
  body.home-v192.home-page .home-routes-v155 .home-route-slavicpunk .home-route-cycle-img {
    transform: none !important;
    object-position: center center !important;
  }
}

/* v192 patch — move the fading hero shadow inside the two commercial tiles so logos stay above it. */
body.home-v192.home-page .home-routes-v155::before {
  display: none !important;
  content: none !important;
}

body.home-v192.home-page .home-routes-v155 .home-route-game::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 50 !important;
  pointer-events: none !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  height: clamp(220px, 30vw, 560px) !important;
  opacity: var(--home-top-shadow-opacity, 1) !important;
  background:
    linear-gradient(180deg,
      rgba(0,0,0,.98) 0%,
      rgba(0,0,0,.90) 12%,
      rgba(0,0,0,.70) 32%,
      rgba(0,0,0,.38) 58%,
      rgba(0,0,0,.14) 80%,
      rgba(0,0,0,0) 100%) !important;
  transition: opacity .06s linear !important;
}

@media (max-width: 980px) {
  body.home-v192.home-page .home-routes-v155 .home-route-game::after {
    display: none !important;
    content: none !important;
  }
}


/* v193 — homepage editorial breathing + labeled black separators.
   Rebuilds the route rhythm without touching mobile: top commercial shadow fades
   on scroll, black breathers become intentional category bars, and game-tile
   info plates stay hidden until hover while logos remain fully visible. */
body.home-v193.home-page .home-routes,
body.home-v193.home-page .home-routes-v155 {
  --home-v193-separator-commercial: clamp(86px, 6.0vw, 132px);
  --home-v193-separator-personal: clamp(104px, 7.2vw, 156px);
  --home-v193-logo-peek: clamp(118px, 7.8vw, 154px);
  background: #000 !important;
  padding-top: 0 !important;
  overflow: hidden !important;
}

body.home-v193.home-page .home-routes-v155 > .home-route-grid,
body.home-v193.home-page .home-route-grid {
  row-gap: 0 !important;
  column-gap: 0 !important;
  background: #000 !important;
}

body.home-v193.home-page .home-row-separator {
  grid-column: 1 / -1 !important;
  position: relative !important;
  z-index: 5 !important;
  display: flex !important;
  align-items: center !important;
  gap: clamp(20px, 2.4vw, 44px) !important;
  box-sizing: border-box !important;
  padding: 0 clamp(30px, 3.2vw, 64px) !important;
  min-height: var(--home-v193-separator-commercial) !important;
  color: rgba(248,246,240,.42) !important;
  background:
    radial-gradient(ellipse 42vw 80% at 50% 50%, rgba(248,246,240,.025), rgba(0,0,0,0) 68%),
    #000 !important;
  border-top: 1px solid rgba(248,246,240,.035) !important;
  border-bottom: 1px solid rgba(248,246,240,.035) !important;
  pointer-events: none !important;
}

body.home-v193.home-page .home-row-separator-personal {
  min-height: var(--home-v193-separator-personal) !important;
}

body.home-v193.home-page .home-row-separator span {
  flex: 0 0 auto !important;
  display: block !important;
  max-width: min(620px, 72vw) !important;
  font: 700 clamp(9px, .64vw, 12px)/1.1 var(--mono) !important;
  letter-spacing: .32em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  text-shadow: 0 10px 28px rgba(0,0,0,.9) !important;
}

body.home-v193.home-page .home-row-separator::after {
  content: "" !important;
  display: block !important;
  flex: 1 1 auto !important;
  height: 1px !important;
  min-width: 80px !important;
  background: linear-gradient(90deg, rgba(248,246,240,.12), rgba(248,246,240,.025), rgba(248,246,240,0)) !important;
}

/* Only the Twój K. -> commercial transition uses a shadow now. It fades through JS. */
body.home-v193.home-page .home-routes-v155 .home-route-game::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 50 !important;
  pointer-events: none !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  height: clamp(220px, 30vw, 560px) !important;
  opacity: var(--home-v193-top-shadow-opacity, 1) !important;
  background:
    linear-gradient(180deg,
      rgba(0,0,0,.98) 0%,
      rgba(0,0,0,.88) 13%,
      rgba(0,0,0,.62) 34%,
      rgba(0,0,0,.30) 61%,
      rgba(0,0,0,.10) 82%,
      rgba(0,0,0,0) 100%) !important;
  transition: opacity .06s linear !important;
}

/* Clean commercial captions: logo visible, black plate appears only on hover/focus. */
body.home-v193.home-page .home-routes-v155 .home-route-game .route-v155-caption,
body.home-v193.home-page .home-routes-v155 .home-route-game:hover .route-v155-caption,
body.home-v193.home-page .home-routes-v155 .home-route-game:focus-visible .route-v155-caption {
  z-index: 70 !important;
  overflow: visible !important;
  border-top: 0 !important;
  background: transparent !important;
  transform: translate3d(0, calc(100% - var(--home-v193-logo-peek)), 0) !important;
  transition: transform .34s cubic-bezier(.2,.78,.25,1) !important;
}

body.home-v193.home-page .home-routes-v155 .home-route-game:hover .route-v155-caption,
body.home-v193.home-page .home-routes-v155 .home-route-game:focus-visible .route-v155-caption {
  transform: translate3d(0, 0, 0) !important;
}

body.home-v193.home-page .home-routes-v155 .home-route-game .route-v155-caption::before {
  background: rgba(0,0,0,.80) !important;
  opacity: 0 !important;
  transform: translate3d(0, 100%, 0) !important;
  transition: transform .34s cubic-bezier(.2,.78,.25,1), opacity .18s ease !important;
}

body.home-v193.home-page .home-routes-v155 .home-route-game:hover .route-v155-caption::before,
body.home-v193.home-page .home-routes-v155 .home-route-game:focus-visible .route-v155-caption::before {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) !important;
}

body.home-v193.home-page .home-routes-v155 .home-route-game .route-v155-logo,
body.home-v193.home-page .home-routes-v155 .home-route-game:hover .route-v155-logo,
body.home-v193.home-page .home-routes-v155 .home-route-game:focus-visible .route-v155-logo {
  display: block !important;
  overflow: visible !important;
  clip-path: none !important;
  max-height: none !important;
  margin-bottom: clamp(12px, 1.05vw, 20px) !important;
  filter: drop-shadow(0 12px 34px rgba(0,0,0,.90)) !important;
}

body.home-v193.home-page .home-routes-v155 .route-v155-logo-slavicpunk,
body.home-v193.home-page .home-routes-v155 .home-route-game:hover .route-v155-logo-slavicpunk,
body.home-v193.home-page .home-routes-v155 .home-route-game:focus-visible .route-v155-logo-slavicpunk {
  max-width: clamp(128px, 12.4vw, 235px) !important;
}

/* Slight vertical crop so source-image dark lower bands stop reading as layout bars. */
body.home-v193.home-page .home-routes-v155 .home-route-sancticide .home-route-cycle-img,
body.home-v193.home-page .home-routes-v155 .home-route-sancticide:hover .home-route-cycle-img,
body.home-v193.home-page .home-routes-v155 .home-route-sancticide.is-switching .home-route-cycle-img {
  object-position: 48% 24% !important;
  transform: scale(1.18) !important;
  transform-origin: center center !important;
}

body.home-v193.home-page .home-routes-v155 .home-route-slavicpunk .home-route-cycle-img,
body.home-v193.home-page .home-routes-v155 .home-route-slavicpunk:hover .home-route-cycle-img,
body.home-v193.home-page .home-routes-v155 .home-route-slavicpunk.is-switching .home-route-cycle-img {
  object-position: 52% 22% !important;
  transform: scale(1.34) !important;
  transform-origin: center center !important;
}

@media (max-width: 980px) {
  body.home-v193.home-page .home-row-separator {
    display: none !important;
  }
  body.home-v193.home-page .home-routes-v155 .home-route-game::after {
    display: none !important;
    content: none !important;
  }
  body.home-v193.home-page .home-routes-v155 .home-route-game .route-v155-caption {
    transform: none !important;
  }
  body.home-v193.home-page .home-routes-v155 .home-route-sancticide .home-route-cycle-img,
  body.home-v193.home-page .home-routes-v155 .home-route-slavicpunk .home-route-cycle-img {
    transform: none !important;
    object-position: center center !important;
  }
}


/* v194 — personal speedpaint player as artwork-first cover, revealed once on hover/click */
body.personal-v194 .personal-motion-panel.personal-motion-player {
  width: min(1280px, calc(100% - clamp(44px, 9vw, 160px)));
  margin: clamp(56px, 7vw, 110px) auto clamp(86px, 8vw, 140px);
  aspect-ratio: auto;
  min-height: 0;
  max-height: none;
  overflow: visible;
  background: transparent;
  isolation: isolate;
}

body.personal-v194 .personal-motion-shell {
  position: relative;
  width: 100%;
  aspect-ratio: 2048 / 877;
  overflow: hidden;
  background: #030303;
  border: 1px solid rgba(255,255,255,.055);
  box-shadow: 0 34px 100px rgba(0,0,0,.54);
}

body.personal-v194 .personal-motion-panel.personal-motion-player .personal-motion-media {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
  opacity: 1;
  display: block;
  pointer-events: auto;
  transform: none;
  background: #000;
}

body.personal-v194 .personal-motion-cover {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: block;
  padding: 0;
  border: 0;
  background: #000;
  color: rgba(255,255,255,.88);
  cursor: pointer;
  text-align: left;
  overflow: hidden;
  transition: opacity .28s ease, visibility .28s ease;
}

body.personal-v194 .personal-motion-cover::before,
body.personal-v194 .personal-motion-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

body.personal-v194 .personal-motion-cover::before {
  z-index: 2;
  background:
    linear-gradient(180deg, rgba(0,0,0,.52), rgba(0,0,0,.04) 42%, rgba(0,0,0,.74) 100%),
    linear-gradient(90deg, rgba(0,0,0,.54), rgba(0,0,0,.05) 46%, rgba(0,0,0,.38) 100%);
}

body.personal-v194 .personal-motion-cover::after {
  z-index: 3;
  border: 1px solid rgba(255,255,255,.07);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.42);
}

body.personal-v194 .personal-motion-cover-img {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
  transform: scale(1.012);
  filter: saturate(.92) contrast(1.06) brightness(.72);
}

body.personal-v194 .personal-motion-cover-copy {
  position: absolute;
  left: clamp(24px, 3.2vw, 54px);
  bottom: clamp(22px, 3vw, 48px);
  z-index: 5;
  display: grid;
  gap: clamp(8px, .8vw, 13px);
  max-width: min(560px, 58%);
  pointer-events: none;
}

body.personal-v194 .personal-motion-cover-kicker,
body.personal-v194 .personal-motion-cover-copy em {
  font-family: var(--font-title, inherit);
  font-style: normal;
  font-size: clamp(8px, .62vw, 11px);
  line-height: 1.35;
  letter-spacing: .34em;
  text-transform: uppercase;
  color: rgba(255,255,255,.58);
}

body.personal-v194 .personal-motion-cover-copy strong {
  font-family: var(--font-title, inherit);
  font-size: clamp(18px, 1.45vw, 28px);
  line-height: 1.05;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-weight: 600;
  color: rgba(255,255,255,.92);
  text-shadow: 0 16px 48px rgba(0,0,0,.8);
}

body.personal-v194 .personal-motion-cover-copy span[data-i18n="personal.motion.desc"] {
  max-width: 540px;
  font-size: clamp(12px, .9vw, 15px);
  line-height: 1.55;
  letter-spacing: .02em;
  color: rgba(255,255,255,.68);
  text-shadow: 0 12px 30px rgba(0,0,0,.78);
}

body.personal-v194 .personal-motion-cover-copy em {
  margin-top: clamp(4px, .7vw, 10px);
  color: rgba(255,255,255,.44);
}

body.personal-v194 .personal-motion-reveal.is-revealed .personal-motion-cover {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

body.personal-v194 .personal-motion-panel.personal-motion-player .personal-motion-poster {
  display: none;
}

@media (max-width: 820px) {
  body.personal-v194 .personal-motion-panel.personal-motion-player {
    width: calc(100% - 32px);
    margin: 56px auto 84px;
  }
  body.personal-v194 .personal-motion-shell {
    aspect-ratio: 16 / 9;
  }
  body.personal-v194 .personal-motion-cover-copy {
    max-width: calc(100% - 44px);
  }
}

/* v195 — personal process video as a clean homepage-style tile + stable archive filters */
body.personal-v195 .pa151-filter-bar {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: clamp(14px, 1.25vw, 26px) !important;
  padding: clamp(28px, 3.4vw, 54px) clamp(42px, 5vw, 92px) clamp(28px, 3vw, 48px) !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

body.personal-v195 .pa151-filter {
  flex: 0 0 auto !important;
  min-width: clamp(132px, 9.6vw, 188px) !important;
  white-space: nowrap !important;
  padding-left: clamp(15px, 1.2vw, 22px) !important;
  padding-right: clamp(15px, 1.2vw, 22px) !important;
}

body.personal-v195 .personal-motion-panel.personal-motion-player {
  position: relative !important;
  width: min(1420px, calc(100% - clamp(44px, 8vw, 150px))) !important;
  margin: clamp(78px, 8.4vw, 150px) auto clamp(96px, 9vw, 165px) !important;
  padding: 0 !important;
  aspect-ratio: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  background: transparent !important;
  isolation: isolate !important;
}

body.personal-v195 .personal-motion-panel.personal-motion-player::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: min(118vw, 1680px) !important;
  height: min(74vw, 960px) !important;
  transform: translate3d(-50%, -48%, 0) !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(ellipse at 48% 45%, rgba(126, 176, 198, .115) 0%, rgba(126, 176, 198, .055) 23%, rgba(0,0,0,0) 58%),
    radial-gradient(ellipse at 56% 58%, rgba(243, 240, 232, .045) 0%, rgba(0,0,0,0) 48%) !important;
  filter: blur(1px) !important;
}

body.personal-v195 .personal-motion-heading {
  width: min(1180px, 100%) !important;
  margin: 0 auto clamp(18px, 1.8vw, 30px) !important;
  padding-left: clamp(4px, .8vw, 16px) !important;
  box-sizing: border-box !important;
}

body.personal-v195 .personal-motion-eyebrow {
  margin: 0 0 clamp(8px, .8vw, 13px) !important;
  font-family: var(--font-title, inherit) !important;
  font-size: clamp(8px, .58vw, 11px) !important;
  line-height: 1.25 !important;
  letter-spacing: .34em !important;
  text-transform: uppercase !important;
  color: rgba(243,240,232,.40) !important;
}

body.personal-v195 .personal-motion-heading h2 {
  margin: 0 !important;
  font-family: var(--font-title, inherit) !important;
  font-size: clamp(19px, 1.45vw, 31px) !important;
  line-height: 1.05 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: rgba(243,240,232,.84) !important;
  text-shadow: 0 18px 55px rgba(0,0,0,.72) !important;
}

body.personal-v195 .personal-motion-shell {
  position: relative !important;
  width: min(1240px, 100%) !important;
  margin: 0 auto !important;
  aspect-ratio: 2048 / 877 !important;
  overflow: hidden !important;
  background: #030303 !important;
  border: 1px solid rgba(255,255,255,.065) !important;
  box-shadow: 0 34px 110px rgba(0,0,0,.62), 0 0 110px rgba(123,165,180,.055) !important;
}

body.personal-v195 .personal-motion-panel.personal-motion-player .personal-motion-media {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  background: #000 !important;
}

body.personal-v195 .personal-motion-cover {
  position: absolute !important;
  inset: 0 !important;
  z-index: 4 !important;
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  background: #000 !important;
  color: rgba(255,255,255,.86) !important;
  cursor: pointer !important;
  overflow: hidden !important;
  text-align: left !important;
  transition: opacity .24s ease, visibility .24s ease !important;
}

body.personal-v195 .personal-motion-cover::before,
body.personal-v195 .personal-motion-cover::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
}

body.personal-v195 .personal-motion-cover::before {
  z-index: 2 !important;
  background:
    linear-gradient(180deg, rgba(0,0,0,.16), rgba(0,0,0,0) 34%, rgba(0,0,0,.44) 100%),
    linear-gradient(90deg, rgba(0,0,0,.22), rgba(0,0,0,0) 42%, rgba(0,0,0,.18) 100%) !important;
}

body.personal-v195 .personal-motion-cover::after {
  z-index: 3 !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.46) !important;
}

body.personal-v195 .personal-motion-cover-img {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center center !important;
  transform: scale(1.006) !important;
  filter: saturate(.94) contrast(1.05) brightness(.82) !important;
}

body.personal-v195 .personal-motion-cover-copy {
  position: absolute !important;
  right: clamp(22px, 2.8vw, 48px) !important;
  bottom: clamp(19px, 2.2vw, 38px) !important;
  left: auto !important;
  z-index: 5 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  max-width: none !important;
  padding: clamp(11px, .95vw, 16px) clamp(14px, 1.2vw, 22px) !important;
  border: 1px solid rgba(243,240,232,.24) !important;
  border-radius: 999px !important;
  background: rgba(0,0,0,.38) !important;
  backdrop-filter: blur(3px) !important;
  -webkit-backdrop-filter: blur(3px) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.46) !important;
  pointer-events: none !important;
}

body.personal-v195 .personal-motion-cover-copy span {
  font-family: var(--font-title, inherit) !important;
  font-size: clamp(8px, .58vw, 11px) !important;
  line-height: 1 !important;
  letter-spacing: .26em !important;
  text-transform: uppercase !important;
  color: rgba(243,240,232,.72) !important;
  white-space: nowrap !important;
}

body.personal-v195 .personal-motion-reveal.is-revealed .personal-motion-cover {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.personal-v195 .personal-motion-description {
  width: min(1000px, 100%) !important;
  margin: clamp(18px, 1.65vw, 28px) auto 0 !important;
  padding-left: clamp(4px, .8vw, 16px) !important;
  box-sizing: border-box !important;
  font-size: clamp(12px, .85vw, 15px) !important;
  line-height: 1.65 !important;
  letter-spacing: .035em !important;
  color: rgba(243,240,232,.56) !important;
}

@media (max-width: 980px) {
  body.personal-v195 .pa151-filter-bar {
    justify-content: flex-start !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
  body.personal-v195 .pa151-filter-bar::-webkit-scrollbar { display: none !important; }
  body.personal-v195 .pa151-filter { min-width: auto !important; }
}

@media (max-width: 820px) {
  body.personal-v195 .personal-motion-panel.personal-motion-player {
    width: calc(100% - 32px) !important;
    margin: 56px auto 84px !important;
  }
  body.personal-v195 .personal-motion-shell {
    aspect-ratio: 16 / 9 !important;
  }
  body.personal-v195 .personal-motion-heading,
  body.personal-v195 .personal-motion-description {
    padding-left: 0 !important;
  }
}

/* v196 — Personal Work process video cleanup: finished image first, hover autoplay, stronger editorial framing. */
body.personal-v196 .personal-motion-panel.personal-motion-player {
  position: relative !important;
  width: min(1500px, calc(100% - clamp(52px, 8vw, 160px))) !important;
  margin: clamp(78px, 7.4vw, 132px) auto clamp(110px, 8.2vw, 165px) !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  isolation: isolate !important;
}

body.personal-v196 .personal-motion-panel.personal-motion-player::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: min(116vw, 1760px) !important;
  height: min(68vw, 880px) !important;
  transform: translate3d(-50%, -46%, 0) !important;
  z-index: -2 !important;
  pointer-events: none !important;
  background:
    radial-gradient(ellipse at 50% 45%, rgba(115, 170, 188, .105) 0%, rgba(115, 170, 188, .052) 24%, rgba(0,0,0,0) 60%),
    radial-gradient(ellipse at 54% 62%, rgba(246, 236, 220, .04) 0%, rgba(0,0,0,0) 48%) !important;
  filter: blur(1px) !important;
}

body.personal-v196 .personal-motion-heading {
  width: min(1320px, 100%) !important;
  margin: 0 auto clamp(20px, 1.6vw, 32px) !important;
  padding-left: clamp(2px, .55vw, 12px) !important;
  box-sizing: border-box !important;
}

body.personal-v196 .personal-motion-eyebrow {
  margin: 0 0 clamp(8px, .75vw, 13px) !important;
  font-family: var(--font-title, inherit) !important;
  font-size: clamp(8px, .55vw, 10px) !important;
  line-height: 1.2 !important;
  letter-spacing: .34em !important;
  text-transform: uppercase !important;
  color: rgba(243,240,232,.38) !important;
}

body.personal-v196 .personal-motion-heading h2 {
  margin: 0 !important;
  font-family: var(--font-title, inherit) !important;
  font-size: clamp(22px, 1.72vw, 38px) !important;
  line-height: 1 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: rgba(243,240,232,.86) !important;
  text-shadow: 0 20px 64px rgba(0,0,0,.76) !important;
}

body.personal-v196 .personal-motion-shell {
  position: relative !important;
  width: min(1320px, 100%) !important;
  margin: 0 auto !important;
  aspect-ratio: 2048 / 877 !important;
  overflow: hidden !important;
  background: #030303 !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  box-shadow: 0 36px 120px rgba(0,0,0,.68), 0 0 120px rgba(110,160,176,.06) !important;
}

body.personal-v196 .personal-motion-panel.personal-motion-player .personal-motion-media {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center center !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  background: #000 !important;
}

body.personal-v196 .personal-motion-cover {
  position: absolute !important;
  inset: 0 !important;
  z-index: 5 !important;
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  background: #000 !important;
  color: rgba(255,255,255,.86) !important;
  cursor: pointer !important;
  overflow: hidden !important;
  text-align: left !important;
  transition: opacity .34s ease, visibility .34s ease, transform .34s ease !important;
}

body.personal-v196 .personal-motion-cover::before,
body.personal-v196 .personal-motion-cover::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
}

body.personal-v196 .personal-motion-cover::before {
  z-index: 2 !important;
  background:
    linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,0) 36%, rgba(0,0,0,.50) 100%),
    linear-gradient(90deg, rgba(0,0,0,.18), rgba(0,0,0,0) 48%, rgba(0,0,0,.18) 100%) !important;
}

body.personal-v196 .personal-motion-cover::after {
  z-index: 3 !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.07), inset 0 -90px 120px rgba(0,0,0,.32) !important;
}

body.personal-v196 .personal-motion-cover-img {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center center !important;
  transform: scale(1.006) !important;
  filter: saturate(.96) contrast(1.04) brightness(.82) !important;
  transition: transform .45s ease, filter .45s ease !important;
}

body.personal-v196 .personal-motion-reveal:hover .personal-motion-cover-img,
body.personal-v196 .personal-motion-cover:focus-visible .personal-motion-cover-img {
  transform: scale(1.018) !important;
  filter: saturate(.98) contrast(1.055) brightness(.88) !important;
}

body.personal-v196 .personal-motion-cover-copy {
  position: absolute !important;
  right: clamp(22px, 2.6vw, 48px) !important;
  bottom: clamp(20px, 2.2vw, 40px) !important;
  left: auto !important;
  z-index: 6 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: clamp(11px, .9vw, 15px) clamp(15px, 1.15vw, 22px) !important;
  border: 1px solid rgba(243,240,232,.23) !important;
  border-radius: 999px !important;
  background: rgba(0,0,0,.36) !important;
  backdrop-filter: blur(3px) !important;
  -webkit-backdrop-filter: blur(3px) !important;
  box-shadow: 0 18px 54px rgba(0,0,0,.48) !important;
  pointer-events: none !important;
}

body.personal-v196 .personal-motion-cover-copy span {
  font-family: var(--font-title, inherit) !important;
  font-size: clamp(8px, .55vw, 10px) !important;
  line-height: 1 !important;
  letter-spacing: .28em !important;
  text-transform: uppercase !important;
  color: rgba(243,240,232,.76) !important;
  white-space: nowrap !important;
}

body.personal-v196 .personal-motion-reveal.is-revealed .personal-motion-cover {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: scale(1.01) !important;
}

body.personal-v196 .personal-motion-description {
  width: min(1120px, 100%) !important;
  margin: clamp(18px, 1.55vw, 28px) auto 0 !important;
  padding-left: clamp(2px, .55vw, 12px) !important;
  box-sizing: border-box !important;
  font-size: clamp(12px, .78vw, 14px) !important;
  line-height: 1.62 !important;
  letter-spacing: .035em !important;
  color: rgba(243,240,232,.50) !important;
}

@media (max-width: 820px) {
  body.personal-v196 .personal-motion-panel.personal-motion-player {
    width: calc(100% - 32px) !important;
    margin: 56px auto 84px !important;
  }
  body.personal-v196 .personal-motion-shell {
    aspect-ratio: 16 / 9 !important;
  }
  body.personal-v196 .personal-motion-heading,
  body.personal-v196 .personal-motion-description {
    padding-left: 0 !important;
  }
}


/* v197 — Personal Work process video: clean finished-image cover, larger scale, left-aligned copy, subtle image glow. */
body.personal-v197 .personal-motion-panel.personal-motion-player {
  width: min(1800px, calc(100% - clamp(36px, 5.2vw, 110px))) !important;
  margin: clamp(78px, 7.2vw, 128px) auto clamp(118px, 8.4vw, 170px) !important;
  isolation: isolate !important;
}

body.personal-v197 .personal-motion-panel.personal-motion-player::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 54% !important;
  width: min(128vw, 2050px) !important;
  height: min(72vw, 980px) !important;
  transform: translate3d(-50%, -50%, 0) !important;
  z-index: -2 !important;
  pointer-events: none !important;
  background:
    radial-gradient(ellipse at 50% 48%, rgba(126, 174, 190, .145) 0%, rgba(126, 174, 190, .072) 25%, rgba(0,0,0,0) 62%),
    radial-gradient(ellipse at 46% 54%, rgba(239, 231, 213, .055) 0%, rgba(0,0,0,0) 46%) !important;
  filter: blur(2px) !important;
}

body.personal-v197 .personal-motion-heading {
  width: min(1584px, 100%) !important;
  margin: 0 auto clamp(20px, 1.6vw, 32px) !important;
  padding-left: 0 !important;
}

body.personal-v197 .personal-motion-shell {
  width: min(1584px, 100%) !important;
  box-shadow:
    0 38px 120px rgba(0,0,0,.58),
    0 0 150px rgba(126,174,190,.085) !important;
}

body.personal-v197 .personal-motion-cover::before {
  background: none !important;
}

body.personal-v197 .personal-motion-cover::after {
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.07) !important;
}

body.personal-v197 .personal-motion-cover-img {
  filter: none !important;
  transform: scale(1) !important;
}

body.personal-v197 .personal-motion-reveal:hover .personal-motion-cover-img,
body.personal-v197 .personal-motion-cover:focus-visible .personal-motion-cover-img {
  filter: none !important;
  transform: scale(1.012) !important;
}

body.personal-v197 .personal-motion-cover-copy {
  background: rgba(0,0,0,.26) !important;
  border-color: rgba(243,240,232,.18) !important;
}

body.personal-v197 .personal-motion-description {
  width: min(1584px, 100%) !important;
  margin: clamp(18px, 1.55vw, 28px) auto 0 !important;
  padding-left: 0 !important;
  text-align: left !important;
}

@media (max-width: 820px) {
  body.personal-v197 .personal-motion-panel.personal-motion-player {
    width: calc(100% - 32px) !important;
  }
}


/* v198 — stronger image-led glow behind the process video + stable filter button row. */
body.personal-v198 .pa151-filter-bar {
  display: grid !important;
  grid-template-columns: repeat(4, max-content) !important;
  justify-content: center !important;
  align-items: center !important;
  column-gap: clamp(14px, 1.25vw, 28px) !important;
  row-gap: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
  box-sizing: border-box !important;
  padding: clamp(30px, 3.35vw, 56px) clamp(34px, 4vw, 80px) clamp(30px, 3vw, 50px) !important;
  overflow: visible !important;
}

body.personal-v198 .pa151-filter {
  min-width: clamp(130px, 9.4vw, 184px) !important;
  height: clamp(31px, 2.2vw, 38px) !important;
  white-space: nowrap !important;
}

body.personal-v198 .personal-motion-panel.personal-motion-player {
  position: relative !important;
  width: min(1800px, calc(100% - clamp(36px, 5.2vw, 110px))) !important;
  margin: clamp(66px, 6.2vw, 112px) auto clamp(126px, 8.8vw, 184px) !important;
  padding: clamp(24px, 2.2vw, 42px) 0 clamp(28px, 2.6vw, 52px) !important;
  overflow: visible !important;
  isolation: isolate !important;
}

body.personal-v198 .personal-motion-panel.personal-motion-player::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 55% !important;
  width: min(132vw, 2200px) !important;
  height: min(82vw, 1160px) !important;
  transform: translate3d(-50%, -50%, 0) !important;
  z-index: -3 !important;
  pointer-events: none !important;
  background:
    radial-gradient(ellipse at 50% 48%, rgba(128, 184, 203, .30) 0%, rgba(128, 184, 203, .19) 21%, rgba(72, 112, 126, .075) 43%, rgba(0,0,0,0) 72%),
    radial-gradient(ellipse at 42% 58%, rgba(236, 230, 212, .13) 0%, rgba(176, 166, 142, .055) 28%, rgba(0,0,0,0) 58%),
    radial-gradient(ellipse at 68% 54%, rgba(49, 86, 96, .18) 0%, rgba(32, 54, 62, .06) 38%, rgba(0,0,0,0) 68%) !important;
  filter: blur(18px) !important;
  opacity: 1 !important;
}

body.personal-v198 .personal-motion-panel.personal-motion-player::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 54% !important;
  width: min(100vw, 1760px) !important;
  height: min(46vw, 650px) !important;
  transform: translate3d(-50%, -46%, 0) !important;
  z-index: -2 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(22, 38, 43, .34) 17%, rgba(72, 107, 118, .18) 50%, rgba(22, 38, 43, .28) 83%, rgba(0,0,0,0) 100%),
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(8, 12, 13, .18) 25%, rgba(0,0,0,0) 100%) !important;
  opacity: .95 !important;
}

body.personal-v198 .personal-motion-heading {
  width: min(1584px, 100%) !important;
  margin: 0 auto clamp(22px, 1.7vw, 34px) !important;
  padding-left: 0 !important;
  position: relative !important;
  z-index: 2 !important;
}

body.personal-v198 .personal-motion-eyebrow {
  color: rgba(243,240,232,.47) !important;
}

body.personal-v198 .personal-motion-heading h2 {
  color: rgba(243,240,232,.9) !important;
}

body.personal-v198 .personal-motion-shell {
  width: min(1584px, 100%) !important;
  position: relative !important;
  z-index: 2 !important;
  box-shadow:
    0 44px 140px rgba(0,0,0,.64),
    0 0 0 1px rgba(255,255,255,.052),
    0 0 190px rgba(118,176,196,.18),
    0 0 320px rgba(73,112,126,.10) !important;
}

body.personal-v198 .personal-motion-description {
  width: min(1584px, 100%) !important;
  margin: clamp(18px, 1.55vw, 28px) auto 0 !important;
  padding-left: 0 !important;
  text-align: left !important;
  color: rgba(243,240,232,.58) !important;
  position: relative !important;
  z-index: 2 !important;
}

@media (max-width: 980px) {
  body.personal-v198 .pa151-filter-bar {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
  body.personal-v198 .pa151-filter-bar::-webkit-scrollbar { display: none !important; }
  body.personal-v198 .pa151-filter { min-width: auto !important; flex: 0 0 auto !important; }
}


/* v200 — Personal Work: force archive filter buttons into one straight row + smaller Sancticide key art. */
body.personal-v200 .pa151-filter-bar,
body.personal-v200 #personal-archive .pa151-filter-bar {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  justify-content: center !important;
  align-items: center !important;
  align-content: center !important;
  gap: clamp(12px, 1vw, 20px) !important;
  width: 100vw !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 calc(50% - 50vw) !important;
  padding: clamp(34px, 3.35vw, 58px) clamp(22px, 3.2vw, 72px) clamp(34px, 3vw, 52px) !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  white-space: nowrap !important;
  grid-template-columns: none !important;
}

body.personal-v200 .pa151-filter-bar .pa151-filter,
body.personal-v200 #personal-archive .pa151-filter-bar .pa151-filter {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: clamp(30px, 2vw, 36px) !important;
  padding: 0 clamp(18px, 1.35vw, 26px) !important;
  margin: 0 !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}

body.personal-v200 .pa151-filter.is-active::before {
  display: none !important;
  content: none !important;
}

body.works-v200 #sancticide .sancticide-v173-layout > figure.commercial-v173-full[data-title="Sancticide Key Art"] {
  width: min(620px, 46vw) !important;
  max-width: min(620px, 100%) !important;
  grid-column: 1 / -1 !important;
  justify-self: center !important;
  margin: clamp(10px, 1vw, 18px) auto clamp(28px, 3vw, 54px) !important;
}

body.works-v200 #sancticide .sancticide-v173-layout > figure.commercial-v173-full[data-title="Sancticide Key Art"] img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}

@media (max-width: 760px) {
  body.personal-v200 .pa151-filter-bar,
  body.personal-v200 #personal-archive .pa151-filter-bar {
    justify-content: flex-start !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
  body.personal-v200 .pa151-filter-bar::-webkit-scrollbar { display: none !important; }
  body.works-v200 #sancticide .sancticide-v173-layout > figure.commercial-v173-full[data-title="Sancticide Key Art"] {
    width: min(420px, calc(100vw - 34px)) !important;
    max-width: calc(100vw - 34px) !important;
  }
}

/* v201 — homepage MJ Explorations motion tile: poster first, hover video, no player. */
body.home-v201.home-page .home-routes-v155 .home-route-mj-feature {
  position: relative !important;
  overflow: hidden !important;
  background: #000 !important;
  isolation: isolate !important;
}

body.home-v201.home-page .home-routes-v155 .home-route-mj-feature .home-video-poster,
body.home-v201.home-page .home-routes-v155 .home-route-mj-feature .home-video-media {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  display: block !important;
  object-fit: cover !important;
  object-position: 50% 38% !important;
  transform: none !important;
  filter: none !important;
}

body.home-v201.home-page .home-routes-v155 .home-route-mj-feature .home-video-poster {
  z-index: 1 !important;
  opacity: 1 !important;
}

body.home-v201.home-page .home-routes-v155 .home-route-mj-feature .home-video-media {
  z-index: 2 !important;
  opacity: 0 !important;
  transition: opacity .16s linear !important;
  pointer-events: none !important;
}

body.home-v201.home-page .home-routes-v155 .home-route-mj-feature.is-playing .home-video-media,
body.home-v201.home-page .home-routes-v155 .home-route-mj-feature:hover .home-video-media,
body.home-v201.home-page .home-routes-v155 .home-route-mj-feature:focus-visible .home-video-media {
  opacity: 1 !important;
}

body.home-v201.home-page .home-routes-v155 .home-route-mj-feature .route-v155-caption-mj-feature {
  z-index: 80 !important;
}

body.home-v201.home-page .home-routes-v155 .home-route-mj-feature::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 4 !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,0) 38%, rgba(0,0,0,.30) 100%),
    linear-gradient(90deg, rgba(0,0,0,.10), rgba(0,0,0,0) 42%, rgba(0,0,0,.18) 100%) !important;
}


/* v202 splash intro */
.site-splash {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 50% 46%, rgba(255,255,255,.035), rgba(255,255,255,0) 42%),
    #030303;
  color: #fff;
  pointer-events: auto;
  opacity: 1;
  transform: translateZ(0);
  transition: opacity .58s ease, visibility .58s ease;
}
.site-splash::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background-image: url("assets/_shared/noise-sharp.png");
  background-size: 320px 320px;
  mix-blend-mode: screen;
}
.site-splash.is-exiting {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.site-splash-inner {
  position: relative;
  z-index: 1;
  width: min(78vw, 1240px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(14px, 2.1vw, 28px);
  opacity: 0;
  transform: translateY(10px) scale(.992);
  animation: siteSplashIn .72s cubic-bezier(.16,1,.3,1) .12s forwards;
}
.site-splash-logo {
  display: block;
  width: 100%;
  height: auto;
  max-height: min(34vh, 330px);
  object-fit: contain;
  filter: drop-shadow(0 0 38px rgba(255,255,255,.035));
}
.site-splash-caption {
  margin: 0;
  max-width: 72ch;
  font-family: inherit;
  font-size: clamp(9px, .86vw, 12px);
  line-height: 1.55;
  letter-spacing: .28em;
  text-transform: uppercase;
  text-align: center;
  color: rgba(255,255,255,.66);
  font-weight: 600;
}
@keyframes siteSplashIn {
  from { opacity: 0; transform: translateY(10px) scale(.992); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@media (max-width: 720px) {
  .site-splash-inner {
    width: min(88vw, 540px);
    gap: 14px;
  }
  .site-splash-logo {
    max-height: 30vh;
  }
  .site-splash-caption {
    font-size: 8.5px;
    letter-spacing: .18em;
  }
}
@media (prefers-reduced-motion: reduce) {
  .site-splash,
  .site-splash-inner {
    transition: none;
    animation: none;
    opacity: 1;
    transform: none;
  }
}


/* v203 — splash intro with centered identity card + nav logo replacement */
.site-header .brand.brand-logo-link {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
  margin-right: 0;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
}
.site-header .brand-logo-img {
  display: block;
  height: clamp(22px, 2.05vw, 31px);
  width: auto;
  max-width: min(39vw, 235px);
  object-fit: contain;
  opacity: .94;
}
.site-header .brand.brand-logo-link::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  margin-left: clamp(16px, 2vw, 30px);
  transform: translateY(0);
  background: rgba(243,240,232,.20);
  flex: 0 0 auto;
}
.site-header .brand.brand-logo-link:hover .brand-logo-img {
  opacity: 1;
}

.site-splash {
  background: rgba(0,0,0,.90);
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
}
.site-splash::after {
  opacity: .15;
  mix-blend-mode: screen;
}
.site-splash-inner {
  width: min(86vw, 900px);
  gap: 0;
}
.site-splash-logo {
  width: clamp(300px, 48vw, 700px);
  max-width: 86vw;
  max-height: min(54vh, 580px);
  object-fit: contain;
  filter: drop-shadow(0 0 34px rgba(255,255,255,.035));
}
.site-splash-copy {
  margin-top: clamp(28px, 4.2vh, 56px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(8px, 1.1vh, 13px);
  text-align: center;
}
.site-splash-caption {
  margin: 0;
  font-family: var(--mono);
  font-size: clamp(9px, .78vw, 12px);
  line-height: 1.45;
  letter-spacing: .30em;
  text-transform: uppercase;
  color: rgba(243,240,232,.74);
  font-weight: 500;
}
.site-splash-subcaption {
  margin: 0;
  font-family: var(--mono);
  font-size: clamp(8px, .62vw, 10px);
  line-height: 1.45;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: rgba(243,240,232,.43);
  font-weight: 500;
}
@media (max-width: 900px) {
  .site-header .brand-logo-img {
    height: 22px;
    max-width: 180px;
  }
}
@media (max-width: 720px) {
  .site-header .brand.brand-logo-link::after { display: none; }
  .site-header .brand-logo-img {
    height: 19px;
    max-width: 148px;
  }
  .site-splash-logo {
    width: min(82vw, 440px);
    max-height: 48vh;
  }
  .site-splash-copy {
    margin-top: 26px;
    gap: 8px;
  }
  .site-splash-caption {
    font-size: 8px;
    letter-spacing: .20em;
  }
  .site-splash-subcaption {
    font-size: 7.5px;
    letter-spacing: .16em;
  }
}


/* v204 — corrected splash: pure black overlay, smaller centered logo, readable description, manual enter only */
html.jm-splash-seen .site-splash {
  display: none !important;
}
.site-splash {
  background: rgba(0,0,0,.92) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.site-splash::after {
  display: none !important;
  content: none !important;
  background: none !important;
}
.site-splash-inner {
  width: min(78vw, 620px) !important;
  gap: 0 !important;
  padding: 0 !important;
}
.site-splash-logo {
  width: clamp(230px, 28vw, 420px) !important;
  max-width: min(76vw, 420px) !important;
  max-height: 36vh !important;
  object-fit: contain !important;
  filter: none !important;
}
.site-splash-copy {
  margin-top: clamp(54px, 7vh, 86px) !important;
  max-width: min(78vw, 520px) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: clamp(22px, 3.2vh, 34px) !important;
  text-align: center !important;
}
.site-splash-description {
  margin: 0 !important;
  font-family: var(--sans, inherit) !important;
  font-size: clamp(12px, .9vw, 15px) !important;
  line-height: 1.75 !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
  color: rgba(243,240,232,.70) !important;
  font-weight: 400 !important;
}
.site-splash-caption,
.site-splash-subcaption {
  display: none !important;
}
.site-splash-enter {
  appearance: none !important;
  border: 1px solid rgba(243,240,232,.32) !important;
  border-radius: 999px !important;
  background: rgba(0,0,0,.12) !important;
  color: rgba(243,240,232,.82) !important;
  font-family: var(--mono, inherit) !important;
  font-size: 10px !important;
  line-height: 1 !important;
  letter-spacing: .28em !important;
  text-transform: uppercase !important;
  padding: 13px 23px 12px 25px !important;
  cursor: pointer !important;
  transition: border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease !important;
}
.site-splash-enter:hover,
.site-splash-enter:focus-visible {
  border-color: rgba(243,240,232,.68) !important;
  color: #fff !important;
  background: rgba(255,255,255,.04) !important;
  outline: none !important;
  transform: translateY(-1px) !important;
}
.site-splash.is-exiting {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
@media (max-width: 720px) {
  .site-splash-inner {
    width: min(86vw, 440px) !important;
  }
  .site-splash-logo {
    width: min(64vw, 320px) !important;
    max-height: 32vh !important;
  }
  .site-splash-copy {
    margin-top: 44px !important;
    gap: 22px !important;
  }
  .site-splash-description {
    font-size: 12px !important;
    line-height: 1.65 !important;
  }
}


/* v205 — black splash, smaller mark, more breathing room, delayed enter */
.site-splash {
  background: #000 !important;
  cursor: pointer !important;
}
.site-splash-inner {
  width: min(86vw, 760px) !important;
  gap: 0 !important;
  padding: 0 !important;
}
.site-splash-logo {
  width: clamp(112px, 12vw, 185px) !important;
  max-width: min(54vw, 185px) !important;
  max-height: 22vh !important;
  object-fit: contain !important;
}
.site-splash-copy {
  margin-top: clamp(92px, 12vh, 150px) !important;
  max-width: min(82vw, 690px) !important;
  gap: clamp(38px, 5vh, 58px) !important;
}
.site-splash-description {
  max-width: 690px !important;
  font-size: clamp(12px, .82vw, 14px) !important;
  line-height: 1.85 !important;
  letter-spacing: .015em !important;
  color: rgba(243,240,232,.66) !important;
}
.site-splash-enter {
  opacity: 0 !important;
  transform: translateY(8px) !important;
  pointer-events: none !important;
  transition: opacity .55s ease, transform .55s ease, border-color .18s ease, color .18s ease, background .18s ease !important;
}
.site-splash.is-ready .site-splash-enter {
  opacity: 1 !important;
  transform: translateY(0) !important;
  pointer-events: auto !important;
}
.site-splash.is-ready .site-splash-enter:hover,
.site-splash.is-ready .site-splash-enter:focus-visible {
  transform: translateY(-1px) !important;
}
@media (max-width: 720px) {
  .site-splash-logo {
    width: min(38vw, 150px) !important;
    max-width: min(44vw, 150px) !important;
    max-height: 20vh !important;
  }
  .site-splash-copy {
    margin-top: clamp(74px, 10vh, 110px) !important;
    max-width: min(84vw, 520px) !important;
    gap: 34px !important;
  }
  .site-splash-description {
    font-size: 11.5px !important;
    line-height: 1.75 !important;
  }
}

/* v207 — same Home/logo hover drift on all pages */
.site-header .brand.brand-logo-link {
  transition: color .35s ease, transform .35s ease, opacity .35s ease !important;
  will-change: transform;
}
.site-header .brand.brand-logo-link:hover,
.site-header .brand.brand-logo-link:focus-visible {
  color: rgba(243,240,232,.95) !important;
  transform: translateX(-3px) !important;
  outline: none;
}
.site-header .brand.brand-logo-link:hover .brand-logo-img,
.site-header .brand.brand-logo-link:focus-visible .brand-logo-img {
  opacity: 1 !important;
}




/* v234 — same CRT-first ignition, with CRT layer saturation reduced by about 50%. */
html.opener-pending,
html.opener-pending body,
body.is-opener-visible {
  overflow: hidden;
}

.portfolio-opener {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: none;
  overflow: hidden;
  cursor: pointer;
  isolation: isolate;
  color: #fff;
  background: transparent;
  --curtain-peek: clamp(24px, 4vh, 48px);
  font-family: "Manrope", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html.opener-pending .portfolio-opener { display: block; }
.portfolio-opener[hidden] { display: none !important; }

.portfolio-opener::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: #000;
  transform: translateY(0);
  transition: transform .62s cubic-bezier(.18,.86,.16,1);
  will-change: transform;
}

.portfolio-opener::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  z-index: 1;
  height: 1px;
  opacity: 0;
  background: linear-gradient(90deg, transparent 8%, rgba(255,255,255,.10) 30%, rgba(255,255,255,.22) 50%, rgba(255,255,255,.10) 70%, transparent 92%);
  box-shadow: 0 0 18px rgba(255,255,255,.08);
  transition: bottom .62s cubic-bezier(.18,.86,.16,1), opacity .28s ease;
  pointer-events: none;
}

.portfolio-opener.is-enter-hovering::before { transform: translateY(calc(var(--curtain-peek) * -1)); }
.portfolio-opener.is-enter-hovering::after { bottom: var(--curtain-peek); opacity: 1; }

.opener-ambient { display: none; }

.opener-composition {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  width: min(76vw, 780px);
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(30px, 3.8vh, 42px);
  pointer-events: none;
}

.opener-stage {
  position: relative;
  z-index: 2;
  width: clamp(350px, 25.5vw, 470px);
  aspect-ratio: 1316 / 1118;
  transform: translateX(clamp(8px, 1.4vw, 24px));
  pointer-events: none;
}

.opener-figure {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  transform: translateZ(0);
  will-change: opacity, filter, transform;
}

.opener-figure-main {
  z-index: 1;
  opacity: 1;
  filter:
    drop-shadow(0 0 2.4px rgba(255,255,255,.52))
    drop-shadow(0 0 14px rgba(255,255,255,.16))
    drop-shadow(0 0 34px rgba(255,255,255,.05));
  animation: openerIgniteBase 2.05s linear both;
}

.opener-figure-crt {
  z-index: 2;
  opacity: .72;
  mix-blend-mode: screen;
  filter:
    drop-shadow(0 0 2px rgba(112,154,212,.34))
    drop-shadow(0 0 12px rgba(164,118,212,.16))
    drop-shadow(0 0 28px rgba(90,145,200,.09));
  animation: openerIgniteCrt 2.05s linear both, openerCrtDrift 5.8s ease-in-out 2.05s infinite alternate;
}

.opener-lower {
  position: relative;
  z-index: 3;
  width: min(74vw, 740px);
  display: grid;
  grid-template-columns: clamp(130px, 8.4vw, 158px) minmax(420px, 660px);
  align-items: center;
  justify-content: center;
  column-gap: clamp(34px, 3.0vw, 52px);
  opacity: 0;
  transform: translateY(6px);
  animation: openerLowerReveal .52s cubic-bezier(.2,.8,.2,1) 2.12s forwards;
  pointer-events: none;
}

.opener-logo {
  width: clamp(130px, 8.2vw, 158px);
  height: auto;
  justify-self: end;
  pointer-events: none;
  filter: none;
}

.opener-copy {
  max-width: 600px;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-family: "Manrope", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.opener-copy p,
.opener-enter {
  color: transparent;
  background-image: url("assets/opener/opener-text-grain.png");
  background-size: 132px 132px;
  background-position: center;
  -webkit-background-clip: text;
  background-clip: text;
}

.opener-description {
  margin: 0;
  font-size: clamp(11px, .72vw, 13.2px);
  font-weight: 550;
  letter-spacing: .015em;
  line-height: 1.55;
  text-transform: none;
  max-width: 660px;
}
.opener-description .nowrap { white-space: nowrap; }

.opener-enter-zone {
  position: absolute;
  z-index: 4;
  left: 0;
  right: 0;
  bottom: 0;
  height: 34vh;
  pointer-events: auto;
}

.opener-enter {
  position: relative;
  z-index: 5;
  transform: translateY(8px);
  margin-top: clamp(14px, 1.8vh, 24px);
  padding: 11px 28px 10px;
  border: 1px solid rgba(255,255,255,.62);
  border-radius: 4px;
  background: #000 !important;
  background-image: none !important;
  color: #fff !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  font-family: var(--mono), "IBM Plex Mono", "Courier New", monospace;
  font-size: 8.8px;
  font-weight: 650;
  letter-spacing: .24em;
  line-height: 1;
  opacity: 0;
  cursor: pointer;
  text-shadow: 0 0 4px rgba(255,255,255,.42), 0 0 13px rgba(255,255,255,.18);
  box-shadow: 0 0 0 1px rgba(255,255,255,.12), inset 0 0 18px rgba(0,0,0,1);
  transition:
    opacity .55s cubic-bezier(.2,.8,.2,1),
    transform .55s cubic-bezier(.2,.8,.2,1),
    border-color .34s cubic-bezier(.2,.8,.2,1),
    background-color .34s cubic-bezier(.2,.8,.2,1),
    box-shadow .34s cubic-bezier(.2,.8,.2,1),
    filter .34s cubic-bezier(.2,.8,.2,1);
  pointer-events: auto;
}

.opener-enter span {
  position: relative;
  z-index: 1;
  color: #fff !important;
  background: transparent !important;
}
.opener-enter::before,
.opener-enter::after { display: none !important; content: none !important; }

.portfolio-opener.is-enter-ready .opener-enter { opacity: 1; transform: translateY(0); }

.portfolio-opener.is-enter-hovering .opener-enter,
.opener-enter:hover,
.opener-enter:focus-visible {
  border-color: rgba(255,255,255,.92) !important;
  background: #000 !important;
  background-color: #000 !important;
  transform: translateY(-1px);
  filter: drop-shadow(0 0 4px rgba(255,255,255,.72));
  box-shadow:
    0 0 0 1px rgba(255,255,255,.18),
    0 0 18px rgba(255,255,255,.28),
    0 0 48px rgba(255,255,255,.11),
    inset 0 0 16px rgba(0,0,0,1);
  outline: none;
}

.opener-glow-text,
.opener-grain-text { filter: none; animation: none; }

@keyframes openerIgniteBase {
  /* Clean white layer arrives late: almost absent while CRT searches, then catches and locks. */
  0%   { opacity: 0;    transform: translate3d(-.8px,.3px,0) scale(.999); filter: drop-shadow(0 0 0 rgba(255,255,255,0)); }
  6%   { opacity: .02;  transform: translate3d(-.6px,.2px,0) scale(.999); filter: drop-shadow(0 0 0 rgba(255,255,255,0)); }
  12%  { opacity: 0;    transform: translate3d(-.5px,.2px,0) scale(.999); }
  18%  { opacity: .06;  transform: translate3d(-.35px,.12px,0) scale(.9995); filter: drop-shadow(0 0 .8px rgba(255,255,255,.10)); }
  24%  { opacity: .00;  filter: drop-shadow(0 0 0 rgba(255,255,255,0)); }
  29%  { opacity: .24;  transform: translate3d(.32px,-.12px,0) scale(1); filter: drop-shadow(0 0 1.4px rgba(255,255,255,.24)); }
  33%  { opacity: .05;  filter: drop-shadow(0 0 .3px rgba(255,255,255,.04)); }
  39%  { opacity: .46;  transform: translate3d(-.25px,.08px,0) scale(1); filter: drop-shadow(0 0 2px rgba(255,255,255,.36)) drop-shadow(0 0 8px rgba(255,255,255,.08)); }
  44%  { opacity: .12;  filter: drop-shadow(0 0 .4px rgba(255,255,255,.06)); }
  52%  { opacity: .68;  transform: translate3d(.18px,-.06px,0) scale(1); filter: drop-shadow(0 0 2.2px rgba(255,255,255,.42)) drop-shadow(0 0 12px rgba(255,255,255,.12)); }
  59%  { opacity: .30;  filter: drop-shadow(0 0 1px rgba(255,255,255,.12)); }
  66%  { opacity: .84;  transform: translate3d(-.10px,.04px,0) scale(1); filter: drop-shadow(0 0 2.3px rgba(255,255,255,.45)) drop-shadow(0 0 13px rgba(255,255,255,.13)); }
  74%  { opacity: .58;  transform: translate3d(.06px,-.02px,0) scale(1); }
  83%  { opacity: .94;  transform: translate3d(0,0,0) scale(1); filter: drop-shadow(0 0 2.4px rgba(255,255,255,.50)) drop-shadow(0 0 14px rgba(255,255,255,.15)); }
  92%  { opacity: .98;  transform: translate3d(0,0,0) scale(1); }
  100% { opacity: 1;    transform: translate3d(0,0,0) scale(1); filter: drop-shadow(0 0 2.4px rgba(255,255,255,.52)) drop-shadow(0 0 14px rgba(255,255,255,.16)) drop-shadow(0 0 34px rgba(255,255,255,.05)); }
}

@keyframes openerIgniteCrt {
  /* CRT layer powers the first read, misaligned and noisy, then gives way into registration with the clean layer. */
  0%   { opacity: .00; transform: translate3d(3.2px,-1.7px,0) scale(1.010); filter: drop-shadow(0 0 0 rgba(90,145,200,0)); }
  3%   { opacity: .74; transform: translate3d(3.0px,-1.6px,0) scale(1.010); filter: drop-shadow(0 0 3px rgba(112,154,212,.42)) drop-shadow(0 0 18px rgba(164,118,212,.18)); }
  5%   { opacity: .12; transform: translate3d(-2.5px,1.2px,0) scale(1.006); }
  8%   { opacity: .96; transform: translate3d(2.8px,-1.4px,0) scale(1.009); filter: drop-shadow(0 0 4px rgba(124,168,212,.48)) drop-shadow(0 0 24px rgba(180,125,212,.20)); }
  12%  { opacity: .30; transform: translate3d(-2.1px,.9px,0) scale(1.005); }
  17%  { opacity: .90; transform: translate3d(2.1px,-.95px,0) scale(1.007); filter: drop-shadow(0 0 3px rgba(124,168,212,.42)) drop-shadow(0 0 18px rgba(164,118,212,.17)); }
  24%  { opacity: .42; transform: translate3d(-1.7px,.72px,0) scale(1.004); }
  31%  { opacity: .86; transform: translate3d(1.45px,-.55px,0) scale(1.0045); }
  38%  { opacity: .52; transform: translate3d(-1.15px,.42px,0) scale(1.0035); }
  48%  { opacity: .78; transform: translate3d(.82px,-.28px,0) scale(1.0025); filter: drop-shadow(0 0 2.6px rgba(112,154,212,.36)) drop-shadow(0 0 15px rgba(164,118,212,.14)); }
  58%  { opacity: .60; transform: translate3d(-.58px,.18px,0) scale(1.0018); }
  68%  { opacity: .74; transform: translate3d(.34px,-.12px,0) scale(1.0012); }
  78%  { opacity: .68; transform: translate3d(-.18px,.06px,0) scale(1.0006); }
  88%  { opacity: .72; transform: translate3d(.08px,-.02px,0) scale(1.0002); }
  100% { opacity: .72; transform: translate3d(0,0,0) scale(1); filter: drop-shadow(0 0 2px rgba(112,154,212,.34)) drop-shadow(0 0 12px rgba(164,118,212,.16)) drop-shadow(0 0 28px rgba(90,145,200,.09)); }
}

@keyframes openerCrtDrift {
  0%   { transform: translate3d(0,0,0) scale(1); opacity: .68; }
  40%  { transform: translate3d(.55px,-.2px,0) scale(1.0008); opacity: .73; }
  65%  { transform: translate3d(-.45px,.15px,0) scale(1.0003); opacity: .69; }
  100% { transform: translate3d(.25px,.2px,0) scale(1.0006); opacity: .72; }
}

@keyframes openerLowerReveal { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

.portfolio-opener.is-leaving {
  display: block !important;
  pointer-events: none !important;
  opacity: 1 !important;
  animation: none !important;
  transform: none !important;
  transition: none !important;
}
.portfolio-opener.is-leaving::before {
  transform: translate3d(0, -112vh, 0) !important;
  transition: transform 1.25s cubic-bezier(.72,0,.12,1) !important;
  will-change: transform;
}
.portfolio-opener.is-leaving::after {
  bottom: 100vh !important;
  opacity: .35 !important;
  transition: bottom 1.25s cubic-bezier(.72,0,.12,1), opacity .22s ease .72s !important;
}
.portfolio-opener.is-leaving .opener-composition {
  transform: translate(-50%, calc(-50% - 112vh)) !important;
  transition: transform 1.25s cubic-bezier(.72,0,.12,1) !important;
  opacity: 1 !important;
  will-change: transform;
}
.portfolio-opener.is-leaving .opener-stage,
.portfolio-opener.is-leaving .opener-lower,
.portfolio-opener.is-leaving .opener-enter {
  animation: none !important;
  opacity: 1 !important;
}
.portfolio-opener.is-leaving .opener-stage {
  transform: translateX(clamp(8px, 1.4vw, 24px)) !important;
}
.portfolio-opener.is-leaving .opener-lower,
.portfolio-opener.is-leaving .opener-enter { transform: none !important; }

@media (max-width: 980px) {
  .opener-composition { width: min(86vw, 680px); gap: clamp(28px, 3.6vh, 38px); }
  .opener-stage { width: clamp(276px, 52vw, 396px); transform: translateX(clamp(4px, 1.2vw, 14px)); }
  .opener-lower {
    width: min(86vw, 600px);
    grid-template-columns: 1fr;
    row-gap: 20px;
    text-align: center;
  }
  .opener-logo { justify-self: center; width: 136px; }
  .opener-copy { align-items: center; }
  .opener-description { max-width: 460px; }
}

@media (max-width: 620px) {
  .opener-composition { width: calc(100vw - 48px); gap: 26px; }
  .opener-stage { width: clamp(246px, 76vw, 348px); transform: translateX(6px); }
  .opener-lower { width: calc(100vw - 64px); row-gap: 18px; }
  .opener-logo { width: 119px; }
  .opener-description { font-size: 10.6px; line-height: 1.5; }
  .opener-enter { margin-top: 4px; }
}


/* v235 — mobile usability pass only. Desktop layout is untouched. */
@media (max-width: 900px) {
  html {
    scroll-snap-type: none !important;
  }

  body {
    background: #000 !important;
    overflow-x: hidden !important;
  }

  .noise {
    opacity: .026 !important;
  }

  /* Header: keep the desktop identity, but make navigation usable on touch. */
  .site-header {
    --mobile-header-pad-x: 16px;
    min-height: 78px !important;
    height: auto !important;
    padding: 12px var(--mobile-header-pad-x) 10px !important;
    display: block !important;
    background: linear-gradient(180deg, rgba(0,0,0,.96), rgba(0,0,0,.70) 68%, rgba(0,0,0,0)) !important;
    overflow: hidden !important;
  }

  .site-header .brand-cluster {
    width: 100% !important;
    max-width: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 29px 0 6px !important;
    mask-image: linear-gradient(90deg, #000 calc(100% - 42px), transparent 100%) !important;
    -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 42px), transparent 100%) !important;
  }
  .site-header .brand-cluster::-webkit-scrollbar { display: none !important; }

  .site-header .brand-logo-link {
    position: absolute !important;
    left: var(--mobile-header-pad-x) !important;
    top: 13px !important;
    z-index: 2 !important;
    transform: none !important;
  }
  .site-header .brand-logo-img {
    height: 21px !important;
    max-width: 148px !important;
    opacity: .96 !important;
  }
  .site-header .brand-logo-link::after { display: none !important; }

  .site-header .brand-nav {
    flex: 0 0 auto !important;
    font-size: 8.5px !important;
    line-height: 1 !important;
    letter-spacing: .15em !important;
    color: rgba(243,240,232,.62) !important;
    padding: 3px 0 !important;
  }

  .site-header .nav-right {
    position: absolute !important;
    top: 14px !important;
    right: var(--mobile-header-pad-x) !important;
    width: auto !important;
    max-width: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
  }
  .site-header .nav-right .lang-switch { display: none !important; }
  .site-header .nav-right a {
    display: inline-flex !important;
    font-size: 8.5px !important;
    line-height: 1 !important;
    letter-spacing: .15em !important;
    padding: 0 !important;
    color: rgba(243,240,232,.62) !important;
  }

  /* Homepage: one clean vertical flow. */
  .home-page .home-hero {
    padding-top: 78px !important;
    min-height: 0 !important;
  }
  .home-page .home-case {
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: #000 !important;
  }
  .home-page .home-case > .home-case-art,
  .home-page .home-case > .home-case-topline,
  .home-page .home-case > .home-case-content,
  .home-page .home-case > .case-gradient,
  .home-page .home-case > .home-case-hover-zone {
    display: none !important;
  }
  .home-page .mobile-home-card {
    display: block !important;
    position: relative !important;
    top: auto !important;
    min-height: 0 !important;
    background: #000 !important;
    overflow: hidden !important;
  }
  .home-page .mobile-home-card-visual {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 16 / 10 !important;
    overflow: hidden !important;
    background: #000 !important;
  }
  .home-page .mobile-home-card-art {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    filter: brightness(.82) contrast(1.04) saturate(.92) !important;
  }
  .home-page .mobile-home-card-logo {
    width: min(46vw, 174px) !important;
    right: 16px !important;
    bottom: 16px !important;
    top: auto !important;
    transform: none !important;
    opacity: .96 !important;
  }
  .home-page .mobile-home-image-action {
    left: 16px !important;
    bottom: 15px !important;
    background: rgba(0,0,0,.42) !important;
    border-color: rgba(243,240,232,.32) !important;
  }
  .home-page .mobile-home-card-copy {
    margin: 0 !important;
    padding: 28px 18px 42px !important;
    max-width: 460px !important;
    background: #000 !important;
  }
  .home-page .mobile-home-card-copy p:not(.eyebrow) {
    font-size: 13px !important;
    line-height: 1.58 !important;
    max-width: 360px !important;
  }

  .home-page .home-routes {
    padding: 0 0 72px !important;
    background: #000 !important;
  }
  .home-page .home-route-grid {
    width: 100vw !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .home-page .home-route-card,
  .home-page .home-video-panel,
  .home-page .home-route-motion,
  .home-page .home-route-personal-feature {
    position: relative !important;
    display: block !important;
    width: 100vw !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 10 !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-top: 1px solid rgba(243,240,232,.08) !important;
    background: #000 !important;
    transform: none !important;
  }
  .home-page .home-route-card img,
  .home-page .home-video-panel img,
  .home-page .home-video-media,
  .home-page .home-route-cycle-img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    max-width: none !important;
    filter: brightness(.78) contrast(1.04) saturate(.92) !important;
  }
  .home-page .home-route-card::after,
  .home-page .home-video-panel::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    pointer-events: none !important;
    background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.22) 55%, rgba(0,0,0,.70)) !important;
    opacity: .95 !important;
  }
  .home-page .route-v155-caption,
  .home-page .home-video-title,
  .home-page .home-duo-copy,
  .home-page .home-route-copy {
    position: absolute !important;
    z-index: 3 !important;
    left: 18px !important;
    right: 18px !important;
    bottom: 16px !important;
    top: auto !important;
    transform: none !important;
    opacity: 1 !important;
    color: rgba(255,255,255,.92) !important;
  }
  .home-page .route-v155-caption strong,
  .home-page .home-video-title,
  .home-page .home-route-copy strong {
    font-size: clamp(20px, 7vw, 31px) !important;
    line-height: .95 !important;
    letter-spacing: .10em !important;
  }
  .home-page .route-v155-caption p,
  .home-page .route-v155-caption small {
    display: none !important;
  }
  .home-row-separator {
    display: block !important;
    height: auto !important;
    padding: 26px 18px 22px !important;
    background: #000 !important;
    border-top: 1px solid rgba(243,240,232,.10) !important;
    border-bottom: 1px solid rgba(243,240,232,.06) !important;
  }
  .home-row-separator span {
    position: static !important;
    display: block !important;
    margin: 0 !important;
    font-size: 8px !important;
    letter-spacing: .18em !important;
    color: rgba(243,240,232,.48) !important;
  }

  /* Commercial Work: remove desktop rail friction, stack case studies. */
  body.works-page .works-v112-top-art {
    height: 112px !important;
    min-height: 112px !important;
    opacity: .78 !important;
  }
  body.works-page .works-v92-rail {
    position: sticky !important;
    top: 78px !important;
    left: auto !important;
    right: auto !important;
    z-index: 35 !important;
    width: 100vw !important;
    height: auto !important;
    display: flex !important;
    gap: 18px !important;
    padding: 12px 16px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    background: rgba(0,0,0,.88) !important;
    border-top: 1px solid rgba(243,240,232,.08) !important;
    border-bottom: 1px solid rgba(243,240,232,.08) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    transform: none !important;
    scrollbar-width: none !important;
  }
  body.works-page .works-v92-rail::-webkit-scrollbar { display: none !important; }
  body.works-page .works-v92-rail a {
    flex: 0 0 auto !important;
    padding: 0 !important;
    font-size: 8px !important;
    letter-spacing: .16em !important;
    white-space: nowrap !important;
  }
  body.works-page .works-v92-intro,
  body.works-page .works-v92-content {
    width: min(100% - 28px, 720px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  body.works-page .works-v92-intro {
    padding-top: 58px !important;
    padding-bottom: 54px !important;
  }
  body.works-page .works-v92-intro h1,
  body.works-page .works-v92-titleblock h2 {
    font-size: clamp(40px, 13vw, 72px) !important;
    line-height: .92 !important;
    letter-spacing: -.06em !important;
  }
  body.works-page .works-v92-intro-copy,
  body.works-page .works-v92-desc {
    max-width: 100% !important;
    font-size: 13px !important;
    line-height: 1.62 !important;
  }
  body.works-page .works-v92-case-head {
    display: block !important;
    margin-bottom: 28px !important;
  }
  body.works-page .works-v92-meta,
  body.works-page .works-v92-facts {
    margin-top: 18px !important;
  }
  body.works-page .works-v92-case {
    padding: 56px 0 !important;
  }
  body.works-page .works-v92 figure,
  body.works-page .works-v92-hero-frame,
  body.works-page .works-v92-grid .asset-card,
  body.works-page .works-v92-mosaic .asset-card {
    margin: 0 0 10px !important;
    width: 100% !important;
    min-height: auto !important;
    height: auto !important;
    aspect-ratio: 16 / 10 !important;
    grid-column: auto !important;
    grid-row: auto !important;
  }
  body.works-page .works-v92 figure.tall,
  body.works-page .works-v92-mosaic .asset-card.tall {
    aspect-ratio: 4 / 5 !important;
  }
  body.works-page .works-v92 img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    max-width: none !important;
  }
  body.works-page .works-v92-hero-contained img,
  body.works-page .works-v92 .contain img {
    object-fit: contain !important;
    background: #000 !important;
  }
  body.works-page .works-v92-grid,
  body.works-page .works-v92-grid-controlled,
  body.works-page .works-v92-mosaic {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
  }

  /* Personal Art: convert the desktop brick archive into a normal touch feed. */
  body.personal-v151 .pa93-opener {
    padding-top: calc(78px + 34px) !important;
    padding-bottom: 42px !important;
  }
  body.personal-v151 .pa93-opener-copy,
  body.personal-v151 .pa93-gallery-section,
  body.personal-v151 .pa151-brick-section {
    width: min(100% - 28px, 720px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  body.personal-v151 .pa93-opener-copy h1 {
    font-size: clamp(42px, 13vw, 76px) !important;
    line-height: .92 !important;
  }
  body.personal-v151 .pa93-carousel {
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 10 !important;
  }
  body.personal-v151 .pa93-feature-frame,
  body.personal-v151 .pa93-feature-img {
    height: 100% !important;
  }
  body.personal-v151 .pa151-filter-bar {
    position: sticky !important;
    top: 78px !important;
    z-index: 34 !important;
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    gap: 20px !important;
    padding: 13px 16px !important;
    background: rgba(0,0,0,.88) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
  }
  body.personal-v151 .pa151-filter { font-size: 8px !important; white-space: nowrap !important; }
  body.personal-v151 .pa151-filter.is-active::before { display: none !important; }
  body.personal-v151 .pa151-brick-section {
    width: 100% !important;
    padding: 0 0 76px !important;
    background: #000 !important;
  }
  body.personal-v151 .pa151-brick-gallery {
    width: 100% !important;
    display: block !important;
  }
  body.personal-v151 .pa151-brick-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    height: auto !important;
    width: 100% !important;
    margin: 0 0 10px !important;
    overflow: visible !important;
  }
  body.personal-v151 .pa151-tile,
  body.personal-v151 .pa151-tile.is-wide,
  body.personal-v151 .pa151-tile.is-medium,
  body.personal-v151 .pa151-tile.is-portrait,
  body.personal-v151 .pa151-tile.is-narrow {
    flex: none !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 10 !important;
    margin: 0 !important;
  }
  body.personal-v151 .pa151-tile.is-portrait,
  body.personal-v151 .pa151-tile.is-narrow {
    aspect-ratio: 4 / 5 !important;
  }
  body.personal-v151 .pa151-tile img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
  body.personal-v151 .pa151-tile figcaption {
    opacity: 1 !important;
    transform: none !important;
    font-size: 8px !important;
  }

  /* Twój K. project: preserve cinematic feeling but avoid desktop scroll traps. */
  .penance-page .context-panel {
    height: 92svh !important;
    min-height: 92svh !important;
    padding-top: 78px !important;
  }
  .penance-page .context-copy {
    left: 18px !important;
    right: 18px !important;
    bottom: 34px !important;
    width: auto !important;
  }
  .penance-page .context-logo-title { width: min(70vw, 270px) !important; }
  .penance-page .project-statement { padding: 64px 18px !important; }
  .penance-page .project-statement-inner { grid-template-columns: 1fr !important; gap: 18px !important; }
  .penance-page .sword-reveal { height: auto !important; min-height: 92svh !important; }
  .penance-page .sword-sticky { position: relative !important; height: 92svh !important; }
  .penance-page .chapter-bridge { min-height: 200px !important; height: 28svh !important; }
  .penance-page .frames.story-cinema { height: auto !important; overflow: visible !important; }
  .penance-page .story-cinema-sticky { position: relative !important; height: auto !important; top: auto !important; overflow: visible !important; }
  .penance-page .story-cinema .story-panel {
    position: relative !important;
    inset: auto !important;
    height: 100svh !important;
    min-height: 100svh !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  .penance-page .story-cinema .story-panel img {
    width: 100vw !important;
    height: 100svh !important;
    object-fit: contain !important;
    object-position: center center !important;
  }

  /* About/contact: single readable column. */
  .contact-main,
  .contact-main-v70 { min-height: 100svh !important; }
  .contact-profile-layout {
    width: min(100% - 32px, 660px) !important;
    grid-template-columns: 1fr !important;
    gap: 38px !important;
    padding: calc(78px + 34px) 0 74px !important;
  }
  .contact-rail-inner { position: relative !important; top: auto !important; width: 100% !important; }
  .profile-photo { width: min(100%, 360px) !important; min-width: 0 !important; }
  .rail-contact { width: 100% !important; max-width: 460px !important; }
  .profile-copy { padding-top: 0 !important; }
  .profile-intro-block h1 { font-size: clamp(42px, 13vw, 78px) !important; }
  .profile-section { grid-template-columns: 1fr !important; gap: 16px !important; padding: 32px 0 !important; }
  .profile-experience-row { grid-template-columns: 1fr !important; gap: 8px !important; }

  /* Footer: compact, touch-readable and not pretending to be desktop. */
  .site-footer { padding: 42px 18px 54px !important; }
  .footer-inner {
    width: min(100%, 560px) !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    align-items: start !important;
  }
  .footer-brand { display: flex !important; gap: 18px !important; align-items: center !important; }
  .footer-logo-mark { width: 54px !important; opacity: .82 !important; }
  .footer-name { font-size: 19px !important; }
  .footer-meta { justify-content: flex-start !important; gap: 14px 18px !important; flex-wrap: wrap !important; }
}

@media (max-width: 420px) {
  .site-header { --mobile-header-pad-x: 14px; min-height: 76px !important; padding-top: 11px !important; }
  .site-header .brand-logo-img { height: 19px !important; max-width: 136px !important; }
  .site-header .brand-cluster { padding-top: 28px !important; gap: 14px !important; }
  .site-header .brand-nav,
  .site-header .nav-right a { font-size: 8px !important; }

  .home-page .home-hero { padding-top: 76px !important; }
  .home-page .mobile-home-card-visual { aspect-ratio: 4 / 3 !important; }
  .home-page .home-route-card,
  .home-page .home-video-panel,
  .home-page .home-route-motion,
  .home-page .home-route-personal-feature { aspect-ratio: 4 / 3 !important; }

  body.works-page .works-v92-rail,
  body.personal-v151 .pa151-filter-bar { top: 76px !important; }
  body.works-page .works-v92-intro h1,
  body.works-page .works-v92-titleblock h2,
  body.personal-v151 .pa93-opener-copy h1 { font-size: clamp(38px, 14vw, 62px) !important; }

  .portfolio-opener .opener-stage { width: min(82vw, 320px) !important; }
  .portfolio-opener .opener-lower { width: calc(100vw - 48px) !important; }
  .portfolio-opener .opener-logo { width: 108px !important; }
  .portfolio-opener .opener-description { font-size: 10.2px !important; }
}

/* v236 — mobile-only usability rebuild: hamburger nav, logical mobile home, stacked galleries. Desktop untouched. */
.mobile-menu-toggle,
.mobile-menu-panel { display: none; }

@media (max-width: 900px) {
  :root { --mobile-header-h: 68px; }

  body.mobile-menu-lock { overflow: hidden !important; }

  .site-header {
    height: var(--mobile-header-h) !important;
    min-height: var(--mobile-header-h) !important;
    padding: 0 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: #000 !important;
    border-bottom: 1px solid rgba(243,240,232,.075) !important;
    overflow: visible !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.46) !important;
  }

  .site-header::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -34px;
    height: 34px;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(0,0,0,.82), rgba(0,0,0,0));
  }

  .site-header .brand-cluster {
    width: auto !important;
    max-width: calc(100vw - 86px) !important;
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    mask-image: none !important;
    -webkit-mask-image: none !important;
  }

  .site-header .brand-logo-link {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    transform: none !important;
    left: auto !important;
    top: auto !important;
    z-index: 3 !important;
  }

  .site-header .brand-logo-link::after { display: none !important; }

  .site-header .brand-logo-img {
    height: 27px !important;
    max-width: 190px !important;
    width: auto !important;
    opacity: .98 !important;
  }

  .site-header .brand-nav,
  .site-header .nav-right {
    display: none !important;
  }

  .mobile-menu-toggle {
    display: inline-flex !important;
    position: relative !important;
    z-index: 71 !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(243,240,232,.16) !important;
    border-radius: 999px !important;
    background: rgba(0,0,0,.58) !important;
    color: var(--fg) !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  .mobile-menu-toggle span {
    position: absolute !important;
    width: 17px !important;
    height: 1px !important;
    background: rgba(243,240,232,.88) !important;
    transition: transform .24s cubic-bezier(.22,.78,.22,1), opacity .18s ease, width .24s cubic-bezier(.22,.78,.22,1) !important;
  }
  .mobile-menu-toggle span:nth-child(1) { transform: translateY(-6px); }
  .mobile-menu-toggle span:nth-child(2) { transform: translateY(0); width: 13px !important; }
  .mobile-menu-toggle span:nth-child(3) { transform: translateY(6px); }
  .site-header.mobile-menu-open .mobile-menu-toggle span:nth-child(1) { transform: rotate(45deg); }
  .site-header.mobile-menu-open .mobile-menu-toggle span:nth-child(2) { opacity: 0; transform: scaleX(.1); }
  .site-header.mobile-menu-open .mobile-menu-toggle span:nth-child(3) { transform: rotate(-45deg); }

  .mobile-menu-panel {
    display: grid !important;
    position: fixed !important;
    z-index: 70 !important;
    left: 0 !important;
    right: 0 !important;
    top: var(--mobile-header-h) !important;
    padding: 16px 16px 20px !important;
    background: rgba(0,0,0,.965) !important;
    border-top: 1px solid rgba(243,240,232,.08) !important;
    border-bottom: 1px solid rgba(243,240,232,.12) !important;
    box-shadow: 0 30px 70px rgba(0,0,0,.64) !important;
    transform: translate3d(0,-12px,0) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity .23s ease, transform .28s cubic-bezier(.22,.78,.22,1) !important;
  }

  .site-header.mobile-menu-open .mobile-menu-panel {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translate3d(0,0,0) !important;
  }

  .mobile-menu-panel a,
  .mobile-menu-panel button {
    font-family: var(--mono) !important;
    text-transform: uppercase !important;
    letter-spacing: .15em !important;
    font-size: 12px !important;
    line-height: 1 !important;
    color: rgba(243,240,232,.86) !important;
  }

  .mobile-menu-panel a {
    display: flex !important;
    align-items: center !important;
    min-height: 48px !important;
    padding: 0 2px !important;
    border-bottom: 1px solid rgba(243,240,232,.075) !important;
  }
  .mobile-menu-panel a.is-active { color: #fff !important; }

  .mobile-menu-langs {
    display: flex !important;
    gap: 10px !important;
    padding-top: 16px !important;
  }
  .mobile-menu-langs button {
    min-width: 54px !important;
    height: 36px !important;
    border: 1px solid rgba(243,240,232,.18) !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.035) !important;
  }

  .home-page .home-hero { padding-top: var(--mobile-header-h) !important; }
  .portfolio-page main,
  .personal-v151-main,
  .works-v92-main,
  .contact-main { padding-top: var(--mobile-header-h) !important; }

  /* Home: discard the broken multi-column mobile layout and use a readable vertical index. */
  .home-page .mobile-home-card-visual {
    aspect-ratio: 16 / 11 !important;
  }
  .home-page .mobile-home-card-copy {
    padding: 28px 18px 36px !important;
  }

  .home-page .home-routes {
    padding: 0 14px 76px !important;
    background: #000 !important;
  }
  .home-page .home-route-grid {
    width: 100% !important;
    max-width: 720px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    overflow: visible !important;
  }
  .home-page .home-route-card,
  .home-page .home-video-panel,
  .home-page .home-route-motion,
  .home-page .home-route-personal-feature {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 10 !important;
    margin: 0 !important;
    border: 1px solid rgba(243,240,232,.075) !important;
    overflow: hidden !important;
    background: #050505 !important;
    transform: none !important;
  }
  .home-page .home-route-card img,
  .home-page .home-video-panel img,
  .home-page .home-video-media,
  .home-page .home-route-cycle-img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center center !important;
    filter: brightness(.80) contrast(1.04) saturate(.92) !important;
    transform: none !important;
  }
  .home-page .home-route-card::after,
  .home-page .home-video-panel::after {
    background: linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.24) 54%, rgba(0,0,0,.78)) !important;
  }
  .home-page .route-v155-caption,
  .home-page .home-video-title,
  .home-page .home-duo-copy,
  .home-page .home-route-copy {
    left: 16px !important;
    right: 16px !important;
    bottom: 15px !important;
    transform: none !important;
  }
  .home-page .route-v155-caption strong,
  .home-page .home-video-title,
  .home-page .home-route-copy strong {
    font-size: clamp(18px, 6.4vw, 27px) !important;
    letter-spacing: .13em !important;
  }
  .home-page .home-row-separator {
    display: none !important;
  }

  /* Twój K.: frames become a tight vertical film strip, not one black screen per frame. */
  .penance-page .context-panel {
    padding-top: var(--mobile-header-h) !important;
    min-height: 82svh !important;
    height: 82svh !important;
  }
  .penance-page .project-statement { padding: 52px 18px !important; }
  .penance-page .chapter-bridge { min-height: 148px !important; height: 22svh !important; }
  .penance-page .frames.story-cinema,
  .penance-page .story-cinema-sticky {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    margin: 0 !important;
  }
  .penance-page .story-cinema .story-panel {
    display: block !important;
    position: relative !important;
    inset: auto !important;
    height: auto !important;
    min-height: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    margin: 0 !important;
    padding: 0 0 8px !important;
    background: #000 !important;
  }
  .penance-page .story-cinema .story-panel img {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center center !important;
    background: #000 !important;
    transform: none !important;
    filter: brightness(.94) contrast(1.02) !important;
  }
  .penance-page .story-panel::before,
  .penance-page .story-panel::after { display: none !important; }
  .penance-page .story-panel-caption {
    opacity: 1 !important;
    bottom: 12px !important;
    left: 14px !important;
  }

  /* Commercial Work: sticky top tabs and natural image proportions. */
  body.works-page .works-v112-top-art { display: none !important; }
  body.works-page .works-v92-rail {
    position: sticky !important;
    top: var(--mobile-header-h) !important;
    z-index: 36 !important;
    width: 100vw !important;
    margin: 0 0 26px calc(50% - 50vw) !important;
    padding: 10px 14px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    background: rgba(0,0,0,.94) !important;
    border-top: 1px solid rgba(243,240,232,.075) !important;
    border-bottom: 1px solid rgba(243,240,232,.11) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
  }
  body.works-page .works-v92-rail a {
    flex: 0 0 auto !important;
    min-height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 14px !important;
    border: 1px solid rgba(243,240,232,.18) !important;
    border-radius: 999px !important;
    font-size: 8px !important;
    letter-spacing: .14em !important;
    background: rgba(255,255,255,.025) !important;
  }
  body.works-page .works-v92-rail a.is-active {
    border-color: rgba(243,240,232,.52) !important;
    color: #fff !important;
  }
  body.works-page .works-v92-intro {
    padding-top: 34px !important;
    padding-bottom: 38px !important;
  }
  body.works-page .works-v92-case { padding: 42px 0 56px !important; }
  body.works-page .works-v92-content,
  body.works-page .works-v92-intro {
    width: min(100% - 28px, 720px) !important;
  }
  body.works-page .commercial-v173-layout,
  body.works-page .commercial-v173-grid,
  body.works-page .commercial-v173-grid-two,
  body.works-page .commercial-v173-grid-three,
  body.works-page .commercial-v173-portrait-grid,
  body.works-page .works-v92-grid,
  body.works-page .works-v92-mosaic {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
  }
  body.works-page .works-v92 figure,
  body.works-page .asset-card,
  body.works-page .commercial-v173-full {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    margin: 0 0 12px !important;
    background: #030303 !important;
    overflow: hidden !important;
  }
  body.works-page .works-v92 figure img,
  body.works-page .asset-card img {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: 78svh !important;
    object-fit: contain !important;
    object-position: center center !important;
    background: #000 !important;
  }
  body.works-page .commercial-v173-label {
    margin: 36px 0 14px !important;
    font-size: 9px !important;
    letter-spacing: .20em !important;
  }
  body.works-page .asset-card figcaption { opacity: 1 !important; }
  body.works-page .work-side-panel { display: none !important; }

  /* Personal Work: bypass the broken brick/tile mechanics and show a clear touch feed. */
  body.personal-v151 .pa93-opener { padding-top: calc(var(--mobile-header-h) + 30px) !important; }
  body.personal-v151 .pa151-filter-bar {
    top: var(--mobile-header-h) !important;
    gap: 10px !important;
    padding: 10px 14px !important;
    background: rgba(0,0,0,.94) !important;
  }
  body.personal-v151 .pa151-filter {
    flex: 0 0 auto !important;
    min-height: 38px !important;
    padding: 0 14px !important;
    border: 1px solid rgba(243,240,232,.18) !important;
    border-radius: 999px !important;
    font-size: 8px !important;
    letter-spacing: .14em !important;
    background: rgba(255,255,255,.025) !important;
  }
  body.personal-v151 .pa151-filter.is-active {
    border-color: rgba(243,240,232,.52) !important;
    color: #fff !important;
  }
  body.personal-v151 .pa151-brick-section,
  body.personal-v151 .pa151-brick-gallery,
  body.personal-v151 .pa151-brick-row {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    overflow: visible !important;
    background: #000 !important;
  }
  body.personal-v151 .pa151-tile,
  body.personal-v151 .pa151-tile.is-wide,
  body.personal-v151 .pa151-tile.is-medium,
  body.personal-v151 .pa151-tile.is-portrait,
  body.personal-v151 .pa151-tile.is-narrow {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    margin: 0 0 10px !important;
    background: #000 !important;
    overflow: hidden !important;
  }
  body.personal-v151 .pa151-tile button {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: #000 !important;
  }
  body.personal-v151 .pa151-tile img {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: 82svh !important;
    object-fit: contain !important;
    object-position: center center !important;
    background: #000 !important;
  }
  body.personal-v151 .pa151-tile figcaption {
    position: absolute !important;
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    opacity: 1 !important;
    transform: none !important;
    font-size: 8px !important;
  }

  .site-footer { padding: 42px 18px 54px !important; }
}

@media (max-width: 420px) {
  :root { --mobile-header-h: 64px; }
  .site-header { height: var(--mobile-header-h) !important; min-height: var(--mobile-header-h) !important; padding: 0 14px !important; }
  .site-header .brand-logo-img { height: 24px !important; max-width: 172px !important; }
  .mobile-menu-toggle { width: 42px !important; height: 42px !important; }
  .home-page .home-route-card,
  .home-page .home-video-panel,
  .home-page .home-route-motion,
  .home-page .home-route-personal-feature { aspect-ratio: 4 / 3 !important; }
  .home-page .mobile-home-card-visual { aspect-ratio: 4 / 3 !important; }
}
@media (max-width: 900px) {
  body.personal-v151 .pa151-tile[hidden],
  body.personal-v151 .pa151-tile.is-filter-hidden,
  body.personal-v151 .pa151-brick-row.is-empty-filter-row { display: none !important; }
}

/* v237 — mobile-only homepage rebuild and square hamburger. Desktop untouched. */
.mobile-home-index { display: none; }

@media (max-width: 900px) {
  /* Header/menu: same black bar, bigger logo, square hamburger. */
  .site-header .brand-logo-img {
    height: 32px !important;
    max-width: 220px !important;
  }
  .mobile-menu-toggle {
    width: 42px !important;
    height: 42px !important;
    border-radius: 4px !important;
    border-color: rgba(243,240,232,.22) !important;
    background: rgba(0,0,0,.86) !important;
  }
  .mobile-menu-toggle span {
    width: 18px !important;
  }
  .mobile-menu-toggle span:nth-child(2) {
    width: 14px !important;
  }

  /* Homepage mobile: Twój K. keeps desktop-like cycling and remains the top hero. */
  .home-page .home-hero {
    padding-top: var(--mobile-header-h) !important;
    background: #000 !important;
  }
  .home-page .home-case {
    min-height: 0 !important;
    height: auto !important;
    background: #000 !important;
  }
  .home-page .mobile-home-card {
    display: block !important;
    background: #000 !important;
  }
  .home-page .mobile-home-card-visual {
    width: 100% !important;
    aspect-ratio: 16 / 10.6 !important;
    overflow: hidden !important;
    background: #000 !important;
  }
  .home-page .mobile-home-card-cycle {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    opacity: 0 !important;
    transform: scale(1.012) !important;
    filter: brightness(.82) contrast(1.06) saturate(.90) !important;
    transition: opacity 1.05s cubic-bezier(.22,.7,.2,1), transform 5.2s linear !important;
  }
  .home-page .mobile-home-card-cycle.is-active {
    opacity: 1 !important;
    transform: scale(1.045) !important;
  }
  .home-page .mobile-home-card-logo {
    width: clamp(132px, 38vw, 210px) !important;
    max-width: 46vw !important;
    opacity: .94 !important;
    filter: drop-shadow(0 12px 26px rgba(0,0,0,.78)) !important;
  }
  .home-page .mobile-home-image-action,
  .home-page .mobile-home-card .home-case-action {
    min-height: 38px !important;
    padding: 0 18px !important;
    border-radius: 2px !important;
    font-size: 9px !important;
    letter-spacing: .16em !important;
    background: rgba(0,0,0,.18) !important;
  }
  .home-page .mobile-home-card-copy {
    padding: 28px 18px 42px !important;
  }
  .home-page .mobile-home-card-copy .eyebrow {
    font-size: 9px !important;
    letter-spacing: .18em !important;
    margin-bottom: 12px !important;
  }
  .home-page .mobile-home-card-copy p:not(.eyebrow) {
    max-width: 34em !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    color: rgba(243,240,232,.86) !important;
  }

  /* Hide the desktop route matrix on mobile and replace it with a deliberate vertical index. */
  .home-page .home-routes {
    display: none !important;
  }
  .home-page .mobile-home-index {
    display: grid !important;
    width: 100% !important;
    padding: 0 0 74px !important;
    gap: 10px !important;
    background: #000 !important;
  }
  .home-page .mobile-index-card {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 10.6 !important;
    overflow: hidden !important;
    background: #050505 !important;
    color: var(--fg) !important;
    text-decoration: none !important;
    border-top: 1px solid rgba(243,240,232,.075) !important;
    border-bottom: 1px solid rgba(243,240,232,.075) !important;
  }
  .home-page .mobile-index-art,
  .home-page .mobile-index-video {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    filter: brightness(.72) contrast(1.05) saturate(.90) !important;
  }
  .home-page .mobile-index-video {
    opacity: .92 !important;
  }
  .home-page .mobile-index-shade {
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    background:
      linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.20) 45%, rgba(0,0,0,.88)),
      linear-gradient(90deg, rgba(0,0,0,.36), rgba(0,0,0,.04) 54%, rgba(0,0,0,.28)) !important;
  }
  .home-page .mobile-index-copy {
    position: absolute !important;
    z-index: 3 !important;
    left: 18px !important;
    right: 18px !important;
    bottom: 18px !important;
    display: grid !important;
    gap: 8px !important;
    align-items: end !important;
    text-shadow: 0 12px 30px rgba(0,0,0,.72) !important;
  }
  .home-page .mobile-index-kicker {
    margin: 0 !important;
    color: rgba(243,240,232,.58) !important;
    font: 600 8px/1 var(--mono) !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
  }
  .home-page .mobile-index-copy h2 {
    margin: 0 !important;
    color: rgba(243,240,232,.95) !important;
    font: 700 clamp(24px, 8.2vw, 42px)/.92 var(--mono) !important;
    letter-spacing: .16em !important;
    text-transform: uppercase !important;
    max-width: 82% !important;
  }
  .home-page .mobile-index-action {
    justify-self: start !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 16px !important;
    min-height: 38px !important;
    margin-top: 8px !important;
    padding: 0 16px !important;
    border: 1px solid rgba(243,240,232,.38) !important;
    color: rgba(243,240,232,.86) !important;
    font: 700 8px/1 var(--mono) !important;
    letter-spacing: .17em !important;
    text-transform: uppercase !important;
    background: rgba(0,0,0,.16) !important;
  }
  .home-page .mobile-index-action::after {
    content: "" !important;
    width: 34px !important;
    height: 1px !important;
    background: rgba(243,240,232,.55) !important;
  }

  /* Mobile Commercial Work: keep project tabs usable at the top, not a broken side panel. */
  body.works-page .works-v92-rail {
    justify-content: flex-start !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* Mobile Twój K.: tighter film-strip feel. */
  .penance-page .story-cinema .story-panel {
    padding-bottom: 2px !important;
  }
}

@media (max-width: 420px) {
  .site-header .brand-logo-img {
    height: 29px !important;
    max-width: 202px !important;
  }
  .mobile-menu-toggle {
    width: 40px !important;
    height: 40px !important;
  }
  .home-page .mobile-home-card-visual,
  .home-page .mobile-index-card {
    aspect-ratio: 4 / 3.08 !important;
  }
  .home-page .mobile-home-card-logo {
    width: clamp(128px, 42vw, 190px) !important;
  }
}

/* v238 — mobile-only rebuild corrections. Desktop remains untouched. */
@media (max-width: 900px) {
  /* Header: logo left, square hamburger right. */
  .site-header {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  .site-header .brand-logo-img {
    height: 34px !important;
    max-width: 232px !important;
  }
  .mobile-menu-toggle {
    width: 44px !important;
    height: 44px !important;
    border-radius: 0 !important;
    background: rgba(0,0,0,.92) !important;
    border: 1px solid rgba(243,240,232,.28) !important;
  }
  .mobile-menu-toggle span { width: 18px !important; }
  .mobile-menu-toggle span:nth-child(2) { width: 18px !important; }
  .mobile-menu-panel a {
    min-height: 54px !important;
    font-size: 12px !important;
    letter-spacing: .14em !important;
  }

  /* HOME MOBILE: clear full-width vertical index. */
  .home-page .home-hero {
    padding-top: var(--mobile-header-h) !important;
    background: #000 !important;
  }
  .home-page .home-case {
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: #000 !important;
  }
  .home-page .mobile-home-card {
    display: block !important;
    width: 100% !important;
    background: #000 !important;
  }
  .home-page .mobile-home-card-visual,
  .home-page .mobile-index-card {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 16 / 10.2 !important;
    min-height: 0 !important;
    height: auto !important;
    overflow: hidden !important;
    background: #030303 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(243,240,232,.10) !important;
  }
  .home-page .mobile-home-card-copy { display: none !important; }
  .home-page .mobile-home-card-art,
  .home-page .mobile-home-card-cycle,
  .home-page .mobile-index-art,
  .home-page .mobile-index-cycle {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    opacity: 0 !important;
    transform: scale(1.012) !important;
    filter: brightness(.74) contrast(1.06) saturate(.90) !important;
    transition: opacity 1.05s cubic-bezier(.22,.72,.16,1), transform 5.6s linear !important;
  }
  .home-page .mobile-home-card-cycle.is-active,
  .home-page .mobile-index-cycle.is-active {
    opacity: 1 !important;
    transform: scale(1.045) !important;
  }
  .home-page .mobile-home-card-visual::after,
  .home-page .mobile-index-shade {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    pointer-events: none !important;
    background:
      linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.20) 48%, rgba(0,0,0,.78)),
      linear-gradient(90deg, rgba(0,0,0,.46), rgba(0,0,0,.04) 55%, rgba(0,0,0,.44)) !important;
  }
  .home-page .mobile-home-card-logo {
    position: absolute !important;
    left: 16px !important;
    right: auto !important;
    top: auto !important;
    bottom: 16px !important;
    width: clamp(150px, 48vw, 220px) !important;
    max-width: 54vw !important;
    height: auto !important;
    z-index: 5 !important;
    opacity: .98 !important;
    transform: none !important;
    filter: drop-shadow(0 12px 26px rgba(0,0,0,.82)) !important;
  }
  .home-page .mobile-home-image-action,
  .home-page .mobile-home-card .home-case-action,
  .home-page .mobile-index-action {
    position: absolute !important;
    right: 16px !important;
    bottom: 16px !important;
    left: auto !important;
    z-index: 6 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 14px !important;
    margin: 0 !important;
    border: 1px solid rgba(243,240,232,.42) !important;
    border-radius: 0 !important;
    color: rgba(243,240,232,.90) !important;
    background: rgba(0,0,0,.32) !important;
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
    font: 700 8px/1 var(--mono) !important;
    letter-spacing: .16em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }
  .home-page .mobile-home-image-action::after,
  .home-page .mobile-index-action::after {
    content: "" !important;
    display: inline-block !important;
    width: 28px !important;
    height: 1px !important;
    margin-left: 12px !important;
    background: rgba(243,240,232,.62) !important;
  }
  .home-page .mobile-home-index {
    display: grid !important;
    width: 100% !important;
    gap: 0 !important;
    padding: 0 0 64px !important;
    background: #000 !important;
  }
  .home-page .mobile-index-card {
    display: block !important;
    color: var(--fg) !important;
    text-decoration: none !important;
  }
  .home-page .mobile-index-video { display: none !important; }
  .home-page .mobile-index-copy {
    position: absolute !important;
    inset: auto 16px 16px 16px !important;
    z-index: 5 !important;
    display: block !important;
    text-shadow: 0 12px 30px rgba(0,0,0,.76) !important;
  }
  .home-page .mobile-index-kicker { display: none !important; }
  .home-page .mobile-index-copy h2 {
    margin: 0 !important;
    max-width: calc(100% - 140px) !important;
    color: rgba(243,240,232,.96) !important;
    font: 700 clamp(22px, 7.4vw, 36px)/.92 var(--mono) !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
  }
  .home-page .mobile-index-card:active .mobile-index-cycle.is-active,
  .home-page .mobile-home-card:active .mobile-home-card-cycle.is-active {
    filter: brightness(.92) contrast(1.06) saturate(.96) !important;
    transform: scale(1.055) !important;
  }

  /* Commercial Work mobile: remove the project pills; content starts cleanly. */
  body.works-page .works-v92-rail {
    display: none !important;
  }
  body.works-page .works-v92-intro {
    padding-top: calc(var(--mobile-header-h) + 34px) !important;
  }

  /* Personal Work mobile: replace giant single-image feed with a compact touch gallery. */
  body.personal-v151 .pa151-brick-section {
    padding-top: 0 !important;
    background: #000 !important;
  }
  body.personal-v151 .pa151-filter-bar {
    position: sticky !important;
    top: var(--mobile-header-h) !important;
    z-index: 34 !important;
    display: flex !important;
    gap: 8px !important;
    overflow-x: auto !important;
    padding: 11px 12px !important;
    background: rgba(0,0,0,.94) !important;
    border-top: 1px solid rgba(243,240,232,.08) !important;
    border-bottom: 1px solid rgba(243,240,232,.10) !important;
    scrollbar-width: none !important;
  }
  body.personal-v151 .pa151-filter-bar::-webkit-scrollbar { display: none !important; }
  body.personal-v151 .pa151-filter {
    flex: 0 0 auto !important;
    min-height: 36px !important;
    padding: 0 13px !important;
    border-radius: 0 !important;
    font-size: 8px !important;
    letter-spacing: .13em !important;
  }
  body.personal-v151 .pa151-brick-gallery {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    width: 100% !important;
    padding: 7px 7px 54px !important;
    margin: 0 !important;
    background: #000 !important;
  }
  body.personal-v151 .pa151-brick-row {
    display: contents !important;
  }
  body.personal-v151 .pa151-tile,
  body.personal-v151 .pa151-tile.is-wide,
  body.personal-v151 .pa151-tile.is-medium,
  body.personal-v151 .pa151-tile.is-portrait,
  body.personal-v151 .pa151-tile.is-narrow {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    aspect-ratio: 4 / 5 !important;
    overflow: hidden !important;
    background: #050505 !important;
  }
  body.personal-v151 .pa151-tile.is-wide {
    grid-column: span 2 !important;
    aspect-ratio: 16 / 8.7 !important;
  }
  body.personal-v151 .pa151-tile.is-medium {
    aspect-ratio: 1 / 1 !important;
  }
  body.personal-v151 .pa151-tile button {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    background: #000 !important;
  }
  body.personal-v151 .pa151-tile img {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center center !important;
    filter: brightness(.84) contrast(1.03) saturate(.94) !important;
    transition: transform .28s cubic-bezier(.2,.8,.2,1), filter .28s cubic-bezier(.2,.8,.2,1) !important;
  }
  body.personal-v151 .pa151-tile:active img {
    transform: scale(1.025) !important;
    filter: brightness(.98) contrast(1.03) saturate(.98) !important;
  }
  body.personal-v151 .pa151-tile::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    z-index: 2 !important;
    background: linear-gradient(180deg, rgba(0,0,0,0) 46%, rgba(0,0,0,.72) 100%) !important;
  }
  body.personal-v151 .pa151-tile figcaption {
    position: absolute !important;
    z-index: 3 !important;
    left: 10px !important;
    right: 10px !important;
    bottom: 9px !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 8px !important;
    opacity: 1 !important;
    transform: none !important;
    color: rgba(243,240,232,.92) !important;
    font-size: 7px !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    pointer-events: none !important;
  }
  body.personal-v151 .pa151-tile figcaption em {
    color: rgba(243,240,232,.58) !important;
  }
}

@media (max-width: 420px) {
  .site-header .brand-logo-img { height: 31px !important; max-width: 214px !important; }
  .mobile-menu-toggle { width: 42px !important; height: 42px !important; }
  .home-page .mobile-home-card-visual,
  .home-page .mobile-index-card { aspect-ratio: 4 / 3.02 !important; }
  .home-page .mobile-home-card-logo { width: clamp(150px, 46vw, 205px) !important; }
  .home-page .mobile-index-copy h2 { max-width: calc(100% - 126px) !important; }
  .home-page .mobile-index-action,
  .home-page .mobile-home-image-action { right: 12px !important; bottom: 12px !important; padding: 0 12px !important; }
  .home-page .mobile-index-action::after,
  .home-page .mobile-home-image-action::after { width: 22px !important; margin-left: 10px !important; }
}

/* v239 — mobile-only corrections requested by user. Desktop untouched. */
@media (max-width: 900px) {
  /* HOMEPAGE / Twój K. hero: remove the heavy mobile dimming, keep it inviting. */
  .home-page .mobile-home-card {
    position: relative !important;
  }
  .home-page .mobile-home-card-art,
  .home-page .mobile-home-card-cycle {
    filter: brightness(1.01) contrast(1.04) saturate(.96) !important;
  }
  .home-page .mobile-home-card-cycle.is-active {
    opacity: 1 !important;
  }
  .home-page .mobile-home-card-visual::after {
    display: block !important;
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    pointer-events: none !important;
    background: linear-gradient(180deg, rgba(0,0,0,0) 58%, rgba(0,0,0,.22) 100%) !important;
  }
  .home-page .mobile-home-card-logo {
    width: clamp(168px, 54vw, 252px) !important;
    max-width: 62vw !important;
  }
  .home-page .mobile-home-card-copy {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 6 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }
  .home-page .mobile-home-card-copy .eyebrow {
    display: block !important;
    position: absolute !important;
    left: 16px !important;
    bottom: 62px !important;
    margin: 0 !important;
    max-width: calc(100% - 144px) !important;
    font: 700 8px/1.35 var(--mono) !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
    color: rgba(243,240,232,.86) !important;
    text-shadow: 0 12px 28px rgba(0,0,0,.78) !important;
  }
  .home-page .mobile-home-card-copy p:not(.eyebrow) {
    display: none !important;
  }

  /* HOMEPAGE / route cards: smaller titles under Twój K., keep button at right. */
  .home-page .mobile-index-copy h2 {
    max-width: calc(100% - 126px) !important;
    font-size: clamp(16px, 5.15vw, 24px) !important;
    line-height: .98 !important;
    letter-spacing: .12em !important;
  }
  .home-page .mobile-index-copy {
    left: 16px !important;
    right: 16px !important;
    bottom: 16px !important;
  }
  .home-page .mobile-index-action {
    bottom: 14px !important;
  }

  /* COMMERCIAL WORK / mobile: fully remove the project pills/rail. */
  body.works-page nav.works-v92-rail,
  body.works-page .works-v92-rail,
  body.works-page .works-v92-rail * {
    display: none !important;
    visibility: hidden !important;
  }
  body.works-page .works-v92-rail {
    position: absolute !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
  body.works-page .works-v92-intro {
    padding-top: calc(var(--mobile-header-h) + 22px) !important;
  }

  /* PERSONAL WORK / mobile: remove the top slideshow/carousel entirely; keep filters + tiles. */
  body.personal-v151 .pa93-opener,
  body.personal-v151 .pa94-carousel,
  body.personal-v151 .pa128-carousel-arrow,
  body.personal-v151 .pa94-arrow {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    max-height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  body.personal-v151 .personal-v151-main,
  body.personal-v151 main {
    padding-top: var(--mobile-header-h) !important;
  }
  body.personal-v151 .pa151-brick-section {
    padding-top: 0 !important;
  }
  body.personal-v151 .pa151-filter-bar {
    top: var(--mobile-header-h) !important;
  }
}

@media (max-width: 420px) {
  .home-page .mobile-home-card-logo {
    width: clamp(160px, 52vw, 220px) !important;
    max-width: 60vw !important;
  }
  .home-page .mobile-home-card-copy .eyebrow {
    left: 12px !important;
    bottom: 58px !important;
    max-width: calc(100% - 126px) !important;
    font-size: 7px !important;
    letter-spacing: .16em !important;
  }
  .home-page .mobile-index-copy h2 {
    max-width: calc(100% - 116px) !important;
    font-size: clamp(15px, 5vw, 21px) !important;
    letter-spacing: .11em !important;
  }
}

/* v240 — mobile-only repair pass: stable home stack, clean commercial, reliable personal gallery. Desktop untouched. */
.pa-mobile-gallery { display: none; }
@media (max-width: 900px) {
  html, body { overflow-x: hidden !important; background: #000 !important; }

  .site-header {
    height: var(--mobile-header-h) !important;
    min-height: var(--mobile-header-h) !important;
    background: #000 !important;
    border-bottom: 1px solid rgba(243,240,232,.075) !important;
  }
  .site-header .brand-logo-img {
    height: 34px !important;
    max-width: 232px !important;
  }
  .mobile-menu-toggle {
    border-radius: 0 !important;
    background: #000 !important;
    border: 1px solid rgba(243,240,232,.30) !important;
    box-shadow: none !important;
  }

  /* HOME: phone version is a deliberate vertical index. Hide all desktop hero layers. */
  .home-page .home-hero {
    display: block !important;
    width: 100% !important;
    padding-top: var(--mobile-header-h) !important;
    margin: 0 !important;
    background: #000 !important;
    overflow: hidden !important;
  }
  .home-page .home-case {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #000 !important;
    isolation: isolate !important;
  }
  .home-page .home-case::before,
  .home-page .home-case::after,
  .home-page .home-case > .home-case-art,
  .home-page .home-case > .case-gradient,
  .home-page .home-case > .home-case-topline,
  .home-page .home-case > .home-case-content,
  .home-page .home-case > .home-case-hover-zone {
    display: none !important;
    content: none !important;
  }
  .home-page .mobile-home-card {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #000 !important;
    overflow: hidden !important;
  }
  .home-page .mobile-home-card-visual {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 16 / 10.4 !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: #000 !important;
    border-bottom: 1px solid rgba(243,240,232,.08) !important;
  }
  .home-page .mobile-home-card-art,
  .home-page .mobile-home-card-cycle {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center center !important;
    opacity: 0 !important;
    transform: scale(1.006) !important;
    filter: brightness(1) contrast(1.04) saturate(.96) !important;
    transition: opacity 1.05s cubic-bezier(.22,.72,.16,1), transform 5.8s linear !important;
  }
  .home-page .mobile-home-card-cycle.is-active {
    opacity: 1 !important;
    transform: scale(1.035) !important;
  }
  .home-page .mobile-home-card-visual::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    pointer-events: none !important;
    background:
      linear-gradient(180deg, rgba(0,0,0,0) 62%, rgba(0,0,0,.34) 100%),
      linear-gradient(90deg, rgba(0,0,0,.20), rgba(0,0,0,0) 50%, rgba(0,0,0,.20)) !important;
  }
  .home-page .mobile-home-card-logo {
    position: absolute !important;
    left: 16px !important;
    right: auto !important;
    top: auto !important;
    bottom: 16px !important;
    z-index: 5 !important;
    width: clamp(154px, 48vw, 220px) !important;
    max-width: 52vw !important;
    height: auto !important;
    opacity: .98 !important;
    transform: none !important;
    filter: drop-shadow(0 14px 32px rgba(0,0,0,.82)) !important;
  }
  .home-page .mobile-home-image-action,
  .home-page .mobile-home-card .home-case-action {
    position: absolute !important;
    right: 16px !important;
    left: auto !important;
    bottom: 16px !important;
    z-index: 6 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 14px !important;
    border: 1px solid rgba(243,240,232,.42) !important;
    border-radius: 0 !important;
    color: rgba(243,240,232,.92) !important;
    background: rgba(0,0,0,.28) !important;
    font: 700 8px/1 var(--mono) !important;
    letter-spacing: .16em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    backdrop-filter: blur(2px) !important;
    -webkit-backdrop-filter: blur(2px) !important;
  }
  .home-page .mobile-home-image-action::after {
    content: "" !important;
    display: inline-block !important;
    width: 26px !important;
    height: 1px !important;
    margin-left: 12px !important;
    background: rgba(243,240,232,.62) !important;
  }
  .home-page .mobile-home-card-copy {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 6 !important;
    pointer-events: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .home-page .mobile-home-card-copy .eyebrow {
    display: block !important;
    position: absolute !important;
    left: 16px !important;
    bottom: 62px !important;
    margin: 0 !important;
    max-width: calc(100% - 148px) !important;
    font: 700 8px/1.35 var(--mono) !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
    color: rgba(243,240,232,.88) !important;
    text-shadow: 0 12px 28px rgba(0,0,0,.78) !important;
  }
  .home-page .mobile-home-card-copy p:not(.eyebrow) { display: none !important; }

  .home-page .home-routes,
  .home-page .home-routes-v132,
  .home-page .home-video,
  .home-page .home-video-band { display: none !important; }

  .home-page .mobile-home-index {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    width: 100% !important;
    padding: 8px 0 58px !important;
    margin: 0 !important;
    background: #000 !important;
  }
  .home-page .mobile-index-card {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 16 / 10.4 !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: #030303 !important;
    border: 0 !important;
    color: var(--fg) !important;
    text-decoration: none !important;
  }
  .home-page .mobile-index-art,
  .home-page .mobile-index-cycle,
  .home-page .mobile-index-video {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    opacity: 0 !important;
    filter: brightness(.76) contrast(1.06) saturate(.92) !important;
    transform: scale(1.006) !important;
    transition: opacity 1.05s cubic-bezier(.22,.72,.16,1), transform 5.8s linear !important;
  }
  .home-page .mobile-index-cycle.is-active {
    opacity: 1 !important;
    transform: scale(1.035) !important;
  }
  .home-page .mobile-index-video { opacity: 0 !important; }
  .home-page .mobile-index-shade {
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    pointer-events: none !important;
    background:
      linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.22) 48%, rgba(0,0,0,.78)),
      linear-gradient(90deg, rgba(0,0,0,.30), rgba(0,0,0,0) 55%, rgba(0,0,0,.30)) !important;
  }
  .home-page .mobile-index-copy {
    position: absolute !important;
    z-index: 5 !important;
    left: 16px !important;
    right: 16px !important;
    bottom: 16px !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 14px !important;
    text-shadow: 0 12px 30px rgba(0,0,0,.76) !important;
  }
  .home-page .mobile-index-kicker { display: none !important; }
  .home-page .mobile-index-copy h2 {
    margin: 0 !important;
    max-width: 57% !important;
    color: rgba(243,240,232,.95) !important;
    font: 700 clamp(16px, 5.2vw, 24px)/.98 var(--mono) !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
  }
  .home-page .mobile-index-action {
    position: static !important;
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 12px !important;
    border: 1px solid rgba(243,240,232,.42) !important;
    background: rgba(0,0,0,.30) !important;
    color: rgba(243,240,232,.90) !important;
    font: 700 8px/1 var(--mono) !important;
    letter-spacing: .15em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }
  .home-page .mobile-index-action::after {
    content: "" !important;
    display: inline-block !important;
    width: 24px !important;
    height: 1px !important;
    margin-left: 10px !important;
    background: rgba(243,240,232,.58) !important;
  }

  /* COMMERCIAL WORK: no project buttons/rail, no leftover middle line/pseudo overlays. */
  body.works-page .works-v92-main::before,
  body.works-page .works-v92-main::after,
  body.works-page .works-v112-top-art,
  body.works-page .works-v112-top-art::before,
  body.works-page .works-v112-top-art::after,
  body.works-page .works-v92-rail,
  body.works-page .works-v92-rail::before,
  body.works-page .works-v92-rail::after,
  body.works-page .works-v92-rail * {
    display: none !important;
    content: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }
  body.works-page .works-v92-main {
    padding-top: var(--mobile-header-h) !important;
    overflow-x: hidden !important;
    background: #000 !important;
  }
  body.works-page .works-v92-intro {
    min-height: 0 !important;
    padding-top: 34px !important;
    padding-bottom: 30px !important;
    width: min(100% - 28px, 720px) !important;
  }
  body.works-page .works-v92-content {
    width: min(100% - 28px, 720px) !important;
    padding-top: 0 !important;
  }
  body.works-page .works-v92-case { padding: 36px 0 50px !important; }
  body.works-page .works-v92 figure::before,
  body.works-page .works-v92 figure::after,
  body.works-page .asset-card::before,
  body.works-page .asset-card::after {
    display: none !important;
    content: none !important;
    opacity: 0 !important;
    background: none !important;
    box-shadow: none !important;
  }
  body.works-page .commercial-v173-layout,
  body.works-page .commercial-v173-grid,
  body.works-page .commercial-v173-grid-two,
  body.works-page .commercial-v173-grid-three,
  body.works-page .commercial-v173-portrait-grid,
  body.works-page .works-v92-grid,
  body.works-page .works-v92-mosaic {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
  }
  body.works-page .works-v92 figure,
  body.works-page .asset-card,
  body.works-page .commercial-v173-full {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 0 14px !important;
    background: #000 !important;
    overflow: hidden !important;
    transform: none !important;
  }
  body.works-page .works-v92 figure img,
  body.works-page .asset-card img {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: 82svh !important;
    object-fit: contain !important;
    object-position: center center !important;
    background: #000 !important;
    filter: none !important;
    transform: none !important;
  }
  body.works-page .asset-card figcaption { opacity: 1 !important; }
  body.works-page .work-side-panel { display: none !important; }

  /* PERSONAL WORK: replace unstable desktop bricks with a dedicated mobile archive grid. */
  body.personal-v151 .pa93-opener,
  body.personal-v151 .pa94-carousel,
  body.personal-v151 .pa128-carousel-arrow,
  body.personal-v151 .pa94-arrow,
  body.personal-v151 .pa151-brick-gallery {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    max-height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  body.personal-v151 main,
  body.personal-v151 .personal-v151-main {
    padding-top: var(--mobile-header-h) !important;
    background: #000 !important;
  }
  body.personal-v151 .pa151-filter-bar {
    position: sticky !important;
    top: var(--mobile-header-h) !important;
    z-index: 34 !important;
    display: flex !important;
    gap: 8px !important;
    overflow-x: auto !important;
    padding: 12px 12px !important;
    background: #000 !important;
    border-top: 1px solid rgba(243,240,232,.08) !important;
    border-bottom: 1px solid rgba(243,240,232,.10) !important;
    scrollbar-width: none !important;
  }
  body.personal-v151 .pa151-filter-bar::-webkit-scrollbar { display: none !important; }
  body.personal-v151 .pa151-filter {
    flex: 0 0 auto !important;
    min-height: 38px !important;
    padding: 0 14px !important;
    border: 1px solid rgba(243,240,232,.20) !important;
    border-radius: 0 !important;
    background: rgba(255,255,255,.025) !important;
    color: rgba(243,240,232,.76) !important;
    font: 700 8px/1 var(--mono) !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }
  body.personal-v151 .pa151-filter.is-active {
    border-color: rgba(243,240,232,.62) !important;
    color: #fff !important;
  }
  body.personal-v151 .pa-mobile-gallery {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    padding: 7px 7px 64px !important;
    margin: 0 !important;
    width: 100% !important;
    background: #000 !important;
  }
  body.personal-v151 .pa-mobile-tile {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: 4 / 5 !important;
    overflow: hidden !important;
    background: #050505 !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    color: var(--fg) !important;
    text-align: left !important;
  }
  body.personal-v151 .pa-mobile-tile.is-wide {
    grid-column: span 2 !important;
    aspect-ratio: 16 / 8.8 !important;
  }
  body.personal-v151 .pa-mobile-tile.is-square { aspect-ratio: 1 / 1 !important; }
  body.personal-v151 .pa-mobile-tile img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center center !important;
    filter: brightness(.86) contrast(1.04) saturate(.94) !important;
  }
  body.personal-v151 .pa-mobile-tile::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background: linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0,.70) 100%) !important;
  }
  body.personal-v151 .pa-mobile-tile span,
  body.personal-v151 .pa-mobile-tile em {
    position: absolute !important;
    z-index: 2 !important;
    bottom: 10px !important;
    color: rgba(243,240,232,.90) !important;
    font-family: var(--mono) !important;
    font-size: 7px !important;
    line-height: 1 !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    pointer-events: none !important;
  }
  body.personal-v151 .pa-mobile-tile span { left: 10px !important; right: 58px !important; }
  body.personal-v151 .pa-mobile-tile em { right: 10px !important; color: rgba(243,240,232,.62) !important; }
}
@media (max-width: 420px) {
  .site-header .brand-logo-img { height: 32px !important; max-width: 220px !important; }
  .home-page .mobile-home-card-visual,
  .home-page .mobile-index-card { aspect-ratio: 4 / 3.06 !important; }
  .home-page .mobile-home-card-logo { width: clamp(148px, 45vw, 196px) !important; }
  .home-page .mobile-home-card-copy .eyebrow { font-size: 7px !important; bottom: 58px !important; }
  .home-page .mobile-index-copy h2 { font-size: clamp(15px, 5vw, 21px) !important; }
  .home-page .mobile-index-action { font-size: 7px !important; padding: 0 10px !important; }
}


/* v254 — soft-pin helmet depth. Natural scroll never stops. */
.helmet-depth-section {
  position: relative;
  height: 108vh;
  height: 108svh;
  min-height: 860px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #000;
}

.helmet-depth-stage {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: inherit;
  overflow: hidden;
  isolation: isolate;
  background: #000;
  transform: translate3d(0,-36vh,0);
  will-change: transform;
}

.helmet-depth-atmosphere,
.helmet-depth-layout {
  position: absolute;
  inset: 0;
}

.helmet-depth-atmosphere {
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.helmet-depth-atmosphere-far,
.helmet-depth-atmosphere-near {
  position: absolute;
  display: block;
  pointer-events: none;
  will-change: transform, opacity;
}

.helmet-depth-atmosphere-far {
  inset: -8%;
  background:
    radial-gradient(ellipse 66vw 58vh at 19% 53%, rgba(243,240,232,.052), transparent 60%),
    radial-gradient(ellipse 44vw 40vh at 41% 49%, rgba(243,240,232,.018), transparent 68%),
    linear-gradient(180deg, #000 0%, rgba(0,0,0,.965) 45%, #000 100%);
  opacity: .96;
  transform: translate3d(0,-10px,0) scale(1.03);
}

.helmet-depth-atmosphere-near {
  left: -3%;
  top: 12%;
  width: min(72vw, 1380px);
  height: 74%;
  background:
    radial-gradient(ellipse at 24% 51%, rgba(243,240,232,.066), transparent 44%),
    radial-gradient(ellipse at 57% 54%, rgba(243,240,232,.024), transparent 58%);
  filter: blur(30px);
  opacity: .72;
  transform: translate3d(0,-18px,0);
}

.helmet-depth-layout {
  z-index: 1;
}

.helmet-depth-main,
.helmet-depth-studies,
.helmet-depth-copy {
  position: absolute;
  margin: 0;
}

.helmet-depth-main {
  z-index: 3;
  left: clamp(30px, 4.3vw, 104px);
  top: 50%;
  width: clamp(420px, 25vw, 590px);
  opacity: .48;
  transform: translate3d(0,34px,0) translateY(-50%);
  will-change: transform, opacity;
}

.helmet-depth-main img,
.helmet-depth-study img {
  display: block;
  width: 100%;
  height: auto;
}

.helmet-depth-main img {
  filter: brightness(.30) contrast(1.1) saturate(.9) drop-shadow(0 42px 78px rgba(0,0,0,.58));
  will-change: filter;
}

.helmet-depth-studies {
  z-index: 2;
  left: clamp(500px, 30vw, 720px);
  top: 50%;
  width: clamp(292px, 18.2vw, 420px);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: clamp(18px, 1.55vw, 34px);
  transform: translate3d(0,13px,0) translateY(-50%);
  will-change: transform;
}

.helmet-depth-study {
  position: relative;
  width: 100%;
  margin: 0;
  opacity: 0;
  will-change: opacity;
}

.helmet-depth-study img {
  opacity: .88;
  filter: brightness(.90) contrast(1.08) saturate(.9) drop-shadow(0 22px 46px rgba(0,0,0,.46));
}

.helmet-depth-copy {
  z-index: 4;
  right: clamp(64px, 7.2vw, 170px);
  top: 50%;
  width: clamp(330px, 24vw, 470px);
  transform: translateY(-50%);
  text-align: left;
}

.helmet-depth-copy .eyebrow {
  margin: 0 0 clamp(16px, 1.8vh, 24px);
  color: rgba(255,255,255,.44);
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
}

.helmet-depth-copy h2 {
  margin: 0;
  color: #f4f3ef;
  font-size: clamp(44px, 4.2vw, 86px);
  font-weight: 500;
  line-height: .92;
  letter-spacing: -.055em;
}

.helmet-depth-copy > p:not(.eyebrow) {
  max-width: 40ch;
  margin: clamp(18px, 2.2vh, 28px) 0 0;
  color: rgba(255,255,255,.55);
  font-size: clamp(12px, .86vw, 15px);
  line-height: 1.65;
}

.helmet-depth-readout {
  display: flex;
  gap: 24px;
  margin-top: clamp(22px, 3vh, 34px);
  color: rgba(255,255,255,.28);
  font-size: 9px;
  letter-spacing: .2em;
  text-transform: uppercase;
}

@media (min-width: 1900px) {
  .helmet-depth-main { left: clamp(42px, 4.5vw, 124px); }
  .helmet-depth-studies { left: clamp(610px, 30.6vw, 800px); }
  .helmet-depth-copy { right: clamp(92px, 8.8vw, 240px); }
}

@media (max-width: 1180px) and (min-width: 961px) {
  .helmet-depth-main {
    width: clamp(390px, 36vw, 500px);
    left: 26px;
  }

  .helmet-depth-studies {
    left: clamp(420px, 40vw, 520px);
    width: clamp(244px, 24vw, 320px);
  }

  .helmet-depth-copy {
    right: 34px;
    width: min(31vw, 360px);
  }
}

@media (max-width: 960px) {
  .helmet-depth-section {
    height: auto;
    min-height: 0;
    padding: 96px 22px 110px;
    overflow: hidden;
  }

  .helmet-depth-stage {
    position: relative;
    height: auto;
    min-height: 0;
    overflow: visible;
    transform: none;
  }

  .helmet-depth-atmosphere {
    inset: -8% -22px;
  }

  .helmet-depth-layout {
    position: relative;
    inset: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(160px, 34vw);
    gap: 28px 18px;
    align-items: center;
  }

  .helmet-depth-main,
  .helmet-depth-studies,
  .helmet-depth-copy {
    position: relative;
    inset: auto;
    top: auto;
    right: auto;
    left: auto;
    width: auto;
    transform: none;
  }

  .helmet-depth-main {
    grid-column: 1;
    grid-row: 1;
    opacity: 1;
  }

  .helmet-depth-main img {
    filter: brightness(.94) contrast(1.1) saturate(.92) drop-shadow(0 42px 78px rgba(0,0,0,.58));
  }

  .helmet-depth-studies {
    grid-column: 2;
    grid-row: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }

  .helmet-depth-study {
    opacity: 1;
  }

  .helmet-depth-study img {
    filter: brightness(.9) contrast(1.08) saturate(.9) drop-shadow(0 22px 46px rgba(0,0,0,.46));
  }

  .helmet-depth-copy {
    grid-column: 1 / -1;
    grid-row: 2;
    max-width: 520px;
    padding-top: 18px;
  }

  .helmet-depth-copy h2 {
    font-size: clamp(42px, 12vw, 68px);
  }
}


/* v256 — third helmet study added without altering the v254 motion model. */
@media (min-width: 961px) {
  .helmet-depth-studies {
    width: clamp(390px, 22.5vw, 520px);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(12px, 1.05vw, 22px);
  }
  .helmet-depth-study-lineart img {
    opacity: .92;
    filter: drop-shadow(0 22px 46px rgba(0,0,0,.46));
  }
}

@media (max-width: 1180px) and (min-width: 961px) {
  .helmet-depth-studies {
    left: clamp(408px, 38vw, 492px);
    width: clamp(300px, 28vw, 360px);
    gap: 10px;
  }
}

@media (max-width: 960px) {
  .helmet-depth-studies {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
  }
}

/* v258 — restore the intended study size and equalize all three by visible height. */
@media (min-width: 961px) {
  .helmet-depth-studies {
    width: clamp(500px, 30vw, 650px);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: center;
    gap: clamp(14px, 1.2vw, 24px);
  }

  .helmet-depth-study {
    height: clamp(145px, 9.5vw, 190px);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .helmet-depth-study img,
  .helmet-depth-study-lineart img {
    width: auto;
    height: 100%;
    max-width: 100%;
    object-fit: contain;
    margin: 0 auto;
  }
}

@media (max-width: 1180px) and (min-width: 961px) {
  .helmet-depth-studies {
    left: clamp(408px, 38vw, 492px);
    width: clamp(430px, 40vw, 500px);
  }
  .helmet-depth-study {
    height: clamp(132px, 12vw, 160px);
  }
}

/* v259 — restore stacked studies and make the line-art study the larger third view. */
@media (min-width: 961px) {
  .helmet-depth-studies {
    width: clamp(430px, 27vw, 590px);
    display: grid;
    grid-template-columns: minmax(118px, .72fr) minmax(190px, 1.28fr);
    grid-template-rows: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "side lineart"
      "front lineart";
    align-items: center;
    column-gap: clamp(20px, 1.45vw, 34px);
    row-gap: clamp(8px, .7vw, 15px);
  }

  .helmet-depth-study {
    width: 100%;
    height: auto;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .helmet-depth-study-side { grid-area: side; }
  .helmet-depth-study-front { grid-area: front; }
  .helmet-depth-study-lineart { grid-area: lineart; }

  .helmet-depth-study-side img,
  .helmet-depth-study-front img {
    width: auto;
    height: clamp(112px, 7.2vw, 150px);
    max-width: 100%;
    object-fit: contain;
    margin: 0 auto;
  }

  .helmet-depth-study-lineart img {
    width: auto;
    height: clamp(196px, 12.6vw, 265px);
    max-width: 100%;
    object-fit: contain;
    margin: 0 auto;
  }
}

@media (max-width: 1180px) and (min-width: 961px) {
  .helmet-depth-studies {
    left: clamp(408px, 38vw, 492px);
    width: clamp(390px, 38vw, 470px);
    grid-template-columns: minmax(104px, .72fr) minmax(170px, 1.28fr);
    column-gap: 18px;
    row-gap: 8px;
  }

  .helmet-depth-study-side img,
  .helmet-depth-study-front img {
    height: clamp(100px, 10vw, 126px);
  }

  .helmet-depth-study-lineart img {
    height: clamp(174px, 17vw, 220px);
  }
}

@media (max-width: 960px) {
  .helmet-depth-studies {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "side lineart"
      "front lineart";
    align-items: center;
    gap: 10px 14px;
  }

  .helmet-depth-study-side { grid-area: side; }
  .helmet-depth-study-front { grid-area: front; }
  .helmet-depth-study-lineart { grid-area: lineart; }

  .helmet-depth-study-side img,
  .helmet-depth-study-front img {
    width: auto;
    height: clamp(76px, 18vw, 126px);
    max-width: 100%;
  }

  .helmet-depth-study-lineart img {
    width: auto;
    height: clamp(132px, 31vw, 220px);
    max-width: 100%;
  }
}

/* v260 — restore large stacked studies; keep lineart size and anchor it to the copy block. */
@media (min-width: 961px) {
  .helmet-depth-studies {
    left: clamp(500px, 30vw, 720px);
    top: 50%;
    width: clamp(150px, 9.5vw, 200px);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(22px, 2.2vh, 34px);
    transform: translate3d(0,13px,0) translateY(-50%);
  }

  .helmet-depth-study-side,
  .helmet-depth-study-front {
    width: 100%;
    height: clamp(145px, 9.5vw, 190px);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .helmet-depth-study-side img,
  .helmet-depth-study-front img {
    width: auto;
    height: 100%;
    max-width: 100%;
    object-fit: contain;
    margin: 0 auto;
  }

  .helmet-depth-study-lineart {
    position: absolute;
    z-index: 3;
    right: calc(clamp(64px, 7.2vw, 170px) + clamp(330px, 24vw, 470px) + clamp(14px, 1.2vw, 26px));
    top: 50%;
    width: auto;
    height: clamp(196px, 12.6vw, 265px);
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translate3d(0,13px,0) translateY(-50%);
    will-change: transform, opacity;
  }

  .helmet-depth-study-lineart img {
    width: auto;
    height: 100%;
    max-width: none;
    object-fit: contain;
    margin: 0;
  }
}

@media (min-width: 1900px) {
  .helmet-depth-study-lineart {
    right: calc(clamp(92px, 8.8vw, 240px) + clamp(330px, 24vw, 470px) + clamp(16px, 1.25vw, 30px));
  }
}

@media (max-width: 1180px) and (min-width: 961px) {
  .helmet-depth-studies {
    left: clamp(420px, 40vw, 520px);
    width: clamp(138px, 13vw, 165px);
    gap: 18px;
  }
  .helmet-depth-study-side,
  .helmet-depth-study-front {
    height: clamp(132px, 12vw, 160px);
  }
  .helmet-depth-study-lineart {
    right: calc(34px + min(31vw, 360px) + 14px);
    height: clamp(174px, 17vw, 220px);
  }
}

/* v261 — enlarge the two stacked rendered studies; mirror only the line-art image. */
@media (min-width: 961px) {
  .helmet-depth-studies {
    width: clamp(195px, 12.5vw, 260px);
    gap: clamp(16px, 1.6vh, 24px);
  }

  .helmet-depth-study-side,
  .helmet-depth-study-front {
    height: clamp(188px, 12.2vw, 248px);
  }

  .helmet-depth-study-lineart img {
    transform: scaleX(-1);
    transform-origin: center center;
  }
}

@media (max-width: 1180px) and (min-width: 961px) {
  .helmet-depth-studies {
    width: clamp(172px, 16vw, 215px);
    gap: 16px;
  }

  .helmet-depth-study-side,
  .helmet-depth-study-front {
    height: clamp(166px, 15.5vw, 205px);
  }
}


/* v262 — restore study order; return lineart beside the pair and remove mirroring. */
@media (min-width: 961px) {
  .helmet-depth-study-lineart {
    left: calc(clamp(500px, 30vw, 720px) + clamp(195px, 12.5vw, 260px) + clamp(24px, 2vw, 42px));
    right: auto;
    top: 50%;
    transform: translate3d(0,13px,0) translateY(-50%);
  }

  .helmet-depth-study-lineart img {
    transform: none;
    transform-origin: center center;
  }
}

@media (max-width: 1180px) and (min-width: 961px) {
  .helmet-depth-study-lineart {
    left: calc(clamp(420px, 40vw, 520px) + clamp(172px, 16vw, 215px) + 20px);
    right: auto;
  }
}

/* v266 — mobile bugfix: remove legacy Works rail residue and transparentize Twój K. overlay. */
@media (max-width: 900px) {
  /* A legacy high-specificity rule kept the hidden Works rail fixed at 36vh.
     Its zero-height border was the horizontal line crossing the artwork. */
  html body.works-page.works-v115 .works-v92-main > nav.works-v92-rail,
  html body.works-page.works-v115 .works-v92-main > .works-v92-rail {
    display: none !important;
    visibility: hidden !important;
    position: absolute !important;
    inset: 0 auto auto 0 !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  html body.works-page.works-v115 .works-v92-main > nav.works-v92-rail::before,
  html body.works-page.works-v115 .works-v92-main > nav.works-v92-rail::after,
  html body.works-page.works-v115 .works-v92-main > nav.works-v92-rail * {
    display: none !important;
    content: none !important;
    border: 0 !important;
  }

  /* The copy layer must only position text over the hero.
     Earlier mobile rules left a 460px-wide black background on this layer. */
  html body.home-page .mobile-home-card-copy {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 100% !important;
    box-sizing: border-box !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }
}


/* v267 — mobile Personal Work filters: hidden must override the tile's forced display. */
@media (max-width: 900px) {
  html body.personal-v151 .pa-mobile-gallery .pa-mobile-tile[hidden],
  html body.personal-v151 .pa-mobile-gallery .pa-mobile-tile.is-mobile-filter-hidden {
    display: none !important;
  }
  html body.personal-v151 .pa151-filter-bar,
  html body.personal-v151 .pa151-filter {
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }
}

/* v268 — mobile-only alignment fixes for the Twój K. home card and helmet studies. */
@media (max-width: 900px) {
  /* Keep the Twój K. logo untouched; move only the project descriptor above the CTA. */
  html body.home-page .mobile-home-card-copy .eyebrow {
    left: auto !important;
    right: 16px !important;
    bottom: 60px !important;
    width: clamp(142px, 40vw, 170px) !important;
    max-width: none !important;
    text-align: left !important;
  }

  /* Keep all helmet studies in the same upper visual row on mobile. */
  html body .helmet-depth-layout {
    grid-template-columns: minmax(0, 1fr) minmax(160px, 34vw) !important;
  }

  html body .helmet-depth-studies {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    align-self: center !important;
    width: 43% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
    transform: none !important;
  }

  html body .helmet-depth-study-side,
  html body .helmet-depth-study-front {
    width: 100% !important;
    height: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html body .helmet-depth-study-side img,
  html body .helmet-depth-study-front img {
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    object-fit: contain !important;
  }

  html body .helmet-depth-study-lineart {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    width: 53% !important;
    height: auto !important;
    margin: 0 !important;
    transform: none !important;
  }

  html body .helmet-depth-study-lineart img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    object-fit: contain !important;
    margin: 0 !important;
    transform: none !important;
  }
}


/* v269 — more breathing room between helmet studies and safer storyboard stepping. */
@media (min-width: 961px) {
  /* Keep all study sizes unchanged; increase only the negative space. */
  html body .helmet-depth-studies {
    gap: clamp(34px, 3vh, 52px) !important;
  }

  html body .helmet-depth-study-lineart {
    left: calc(
      clamp(500px, 30vw, 720px)
      + clamp(195px, 12.5vw, 260px)
      + clamp(58px, 3.2vw, 88px)
    ) !important;
  }
}

@media (max-width: 1180px) and (min-width: 961px) {
  html body .helmet-depth-studies {
    gap: clamp(26px, 2.5vh, 38px) !important;
  }

  html body .helmet-depth-study-lineart {
    left: calc(
      clamp(420px, 40vw, 520px)
      + clamp(172px, 16vw, 215px)
      + clamp(34px, 3vw, 50px)
    ) !important;
  }
}

@media (min-width: 821px) and (prefers-reduced-motion: no-preference) {
  /* 270svh of usable sticky travel: about 52svh per frame, plus a calm hold on frame 05. */
  html body .frames.story-cinema {
    height: 370vh !important;
    height: 370svh !important;
  }
}

/* v270 — scroll-revealed distant image behind the helmet study. */
.helmet-depth-backdrop {
  position: absolute;
  inset: -3%;
  z-index: 1;
  margin: 0;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(0,22px,0) scale(1.035);
  transform-origin: center center;
  will-change: transform, opacity;
}

.helmet-depth-backdrop img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 39%;
  filter: brightness(.12) contrast(1.16) saturate(.58);
  will-change: filter;
}

.helmet-depth-backdrop::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg,
      rgba(0,0,0,.10) 0%,
      rgba(0,0,0,.08) 43%,
      rgba(0,0,0,.34) 64%,
      rgba(0,0,0,.83) 82%,
      #000 100%),
    linear-gradient(180deg,
      #000 0%,
      rgba(0,0,0,.20) 18%,
      rgba(0,0,0,.10) 67%,
      #000 100%);
}

.helmet-depth-atmosphere-far { z-index: 0; }
.helmet-depth-atmosphere-near { z-index: 2; }

@media (max-width: 960px) {
  .helmet-depth-backdrop {
    inset: -5% -22px;
    transform: translate3d(0,12px,0) scale(1.035);
  }

  .helmet-depth-backdrop img {
    object-position: 50% 24%;
  }

  .helmet-depth-backdrop::after {
    background:
      linear-gradient(90deg,
        rgba(0,0,0,.20) 0%,
        rgba(0,0,0,.12) 52%,
        rgba(0,0,0,.50) 78%,
        #000 100%),
      linear-gradient(180deg,
        #000 0%,
        rgba(0,0,0,.22) 16%,
        rgba(0,0,0,.18) 72%,
        #000 100%);
  }
}


/* v271 — smaller, brighter helmet backdrop with a soft black falloff. */
.helmet-depth-backdrop {
  inset: 0;
  overflow: hidden;
}

.helmet-depth-backdrop img {
  position: absolute;
  left: 45%;
  top: 48%;
  width: min(78vw, 1500px);
  height: min(72vh, 760px);
  object-fit: contain;
  object-position: center;
  transform: translate(-50%, -50%);
  -webkit-mask-image: radial-gradient(
    ellipse 66% 60% at 50% 49%,
    #000 0%,
    #000 36%,
    rgba(0,0,0,.94) 52%,
    rgba(0,0,0,.58) 70%,
    transparent 100%
  );
  mask-image: radial-gradient(
    ellipse 66% 60% at 50% 49%,
    #000 0%,
    #000 36%,
    rgba(0,0,0,.94) 52%,
    rgba(0,0,0,.58) 70%,
    transparent 100%
  );
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

.helmet-depth-backdrop::after {
  background:
    radial-gradient(
      ellipse 52% 48% at 43% 48%,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,.05) 34%,
      rgba(0,0,0,.34) 58%,
      rgba(0,0,0,.76) 78%,
      #000 100%
    ),
    linear-gradient(90deg,
      rgba(0,0,0,.20) 0%,
      rgba(0,0,0,.06) 35%,
      rgba(0,0,0,.18) 58%,
      rgba(0,0,0,.82) 82%,
      #000 100%),
    linear-gradient(180deg,
      #000 0%,
      rgba(0,0,0,.16) 18%,
      rgba(0,0,0,.12) 68%,
      #000 100%);
}

@media (max-width: 960px) {
  .helmet-depth-backdrop {
    inset: 0;
  }

  .helmet-depth-backdrop img {
    left: 50%;
    top: 39%;
    width: 118vw;
    height: min(50vh, 460px);
  }

  .helmet-depth-backdrop::after {
    background:
      radial-gradient(
        ellipse 68% 43% at 50% 38%,
        rgba(0,0,0,0) 0%,
        rgba(0,0,0,.12) 38%,
        rgba(0,0,0,.62) 72%,
        #000 100%
      ),
      linear-gradient(180deg,
        #000 0%,
        rgba(0,0,0,.18) 18%,
        rgba(0,0,0,.34) 62%,
        #000 100%);
  }
}

/* v272 — larger, brighter helmet backdrop shifted right for clearer depth separation. */
@media (min-width: 961px) {
  .helmet-depth-backdrop img {
    left: 60%;
    top: 49%;
    width: min(86vw, 1660px);
    height: min(78vh, 840px);
    -webkit-mask-image: radial-gradient(
      ellipse 72% 65% at 50% 49%,
      #000 0%,
      #000 42%,
      rgba(0,0,0,.96) 58%,
      rgba(0,0,0,.64) 76%,
      transparent 100%
    );
    mask-image: radial-gradient(
      ellipse 72% 65% at 50% 49%,
      #000 0%,
      #000 42%,
      rgba(0,0,0,.96) 58%,
      rgba(0,0,0,.64) 76%,
      transparent 100%
    );
  }

  .helmet-depth-backdrop::after {
    background:
      radial-gradient(
        ellipse 60% 54% at 58% 49%,
        rgba(0,0,0,0) 0%,
        rgba(0,0,0,.025) 38%,
        rgba(0,0,0,.26) 62%,
        rgba(0,0,0,.72) 82%,
        #000 100%
      ),
      linear-gradient(90deg,
        rgba(0,0,0,.34) 0%,
        rgba(0,0,0,.10) 26%,
        rgba(0,0,0,.04) 48%,
        rgba(0,0,0,.22) 68%,
        rgba(0,0,0,.82) 86%,
        #000 100%),
      linear-gradient(180deg,
        #000 0%,
        rgba(0,0,0,.10) 20%,
        rgba(0,0,0,.08) 68%,
        #000 100%);
  }
}

/* v272b — final backdrop tuning: slightly larger, further right, brighter. */
@media (min-width: 961px) {
  .helmet-depth-backdrop img {
    left: 64%;
    width: min(90vw, 1720px);
    height: min(82vh, 880px);
  }

  .helmet-depth-backdrop::after {
    background:
      radial-gradient(
        ellipse 64% 58% at 63% 49%,
        rgba(0,0,0,0) 0%,
        rgba(0,0,0,.015) 42%,
        rgba(0,0,0,.18) 64%,
        rgba(0,0,0,.66) 84%,
        #000 100%
      ),
      linear-gradient(90deg,
        rgba(0,0,0,.40) 0%,
        rgba(0,0,0,.12) 28%,
        rgba(0,0,0,.02) 52%,
        rgba(0,0,0,.14) 70%,
        rgba(0,0,0,.78) 88%,
        #000 100%),
      linear-gradient(180deg,
        #000 0%,
        rgba(0,0,0,.07) 22%,
        rgba(0,0,0,.06) 68%,
        #000 100%);
  }
}

/* v275 — keep the top and bottom edges unchanged; soften only the left and right image edges. */
.helmet-depth-backdrop img {
  -webkit-mask-image: linear-gradient(
    90deg,
    transparent 0%,
    rgba(0,0,0,.42) 4%,
    #000 10%,
    #000 90%,
    rgba(0,0,0,.42) 96%,
    transparent 100%
  );
  mask-image: linear-gradient(
    90deg,
    transparent 0%,
    rgba(0,0,0,.42) 4%,
    #000 10%,
    #000 90%,
    rgba(0,0,0,.42) 96%,
    transparent 100%
  );
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}