/* Shared dialog surfaces: the same typography, controls and warm accents as the site. */
:root{--dialog-surface:#fff;--dialog-edge:#dce1dc;--dialog-soft:#f2f3ee}
.contact-dialog,.callback-dialog,.work-viewer,.client-work-viewer{border:1px solid var(--dialog-edge);border-radius:24px;background:var(--dialog-surface);box-shadow:0 24px 100px #18293830;color:var(--ink)}
.contact-dialog::backdrop,.callback-dialog::backdrop,.work-viewer::backdrop,.client-work-viewer::backdrop{background:#182e3b80;backdrop-filter:none}
.dialog-close{display:grid;place-items:center;width:44px;height:44px;top:16px;right:16px;border:1px solid var(--dialog-edge);border-radius:12px;background:#fff;color:var(--ink);transition:background .16s,border-color .16s}
.dialog-close svg{width:20px;height:20px;stroke-width:1.6}
.dialog-close:hover{background:var(--dialog-soft);border-color:#b7c2c4}
.dialog-emblem{display:grid;place-items:center;width:50px;height:50px;flex:none;border-radius:16px;background:#f2e9df;color:var(--accent)}
.dialog-emblem svg{width:25px;height:25px;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.contact-dialog{width:460px;max-width:calc(100% - 32px);height:740px;max-height:calc(100dvh - 32px);padding:0}
.contact-head{gap:12px;min-height:82px;padding:19px 72px 17px 22px;background:#fff;border-bottom:1px solid var(--dialog-edge)}
.contact-head img{width:40px;height:40px}
.contact-head h2{font-size:20px;letter-spacing:-.6px;line-height:1.3}
.contact-head p{margin-top:4px!important;line-height:1.4!important;color:var(--muted);font-size:11px!important}
.contact-head .dialog-close{top:18px;right:16px;background:#fff}
.contact-messages{padding:24px;scrollbar-gutter:stable;scrollbar-color:#c7d1cd transparent}
.contact-welcome .dialog-emblem{margin-bottom:18px}
.contact-welcome h3{font-size:27px;line-height:1.2;letter-spacing:-.9px;margin-bottom:12px;max-width:310px}
.contact-welcome p{font-size:13px!important;line-height:1.75!important}
.contact-prompts{gap:7px;margin-top:18px}
.contact-prompts button{min-height:40px;border-radius:20px;padding:8px 12px;background:#f3f4ef;border-color:#e3e7df;color:var(--ink);font-size:11px}
.contact-prompts button:hover{background:#f3eade;border-color:#d6bda5}
.contact-dialog .contact-composer{padding:17px 22px 16px;background:#fff;border-top:1px solid var(--dialog-edge)}
.contact-dialog .contact-label,.callback-dialog .contact-label{font-size:12px;font-weight:500;margin-bottom:8px}
.contact-dialog .contact-field,.callback-dialog .contact-field{border-radius:12px;background:#fbfcf9;border-color:#c9d3d1}
.contact-dialog .contact-field textarea,.callback-dialog .contact-field input{border-radius:12px;padding:13px 14px}
.contact-dialog .contact-field textarea{min-height:80px}
.contact-dialog .contact-compose-actions .button,.callback-dialog .button{border-radius:10px;min-height:46px}
.contact-dialog .contact-compose-actions{gap:9px;margin-top:11px}
.contact-dialog .contact-attach{min-height:44px;gap:7px}
.contact-dialog .contact-switch{margin-top:3px;color:var(--muted);font-size:11px}
.contact-dialog .contact-privacy{line-height:1.6!important;margin-top:12px!important;color:#69777d}
.contact-dialog .contact-cart{border-radius:10px;background:#f3eee4;padding:12px}
.contact-dialog .chat-message{border-radius:16px 16px 16px 4px;background:#f2f4ef;border-color:#e1e6dd;line-height:1.65}
.contact-dialog .chat-message.is-user{border-radius:16px 16px 4px 16px;background:#e9efed;border-color:#dce5e1}
.callback-dialog{inset:0;margin:auto;width:440px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 40px);padding:30px;scroll-padding-block:24px}
.callback-heading{padding-right:25px}
.callback-heading .dialog-emblem{margin-bottom:21px}
.callback-heading .eyebrow{margin:0 0 9px;font-size:10px;letter-spacing:1.2px}
.callback-dialog h2{font-size:31px;letter-spacing:-1px;line-height:1.15;margin:0 0 15px}
.callback-dialog .callback-intro{font-size:13px;line-height:1.7;margin-bottom:22px;max-width:330px}
.callback-dialog form{margin-top:0}
.callback-dialog .contact-field input{min-height:52px;font-size:17px;letter-spacing:.2px}
.callback-dialog .contact-helper{margin-top:8px;font-size:10px!important}
.callback-dialog .contact-consent{margin-top:19px;gap:10px;font-size:11px;line-height:1.6}
.callback-dialog form>.button{margin-top:21px}
.callback-dialog #callback-result{border-top:1px solid var(--dialog-edge);padding-top:4px}
.callback-dialog #callback-result h3{font-size:24px;letter-spacing:-.7px;margin:18px 0 10px}
.work-viewer{width:min(1280px,calc(100vw - 48px));height:min(820px,calc(100dvh - 48px));padding:0}
.work-viewer[open]{grid-template-columns:minmax(0,1fr) 350px}
.viewer-stage{background:var(--dialog-soft);color:var(--ink);grid-template-rows:64px minmax(0,1fr) 84px}
.viewer-tools{background:var(--dialog-soft);padding:10px 16px}
.viewer-tools>span{font-size:12px;letter-spacing:.5px;color:var(--muted)}
.viewer-tools button,.viewer-arrows button{border:1px solid #d4ddd7;border-radius:12px;background:#fff;color:var(--ink);font-size:25px}
.viewer-tools button:hover,.viewer-arrows button:hover:not(:disabled){background:#e8eee7;border-color:#b8c4bc}
.viewer-tools button:focus-visible,.viewer-arrows button:focus-visible,.viewer-thumbnails button:focus-visible{outline-color:var(--ink)}
.viewer-image-area{padding:0 12px}
.viewer-image-area>img{padding:0;border-radius:5px}
.viewer-arrows{left:20px;right:20px}
.viewer-arrows button{background:#ffffffed;box-shadow:0 2px 12px #253c4c0e}
.viewer-thumbnails{padding:12px 16px;gap:7px;border-top:1px solid #e0e6dc}
.viewer-thumbnails button{opacity:.7;border-radius:8px;padding:2px}
.viewer-thumbnails button[aria-pressed=true]{border-color:var(--accent);background:#fff;opacity:1}
.viewer-thumbnails img{border-radius:4px}
.viewer-loading{background:#ffffffeb;color:var(--ink);border:1px solid var(--dialog-edge);border-radius:10px}
#viewer-image-error{background:var(--dialog-soft);color:var(--muted);border-radius:12px}
.viewer-copy{padding:28px 25px;display:flex;flex-direction:column;min-width:0;background:#fff;border-left:1px solid var(--dialog-edge);scrollbar-width:thin}
.viewer-copy h2{font-size:27px;letter-spacing:-.9px;margin:13px 0 15px;line-height:1.2}
.viewer-copy .eyebrow{font-size:10px;line-height:1.6}
.viewer-copy>p{font-size:13px;line-height:1.75}
.viewer-copy .viewer-location{margin:18px 0 0;font-size:11px}
.viewer-copy dl{margin:22px 0 15px;border-color:var(--dialog-edge)}
.viewer-copy dl>div{padding:14px 0;gap:12px}
.viewer-copy dl>div+div{border-color:var(--dialog-edge)}
.viewer-copy dt{font-size:11px;line-height:1.55}
.viewer-copy dd{font-size:19px;letter-spacing:-.3px}
.viewer-copy .viewer-note{font-size:10px;line-height:1.7}
.viewer-actions{position:sticky;bottom:-28px;padding:15px 0 5px;margin-top:auto;background:#fff;border-top:1px solid var(--dialog-edge)}
.viewer-actions .button{margin:0;width:100%;min-height:46px;border-radius:10px}
.viewer-actions .text-link{display:block;width:100%;font-size:11px;margin-top:4px}
.viewer-actions #viewer-share-status{font-size:10px;line-height:1.5;margin:4px 0 0}
.client-work-viewer{width:min(1000px,calc(100vw - 40px));max-width:none;padding:0;background:var(--dialog-soft);max-height:calc(100dvh - 40px);overflow:hidden}
.client-photo-head{min-height:72px;padding:12px 18px;background:#fff;border-bottom:1px solid var(--dialog-edge)}
.client-photo-head h2{color:var(--ink);font-size:17px;letter-spacing:-.3px}
.client-photo-head button,.client-photo-nav button{width:44px;height:44px;border:1px solid #d4ddd7;border-radius:12px;background:#fff;color:var(--ink)}
.client-photo-nav{color:var(--muted);border-top:1px solid var(--dialog-edge);background:#fff;padding:10px}
#client-work-viewer .client-photo-stage{height:min(65dvh,600px)}
#client-work-viewer .client-photo-stage p{color:var(--muted)}
#client-work-viewer .client-photo-stage .button{color:var(--ink);border-color:#cbd5ce;border-radius:10px;background:#fff}
@media(max-width:900px){.work-viewer[open]{grid-template-columns:minmax(0,1fr) 310px}.viewer-copy{padding:24px 20px}.viewer-actions{bottom:-24px}.viewer-copy h2{font-size:24px}}
@media(max-width:600px){
 .contact-dialog[open]{border:0;border-radius:0;max-width:100%;height:var(--contact-vh,100dvh);max-height:var(--contact-vh,100dvh)}
 .contact-head{padding:13px 70px 13px 18px;min-height:75px}
 .contact-head .dialog-close{top:14px;right:14px}
 .contact-messages{padding:22px 18px}
 .contact-welcome h3{font-size:28px}
 .contact-welcome .dialog-emblem{width:44px;height:44px;border-radius:14px;margin-bottom:16px}
 .contact-dialog .contact-composer{padding:14px 18px calc(10px + env(safe-area-inset-bottom));max-height:65%}
 .contact-dialog .contact-field textarea{font-size:16px;min-height:66px;padding:11px 12px}
 .contact-dialog .contact-prompts button{min-height:44px}
 .contact-dialog .contact-compose-actions .button{min-width:110px}
 .contact-dialog .contact-cart{font-size:10px}
 .contact-keyboard-open .contact-head{min-height:58px;padding-block:8px}
 .contact-keyboard-open .contact-head .dialog-close{top:7px}
 .contact-keyboard-open .contact-welcome .dialog-emblem{display:none}
 .contact-keyboard-open .contact-composer{padding-top:10px;padding-bottom:10px;max-height:68%}
 .callback-dialog[open]{inset:var(--contact-top,0px) 0 auto;margin:12px auto;width:calc(100% - 24px);max-width:440px;max-height:calc(var(--contact-vh,100dvh) - 24px);padding:24px;border-radius:20px}
 .callback-heading .dialog-emblem{width:44px;height:44px;border-radius:14px;margin-bottom:18px}
 .callback-dialog h2{font-size:29px}
 .callback-dialog .callback-intro{margin-bottom:20px;font-size:12px}
 .callback-dialog .contact-consent{margin-top:16px}
 .callback-dialog form>.button{margin-top:18px}
 .callback-dialog .dialog-close{top:12px;right:12px}
 .work-viewer{width:100%;height:100dvh;border:0;border-radius:0}
 .work-viewer[open]{display:block;overflow-y:auto;overscroll-behavior:contain}
 .work-viewer[open] .viewer-tools{position:fixed;inset:0 0 auto;min-height:56px;background:#fffffff5;border-bottom:1px solid var(--dialog-edge)}
 .viewer-stage{height:56dvh;min-height:320px;grid-template-rows:56px minmax(0,1fr) 72px}
 .work-viewer .viewer-image-area{grid-row:2;padding:8px 12px}
 .viewer-thumbnails{padding:9px 14px}
 .viewer-arrows{left:15px;right:15px}
 .viewer-copy{padding:22px 20px 0;border-left:0;border-top:1px solid var(--dialog-edge);overflow:visible}
 .viewer-copy h2{font-size:26px;margin-top:10px}
 .viewer-copy dl{margin:18px 0 14px}
 .viewer-copy .viewer-note{font-size:11px}
 .viewer-actions{bottom:0;margin:18px -20px 0;padding:14px 20px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--dialog-edge)}
 .viewer-actions .button{min-height:48px;font-size:12px}
 .client-work-viewer[open]{width:100%;max-width:100%;height:100dvh;max-height:100dvh;border:0;border-radius:0}
 .client-photo-head{min-height:66px}
 #client-work-viewer .client-photo-stage{height:calc(100dvh - 132px - env(safe-area-inset-bottom))}
 .client-photo-nav{padding-bottom:calc(10px + env(safe-area-inset-bottom))}
}

.client-photo-head button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6}