/* v63 — refine inner section headings to match index more closely. */
/* 3D section heading: anchor it more deliberately within the composition. */
html body #work[data-cat="animation3d"] .section-heading > div {
  padding-left: clamp(8px, 1vw, 18px) !important;
}
html body #work[data-cat="animation3d"] #workHeading {
  font-size: clamp(50px, 6.2vw, 100px) !important;
  line-height: .84 !important;
  max-width: 9.2ch !important;
  transform: rotate(1deg) !important;
  color: #f1f5fb !important;
}

/* Art 2D: slightly larger and with the index accent color. */
html body #work[data-cat="art2d"] #workHeading {
  font-size: clamp(62px, 8.1vw, 122px) !important;
  line-height: .84 !important;
  color: var(--od-acid) !important;
}

/* Storyboard: same index logic — delicate script, lighter rhythm, special ampersand. */
html body #work[data-cat="storyboard"] #workHeading {
  font-family: 'Mea Culpa', cursive !important;
  font-weight: 400 !important;
  font-size: clamp(58px, 6.8vw, 108px) !important;
  line-height: .8 !important;
  letter-spacing: .01em !important;
  color: #f4edf9 !important;
  transform: rotate(-2.2deg) !important;
  max-width: 8.3ch !important;
}
html body #work[data-cat="storyboard"] #workHeading .story-amp {
  font-family: 'UnifrakturCook', serif !important;
  font-size: .68em !important;
  display: inline-block !important;
  transform: translateY(-.04em) rotate(-10deg) !important;
  color: var(--od-ice) !important;
}

/* Projects: rebuild as the same collage treatment used in the index. */
html body #work[data-cat="projects"] #workHeading {
  font-size: clamp(34px, 4.2vw, 64px) !important;
  line-height: .9 !important;
  letter-spacing: -0.05em !important;
  transform: rotate(-1.2deg) !important;
  white-space: nowrap !important;
  max-width: none !important;
}
html body #work[data-cat="projects"] #workHeading .collage-piece {
  display: inline-block !important;
  vertical-align: middle !important;
  margin: 0 -4px 0 0 !important;
  padding: 8px 7px 6px !important;
  clip-path: polygon(2% 5%,96% 0,100% 94%,6% 100%,0 18%) !important;
  border: 1px solid rgba(10,13,18,.5) !important;
  box-shadow: 3px 3px 0 rgba(9,12,16,.72) !important;
}
html body #work[data-cat="projects"] #workHeading .piece-one {
  font-family: 'Bangers','Black Ops One',sans-serif !important;
  font-size: .95em !important;
  background: var(--od-hot) !important;
  color: #07090d !important;
  transform: rotate(-10deg) translateY(3px) !important;
}
html body #work[data-cat="projects"] #workHeading .piece-two {
  font-family: 'UnifrakturCook', serif !important;
  font-size: 1.22em !important;
  background: #f6f1e8 !important;
  color: #080b10 !important;
  transform: rotate(7deg) translateY(-5px) !important;
}
html body #work[data-cat="projects"] #workHeading .piece-three {
  font-family: 'Rubik Glitch','Zen Tokyo Zoo','Silkscreen',sans-serif !important;
  font-size: .84em !important;
  background: var(--od-ice) !important;
  color: #0a0d13 !important;
  transform: rotate(-7deg) translateY(4px) !important;
}
html body #work[data-cat="projects"] #workHeading .piece-four {
  font-family: 'Special Elite','Pirata One',serif !important;
  font-size: .97em !important;
  background: var(--od-acid) !important;
  color: #090c10 !important;
  transform: rotate(5deg) translateY(-2px) !important;
}

/* keep 2D in place; 3D slightly better balanced; mobile adaptations */
@media (max-width: 1100px) {
  html body #work[data-cat="animation3d"] #workHeading { font-size: clamp(47px, 7.1vw, 82px) !important; max-width: 8.8ch !important; }
  html body #work[data-cat="art2d"] #workHeading { font-size: clamp(58px, 8.3vw, 98px) !important; }
  html body #work[data-cat="storyboard"] #workHeading { font-size: clamp(51px, 7.2vw, 88px) !important; }
  html body #work[data-cat="projects"] #workHeading { font-size: clamp(31px, 4.8vw, 52px) !important; }
}
@media (max-width: 700px) {
  html body #work[data-cat="animation3d"] .section-heading > div { padding-left: 0 !important; }
  html body #work[data-cat="animation3d"] #workHeading { font-size: clamp(41px, 11vw, 67px) !important; max-width: 8.4ch !important; }
  html body #work[data-cat="art2d"] #workHeading { font-size: clamp(56px, 13.8vw, 80px) !important; }
  html body #work[data-cat="storyboard"] #workHeading { font-size: clamp(47px, 11.5vw, 72px) !important; max-width: 7.8ch !important; }
  html body #work[data-cat="projects"] #workHeading { font-size: clamp(27px, 7.5vw, 40px) !important; }
  html body #work[data-cat="projects"] #workHeading .collage-piece { padding: 6px 5px 4px !important; margin-right: -3px !important; }
}
