/* ---------- homepage additions: cinematic video band, results strip, project tags ---------- */

/* event video on a black band, edge to edge, with one line over it */
.reel.cine { background: var(--ink); padding: clamp(28px, 4vw, 64px) 0; margin-top: clamp(10px, 2vw, 24px); }
.reel.cine .frame { position: relative; background: #000; }
.reel.cine .frame::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse at 50% 55%, rgba(0,0,0,.45), rgba(0,0,0,.12) 70%); }
/* the line over the video: big, heavy and centred, set tight */
.reel.cine .cine-line {
  position: absolute; z-index: 2; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 100%; max-width: 12ch; margin: 0; text-align: center; text-wrap: balance; color: #fff;
  font-size: clamp(40px, 7.4vw, 136px); font-weight: 600; line-height: .86; letter-spacing: -.065em;
}

/* results strip under the profile statement */
.results { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(16px, 2.4vw, 40px);
  margin-top: clamp(50px, 7vw, 110px); }
.results > div { border-top: 1px solid var(--ink); padding-top: 14px; display: grid; gap: 10px; align-content: start; }
.results b { font-weight: 500; font-size: clamp(40px, 5.4vw, 92px); line-height: .9; letter-spacing: -.055em; }
.results span { max-width: 22ch; }

/* project type tags in the selected projects list */
.work li a .d { display: grid; justify-items: end; gap: 8px; text-align: right; }
.work li a .tg { color: var(--ink); }

@media (max-width: 860px) {
  .reel.cine .cine-line { max-width: 10ch; font-size: clamp(34px, 10vw, 60px); }
  .results { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 34px; }
  .work li a .d { display: grid; grid-column: 2; justify-items: start; text-align: left; margin-top: -4px; }
  .work li a .d .ty { display: none; }
}