/* Project covers use original screenshots and motion assets from the source projects. */
.classic-hero .reel-media>img,
.classic-hero .reel-media>video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.classic-hero .reel-media>[hidden] { display: none; }

/* Distinct editorial artwork supports each software story. The project dialog holds authentic UI evidence. */
.lane-software .project-media { background: #0d1414; border-color: #a3b69447; }
.lane-software .media-topline { display: none; }
.software-cover { position: absolute; inset: 0; display: block; overflow: hidden; background: #0c1214; }
.project-media .software-art { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.005); transition: transform 1.1s cubic-bezier(.22,1,.36,1), filter .8s; }
.project-media:hover .software-art, .project-media:focus-visible .software-art { transform: scale(1.065); filter: saturate(1.08); }
.software-cover::before { content: ''; position: absolute; z-index: 1; inset: 0; background: linear-gradient(94deg,#060b0deb 0%,#080d10d9 27%,#0b1117b3 41%,#080c0b23 73%),linear-gradient(0deg,#080d0cc4,transparent 25%); pointer-events: none; }
.software-cover::after { content: ''; position: absolute; z-index: 1; left: 5%; top: 8%; bottom: 8%; width: 1px; background: linear-gradient(transparent,#d9f5a0a6,transparent); opacity: .7; pointer-events: none; }
.software-copy { position: absolute; z-index: 2; left: 8%; top: 9%; bottom: 13%; width: min(46%,340px); display: flex; flex-direction: column; align-items: flex-start; color: #f6f6f0; text-align: left; }
.software-brand { font-size: clamp(12px,1.2vw,18px); font-weight: 700; letter-spacing: -.025em; line-height: 1.25; }
.software-kicker { margin-top: auto; color: #dafa91; font-size: clamp(7px,.75vw,10px); font-weight: 700; letter-spacing: .13em; line-height: 1.5; text-transform: uppercase; }
.software-copy strong { display: block; margin-top: 12px; font: 500 clamp(27px,3vw,48px)/1.02 var(--display); letter-spacing: -.055em; text-wrap: balance; text-shadow: 0 2px 18px #0008; }
.software-summary { display: block; max-width: 29ch; margin-top: 14px; color: #e3e8de; font-size: clamp(10px,.9vw,13px); line-height: 1.5; text-wrap: pretty; text-shadow: 0 1px 12px #000c; }
.software-art-label { position: absolute; z-index: 2; right: 6%; bottom: 7%; display: inline-flex; align-items: center; gap: 7px; color: #eff4e9; font-size: 8px; font-weight: 700; letter-spacing: .1em; line-height: 1.4; text-shadow: 0 2px 10px #000; }
.software-art-label i { display: inline-block; width: 3px; height: 3px; border-radius: 50%; background: #dbfb93; }
@media (max-width: 800px) { .software-copy { width: 52%; } .software-cover::before { background: linear-gradient(90deg,#060a0cf0 0%,#080d10d9 32%,#0b11178c 58%,#080c0b15 86%); } }
@media (max-width: 540px) { .software-copy { left: 9%; top: 8%; bottom: 13%; width: 65%; } .software-copy strong { font-size: clamp(25px,6.8vw,37px); } .software-summary { max-width: 26ch; margin-top: 9px; font-size: 9px; } .software-art-label { right: 5%; bottom: 5%; font-size: 6px; } .software-cover::after { left: 6%; } }

.lane-web .project-media { background: #1b211f; }
.lane-web .site-showcase {
  inset: 27px 12px 12px;
  overflow: hidden;
  border: 1px solid #96ab8844;
  box-shadow: 0 18px 40px #0008;
}
.lane-web .site-slide {
  position: absolute;
  inset: 0;
  display: block;
  opacity: 0;
  visibility: hidden;
  transition: opacity .8s ease, visibility .8s;
}
.lane-web .site-slide.active { opacity: 1; visibility: visible; }
.lane-web .site-slide img,
.lane-web .site-slide video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  background: #0b1011;
}
.lane-web .site-slide-label,
.lane-web .site-slide-counter {
  position: absolute;
  z-index: 3;
  bottom: 14px;
  padding: 7px 9px;
  background: #0d1411e8;
  border: 1px solid #c2da9c38;
  color: #e6f4cf;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1.2;
  pointer-events: none;
}
.lane-web .site-slide-label { left: 14px; }
.lane-web .site-slide-counter { right: 14px; }
.lane-web .media-topline { top: 7px; }
.lane-web .media-badge { background: transparent; border: 0; padding: 0; font-size: 7px; }

@media (max-width: 800px) {
  .software-copy { width: 39%; }
  .software-window { left: 40%; }
}
@media (max-width: 540px) {
  .software-kicker { font-size: 6px; }
  .software-copy strong { font-size: clamp(18px, 6vw, 26px); }
  .software-mark { font-size: 8px; }
  .software-window-bar { font-size: 6px; }
  .software-evidence { font-size: 6px; }
  .lane-web .site-slide-label,
  .lane-web .site-slide-counter { font-size: 7px; bottom: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .lane-web .site-slide,
  .software-window { transition: none; }
}
dialog:has(.dialog-main-media iframe){width:min(1600px,98vw)}
dialog:has(.dialog-main-media iframe) .dialog-layout{grid-template-columns:minmax(0,2.4fr) minmax(275px,.65fr)}
dialog:has(.dialog-main-media iframe) .dialog-stage{justify-content:flex-start;padding:28px 12px 15px}
dialog:has(.dialog-main-media iframe) .dialog-stage figure{margin:0}
dialog:has(.dialog-main-media iframe) .dialog-main-media{height:min(72svh,780px)}
.dialog-main-media iframe{display:block;width:100%;height:100%;border:0;background:#0b1115}
@media(max-width:850px){dialog:has(.dialog-main-media iframe) .dialog-layout{grid-template-columns:1fr}dialog:has(.dialog-main-media iframe) .dialog-main-media{height:64svh}}

/* Software cards present the working interface, rather than illustrative artwork. */
.lane-software .software-cover{display:flex;flex-direction:column;padding:22px 24px 15px;background:radial-gradient(ellipse at 50% 100%,#263629,#121b1b 68%,#0c1214 100%)}
.software-cover::before,.software-cover::after{display:none}
.software-window{width:100%;min-height:0;flex:1;display:flex;flex-direction:column;overflow:hidden;border:1px solid #9eb59680;border-radius:9px 9px 3px 3px;background:#081014;box-shadow:0 16px 30px #0008;transition:transform .6s cubic-bezier(.22,1,.36,1)}
.project-media:hover .software-window,.project-media:focus-visible .software-window{transform:translateY(-4px)}
.software-window-bar{flex:none;height:30px;padding:0 13px;display:flex;align-items:center;justify-content:space-between;color:#b8c8b8;background:#172321;border-bottom:1px solid #8ca3864d;font-size:9px;letter-spacing:.09em}
.window-dots{display:flex;gap:4px}.window-dots i{width:5px;height:5px;border-radius:50%;background:#7c937c}.window-dots i:first-child{background:#d9f28e}
.software-window-screen{flex:1;min-height:0;overflow:hidden;display:grid;place-items:center}.software-window-screen img{width:100%;height:100%;object-fit:contain;object-position:center}
.software-evidence{align-self:flex-start;margin-top:12px;color:#cce5ab;font-size:8px;letter-spacing:.13em;font-weight:700}
@media(max-width:540px){.lane-software .software-cover{padding:13px 13px 10px}.software-window-bar{height:24px;font-size:7px}.software-evidence{font-size:7px;margin-top:8px}}