/* One continuous Visualift black surface; original imagery and layout stay intact. */
:root{color-scheme:dark;--surface:#101012;--copy:#f4f3ee;--secondary:#b7b1c2;--edge:#ffffff26}
body,.work-section,.expertise-section,.transformation-section,.studio-section,.creative-journey,.legal-page{background:var(--surface);color:var(--copy)}
.work-section,.studio-section,.creative-journey+.work-section{border-color:var(--edge)}
.work-section{border-radius:0}
.dark-label,.work-heading>p,.work-caption>span,.transformation-title>p,.comparison-caption,.studio-layout p,.client-section>p{color:var(--secondary)}
.dark-label .tiny-cross,.studio-monogram em,.chapter-link,.journey-chapter h2 em{color:var(--accent)}
.work-image,.identity-card .work-image,.preview-image,.comparison,.gallery-item img{background:#1a191e}
.work-caption{background:var(--surface)}
.work-bottom,.client-section,.gallery-header,.video-card,.legal-header,.legal-footer{border-color:var(--edge)}
.work-open{background:var(--accent);color:var(--ink)}
.button-dark{background:var(--accent);color:var(--ink)}
.button-dark:hover{background:#dccfff}
.floating-work{background:var(--surface);border:1px solid var(--edge)}
.floating-work figcaption{color:var(--secondary)}
.preview-index,.compare-label{background:#101012e8;color:var(--copy);border:1px solid #ffffff40}
.compare-divider>span{background:var(--surface);color:var(--copy);border:1px solid #ffffff80}
.compare-tabs button,.gallery-filters button{border-color:#ffffff50;color:var(--copy)}
.compare-tabs button.active,.gallery-filters button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--ink)}
.journey-sticky{background:radial-gradient(ellipse at 74% 48%,#35274655,transparent 56%)}
.chapter-label,.chapter-description,.chapter-nav button,.journey-scroll-hint{color:var(--secondary)}
.chapter-nav button[aria-current=step]{color:var(--accent)}
.journey-top>a,.chapter-link,.chapter-nav button[aria-current=step]>span:last-child{border-color:#b9a6d7}
.journey-progress{background:var(--edge)}
.journey-progress>span{background:var(--accent)}
#gallery-dialog,.gallery-header{background:var(--surface);color:var(--copy)}
.video-card>a,.video-card p{color:var(--secondary)}
.studio-monogram:before{border-color:#81718f}
.site-footer{color:#aaa4b3}
.contact-form{background:var(--surface);color:var(--copy);border:1px solid #ffffff30}
.form-index{color:var(--accent)}
.form-heading>p,.field-optional,.form-privacy,.form-recovery-help{color:var(--secondary)}
.form-field input,.form-field select,.form-field textarea{color:var(--copy);border-bottom-color:#8c8395}
.form-field select option{background:var(--surface);color:var(--copy)}
.form-field select:has(option[value=""]:checked),.form-field input::placeholder,.form-field textarea::placeholder{color:#afa6bb}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{outline-color:var(--accent)}
.form-privacy a,.form-email-fallback,.form-copy-message{color:#d1bcf1}
.field-error{color:#ffb4c2}
.form-field [aria-invalid=true]{border-bottom-color:#ff98ad}
.contact-submit{background:var(--accent);color:var(--ink)}
.contact-submit:hover{background:#dccfff}
.submit-spinner{border-color:#10101250;border-top-color:currentColor}
.form-status{background:#241c30;color:#e4d6f6;border-color:#b39bd4}
.form-status[data-state=error],.form-status[data-state=invalid]{background:#301d25;color:#ffc4d0;border-color:#e88da4}
.form-status[data-state=sending]{color:var(--secondary);background:none}
.form-copy-value,.contact-copy-value,.legal-contact input{background:var(--surface);color:var(--copy);border-color:#a68fbf}
.legal-main>.eyebrow,.legal-main a,.legal-footer a{color:var(--accent)}
.legal-date{color:var(--secondary)}
.legal-main h1,.legal-main h2{color:var(--copy)}
.legal-contact button:focus-visible{outline-color:var(--accent)}
.image-feedback{inset:auto 12px 12px;gap:8px;padding:10px 14px;border:1px solid #ffffff35;background:#101012e8;color:var(--copy);border-radius:3px}
.comparison .image-feedback{color:var(--copy);z-index:6}
.gallery-item{position:relative;width:100%;min-width:0}
.gallery-item img{display:block;width:100%;height:auto;aspect-ratio:1.1}
.gallery-item .gallery-image-status{position:absolute;left:12px;right:12px;top:12px;padding:8px 10px;background:#101012e8;border:1px solid #ffffff30;color:var(--copy);font-size:13px;line-height:1.5;pointer-events:none}
.gallery-item[data-state=ready] .gallery-image-status{display:none}
.gallery-item[data-state=error] .gallery-image-status{color:#ffc4d0}
.lightbox-image-status{position:absolute;left:5vw;bottom:104px;margin:0;padding:10px 14px;background:#101012e8;border:1px solid #ffffff40;font-size:14px;z-index:2;max-width:90vw}
.lightbox-image-status button{margin-left:16px;text-decoration:underline;padding:8px 0;min-height:44px}
/* No animation or pending network request is allowed to make a photo invisible. */
.js-ready .reveal.pending{opacity:1;transform:none}
.preview-image[data-state] img,.comparison[data-state]>img{visibility:visible}
.comparison[data-state] .compare-label,.comparison[data-state] .compare-divider{visibility:visible}
@media(max-width:520px){.image-feedback{inset:auto 8px 8px;padding:8px 10px}.lightbox-image-status{bottom:110px}.lightbox-image-status button{margin-left:0;display:block}}
/* Captions and navigation must fit when text is enlarged or a title wraps. */
#lightbox[open]{display:flex;flex-direction:column}
#lightbox-image{flex:1 1 0;min-height:0;height:0}
.lightbox-footer{flex:0 0 auto;min-height:90px;height:auto;flex-wrap:wrap}
.lightbox-footer>p{min-width:0;overflow-wrap:anywhere}
.lightbox-footer>div{flex-wrap:wrap}
.lightbox-image-status{top:64px;bottom:auto}
.form-privacy a{white-space:normal}
.work-actions{display:flex;flex-direction:column;align-items:flex-end;gap:10px;max-width:100%}
.creations-instagram{display:inline-block;max-width:100%;min-height:44px;padding:10px 0;color:var(--accent);font-size:14px;line-height:1.6;text-decoration:underline;text-underline-offset:5px;overflow-wrap:anywhere}
.creations-instagram:hover{color:var(--copy)}
.work-actions .creations-instagram{text-align:right}
.gallery-header>div{min-width:0}
.gallery-header .creations-instagram{margin-top:8px}
@media(max-width:520px){.work-actions{align-items:flex-start}.work-actions .creations-instagram{text-align:left}}