/* Additions for the art portfolio. The original forest, pixel UI and effects are preserved. */
:root { --admin-atmosphere:1; --admin-reveal-distance:35px; --admin-cta-intensity:1; }
html[data-admin-preview="true"] .godrays,
html[data-admin-preview="true"] .mist { opacity:var(--admin-atmosphere); }
html[data-admin-preview="true"] .reveal { transform:translateY(var(--admin-reveal-distance)); }
html[data-admin-preview="true"] .reveal-l { transform:translateX(calc(-1 * var(--admin-reveal-distance))); }
html[data-admin-preview="true"] .reveal-r { transform:translateX(var(--admin-reveal-distance)); }
html[data-admin-preview="true"] .reveal.vis,
html[data-admin-preview="true"] .reveal-l.vis,
html[data-admin-preview="true"] .reveal-r.vis { transform:translate(0); }
html[data-admin-preview="true"] .hero_cta_glow { opacity:calc(.42 * var(--admin-cta-intensity)); }
.showreel-poster { display:block; width:100%; height:100%; object-fit:cover; }
.hero_badge { padding:0; border:0; background:transparent; }
.hero_cta { position:relative; top:clamp(10px,2.2vh,24px); }
.gallery-item--featured { aspect-ratio:16/9; }
.gallery-item_overlay .project-traits { color:var(--text2); margin-left:.5em; white-space:nowrap; }
.case-copy { color:var(--text2); font-size:1rem; line-height:1.75; }
.case-copy h4 { font-family:var(--font-pix); font-size:1.55rem; color:var(--accent); margin:0 0 .8rem; }
.case-copy p + p { margin-top:.8rem; }
.case-copy ul { padding-left:1.3rem; }
.case-copy li + li { margin-top:.7rem; }
.case-copy strong { color:var(--text); font-weight:600; }
.project-collage figure { margin:0; }
.project-collage video { height:auto; background:#050a07; }
.project-collage img { height:auto; display:block; }
.project-collage .collage-item { gap:.5rem; }
.project-collage .collage-item > span { display:flex; align-items:center; min-height:3.25rem; line-height:1.4; padding:.65rem 1rem; }
.case-media-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; align-items:stretch; }
.case-media-pair > .collage-item { min-width:0; display:grid; grid-template-rows:auto 1fr; }
.lightbox_content .lb-project-container :is(.case-media-pair, .project-collage > .collage-item:first-child:has(video)) { margin-inline:calc(-1 * var(--case-inset)); max-width:none; }
.case-video { position:relative; min-width:0; }
.case-video video { display:block; }
.case-video-cover { position:absolute; inset:0; display:grid; place-items:center; width:100%; height:100%; padding:0; border:1px solid var(--border); background:var(--bg); cursor:pointer; }
.case-video-cover[hidden] { display:none; }
.case-video-cover img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; border:0; }
.case-video-cover::after { content:'▶'; position:relative; display:grid; place-items:center; width:3.5rem; height:3.5rem; padding-left:.15rem; background:rgba(14,28,19,.9); border:1px solid var(--accent); color:var(--accent); font-size:1.4rem; }
.case-video-cover:hover::after { background:var(--bg3); color:var(--gold); border-color:var(--gold); }
.case-video-cover:focus-visible { outline-offset:-5px; }
.case-image-link { display:block; cursor:zoom-in; }
.case-image-detail { position:relative; overflow:hidden; aspect-ratio:var(--detail-ratio); border:1px solid var(--border); }
.lightbox_content .lb-project-container .case-image-detail > img { position:absolute; width:var(--detail-width); max-width:none; height:auto; left:var(--detail-left); top:var(--detail-top); border:0; }
.case-color-grid { row-gap:1.25rem; }
.case-comparison { align-items:center; }
.case-comparison .case-video { width:min(100%,calc(max(120px,var(--case-height) - 160px) * .888889)); }
.case-comparison > span { align-self:stretch; }
.case-source { color:var(--accent); text-underline-offset:4px; text-decoration:underline; }
.case-source:hover { color:var(--gold); }
.project-header p + p { margin-top:.5rem; }
.lightbox {
    --case-height:calc(var(--app-height) - var(--safe-top) - var(--safe-bottom) - 104px);
    padding-top:calc(48px + var(--safe-top));
    padding-bottom:calc(56px + var(--safe-bottom));
}
.lightbox_content { height:var(--case-height); max-height:var(--case-height); }
.lb-project-container { --case-inset:2rem; padding:var(--case-inset); height:100%; max-height:100%; overscroll-behavior:contain; }
.lightbox_close { top:-40px; min-width:32px; min-height:32px; }
.lightbox_nav { transition:color .2s,border-color .2s,background-color .2s; }
.lightbox_nav[hidden] { display:none; }
.project-collage > figure:first-child video { max-height:none; object-fit:contain; }
.gallery-item:focus-visible .gallery-item_inner { outline:2px solid var(--gold); outline-offset:5px; }
a:focus-visible,button:focus-visible,select:focus-visible,.lb-project-container:focus-visible { outline:2px solid var(--gold); outline-offset:4px; }
@media(min-width:769px) {
    .gallery-grid { grid-template-columns:repeat(12,minmax(0,1fr)); }
    .gallery-item { grid-column:span 4; }
    .gallery-item--featured { grid-column:span 6; }
    .hero_title { font-size:clamp(3.2rem,5.25vw,4.5rem); line-height:1.2; }
}
@media(max-width:768px) {
    .gallery-item, .gallery-item--featured { grid-column:1 / -1; }
    .lb-project-container { --case-inset:1.25rem; }
    .case-media-pair { grid-template-columns:minmax(0,1fr); gap:1.8rem; }
    .lightbox_nav { top:auto; bottom:-44px; transform:none; width:42px; height:36px; }
    .lightbox_prev { left:0; }
    .lightbox_next { right:0; }
    .lightbox_counter { bottom:-34px; }
}
@media(max-width:560px) {
    .project-header h3 { font-size:2rem; line-height:1.15; }
    .project-header { margin-bottom:1.3rem; }
    .project-collage { gap:1.8rem; }
    .collage-item span { font-size:.95rem; padding:.5rem .65rem; }
}
