/* Native controls stay usable when scripting is unavailable. */
.project-media-section{border-top:1px solid var(--line)}
.project-media-section .section-head{align-items:end}
.project-media-section .section-head p{font-size:14px}
.comparison,.comparison-pictures figure,.project-video{margin:0;min-width:0}
.comparison-pictures{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.comparison-pictures img{width:100%;height:auto;display:block;object-fit:cover}
.comparison-pictures figcaption{font-size:12px;color:var(--muted);margin-top:12px}
.comparison[data-ready=true] .comparison-pictures{position:relative;display:block;aspect-ratio:var(--comparison-ratio);overflow:hidden;touch-action:pan-y;cursor:ew-resize;-webkit-user-select:none;user-select:none}
.comparison[data-ready=true] .comparison-pictures>figure{position:absolute;inset:0}
.comparison[data-ready=true] .comparison-pictures img{height:100%;pointer-events:none}
.comparison[data-ready=true] .comparison-pictures figcaption{display:none}
.comparison[data-ready=true] .comparison-after{clip-path:inset(0 0 0 var(--comparison-position,50%))}
.comparison-divider{position:absolute;inset-block:0;left:var(--comparison-position,50%);width:2px;background:#fff;box-shadow:0 0 0 1px #15192120;transform:translateX(-1px);pointer-events:none}
.comparison-divider>span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#fff;color:#191b20;box-shadow:0 3px 24px #10152330;font-size:24px}
.comparison-legend{display:flex;justify-content:space-between;gap:24px;margin-block:16px 26px;font-size:12px;color:var(--muted)}
.comparison-legend span:last-child{text-align:right}
.comparison-control{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:35px;font-size:13px;padding:10px 0;border-top:1px solid var(--line)}
.comparison-control>span{display:flex;gap:25px;align-items:center}
.comparison-control input{width:100%;height:44px;margin:0;accent-color:var(--blue);cursor:ew-resize;background:transparent}
.comparison .caption{margin-top:10px;max-width:75ch}
.project-video video{display:block;width:100%;height:auto;max-height:76vh;aspect-ratio:3/2;object-fit:contain;background:#101319}
.video-caption{display:flex;justify-content:space-between;gap:20px;padding-block:18px;border-bottom:1px solid var(--line);font-size:12px;color:var(--muted);align-items:baseline}
.video-caption a{color:var(--ink);white-space:nowrap;display:inline-block;padding-block:12px;text-decoration:underline;text-underline-offset:4px}
.video-description summary{min-height:48px;padding-block:16px;font-size:13px;cursor:pointer}
.video-description p{max-width:75ch;font-size:14px;padding:5px 0 12px}
.comparison:focus-within .comparison-divider>span{outline:3px solid #2448ed;outline-offset:3px}
@media(max-width:700px){
  .comparison-pictures{grid-template-columns:1fr;gap:25px}
  .comparison-control{grid-template-columns:1fr;gap:5px}
  .comparison-control>span{justify-content:space-between}
  .comparison-legend{font-size:11px;margin-bottom:20px;gap:18px}
  .comparison-divider>span{width:42px;height:42px;font-size:22px}
  .video-caption{display:block;line-height:1.7}
  .video-caption a{display:block;width:fit-content;margin-top:6px}
}
@media print{
  .comparison[data-ready=true] .comparison-pictures{display:grid;aspect-ratio:auto;overflow:visible;grid-template-columns:1fr 1fr}
  .comparison[data-ready=true] .comparison-pictures>figure{position:static;clip-path:none}
  .comparison[data-ready=true] .comparison-pictures figcaption{display:block}
  .comparison-control,.comparison-divider,.comparison-legend{display:none}
}