/* ZS PRO — one responsive system for the original site. */
:root{
 --purple:#5142bf;--purple-dark:#40329e;--ink:#20202a;--muted:#666571;
 --line:#e5e3ec;--wash:#f7f7fa;--soft:#f0edf9;
 --type-display:2rem;--type-section:1.5rem;--type-body:1rem;--type-caption:.875rem;
 --review-columns:2;--review-gap:12px;--preview-cap:166px;
 --page-gutter:16px;--content:1160px;--header-height:66px;--dock-height:60px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-height) + 16px);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;padding-bottom:calc(var(--dock-height) + 28px);background:#fff;color:var(--ink);font:var(--type-body)/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;overflow-wrap:break-word}
[hidden]{display:none!important}
a{color:inherit;text-decoration:none}
button,input{font:inherit;color:inherit}
button{cursor:pointer}
button:disabled{cursor:default}
button,a,input,summary{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #7461ef;outline-offset:4px}
img{max-width:100%;display:block}
svg{display:block;flex-shrink:0}
h1,h2,h3,p,blockquote,figure{margin:0}
h1{font-size:var(--type-display);font-weight:700;line-height:1.2;letter-spacing:-.025em}
h2,h3{font-size:var(--type-section);font-weight:650;line-height:1.3;letter-spacing:-.02em}
p{font-size:var(--type-body);line-height:1.6}
em{font-style:normal;color:var(--purple)}
.section-kicker,.eyebrow{font-size:var(--type-caption);line-height:1.5;color:var(--purple);font-weight:500}
body>header{min-height:66px;padding:9px max(var(--page-gutter),calc((100% - var(--content))/2));display:flex;align-items:center;gap:20px;justify-content:space-between;position:sticky;top:0;z-index:10;background:#fffffff2;border-bottom:1px solid #eeedf3;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.brand{display:flex;align-items:center;direction:ltr;flex-shrink:0}
.brand img{width:124px;height:auto}
.header-link{display:none;margin-inline-start:auto;font-size:var(--type-caption);color:var(--muted)}
.header-link span{color:var(--purple);margin-inline-start:10px}
.header-contact{display:flex;flex-direction:column;align-items:flex-end;flex-shrink:0;gap:2px;line-height:1.4}
.header-phone{color:var(--purple);font-size:1rem;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:.01em}
.hours-link{font-size:var(--type-caption);color:var(--muted)}
.hours-link:hover{text-decoration:underline;text-underline-offset:3px}
.hero{max-width:calc(var(--content) + var(--page-gutter)*2);margin:auto;padding:24px var(--page-gutter) 28px}
.hero .eyebrow{margin-bottom:8px;color:var(--muted)}
.hero h1{margin-bottom:12px}
.hero h1 bdi{display:inline-block;color:var(--purple)}
.hero .intro{color:var(--muted);max-width:630px}
.hero-promises{display:flex;align-items:center;flex-wrap:wrap;gap:4px 14px;margin-top:10px;font-size:var(--type-caption);line-height:1.5}
.hero-promises a{display:flex;align-items:center;min-height:30px;border-bottom:1px solid #dcd6ee;color:#4e4464}
.hero-bottom{margin-top:16px}
.primary{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:46px;padding:11px 18px;border-radius:13px;background:var(--purple);color:#fff;font-size:var(--type-caption);font-weight:600;line-height:1.5;transition:background .18s,transform .18s}
.primary svg{width:21px;height:21px}
.primary:hover{background:var(--purple-dark)}
.primary:active{transform:scale(.98)}
.social-panel{margin-top:16px}
.social-panel>p{font-size:var(--type-caption);line-height:1.5;color:var(--muted);margin-bottom:8px}
.social-buttons{display:flex;gap:8px}
.social-button{flex:1 1 0;min-width:0;min-height:44px;padding:9px 8px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--line);border-radius:12px;background:#fff;color:#514b5d;font-size:var(--type-caption);font-weight:500;line-height:1.4;transition:background .18s,border-color .18s,transform .18s}
.social-button svg{width:17px;height:17px}
.social-button:hover{border-color:#c6bedf;background:#f9f8fc}
.social-button:active{transform:scale(.97)}

/* Natural column flow keeps cards attached to the content above them.
   No absolute placement or measured container height depends on JS or image load. */
.reviews-section{background:var(--wash);padding:24px max(var(--page-gutter),calc((100% - var(--content))/2)) 32px}
.reviews-heading{margin-bottom:18px}
.reviews-heading h2{margin-bottom:6px}
.reviews-heading p{font-size:var(--type-caption);color:var(--muted);line-height:1.5}
.review-stream{columns:var(--review-columns);column-gap:var(--review-gap);column-fill:balance;clear:both}
.review-card{display:inline-block;vertical-align:top;break-inside:avoid;page-break-inside:avoid;width:100%;min-width:0;margin:0 0 var(--review-gap);padding:6px;background:#fff;border:1px solid var(--line);border-radius:13px;scroll-margin-top:calc(var(--header-height) + 16px);transition:border-color .2s,box-shadow .2s,transform .2s}
.review-card:target{outline:2px solid var(--purple);outline-offset:2px}
.review-open{position:relative;display:block;width:100%;padding:0;border:0;border-radius:8px;background:white;overflow:hidden;text-align:inherit;cursor:zoom-in}
.review-viewport{display:block;position:relative;max-height:var(--preview-cap);overflow:hidden;background:white}
.review-crop{display:block;position:relative;width:100%;overflow:hidden;background:#fff}
.review-crop>img{position:absolute;left:var(--image-left,0%);top:var(--image-top,0%);width:var(--image-width,100%);height:auto;max-width:none}
.review-card.is-truncated .review-viewport::after{content:"";position:absolute;inset:auto 0 0;height:24px;background:linear-gradient(transparent,#fff);pointer-events:none}
.review-open-label{position:absolute;bottom:5px;left:5px;z-index:1;display:grid;place-items:center;width:27px;height:27px;border:1px solid #e7e2f3;border-radius:50%;background:#fffffff0;color:var(--purple);box-shadow:0 2px 5px #20192f08;pointer-events:none}
.review-open-label svg{width:16px;height:16px}
.review-source{display:flex;align-items:center;justify-content:center;gap:6px;min-height:38px;margin-top:2px;padding:5px 0 1px;color:var(--purple);font-size:var(--type-caption);line-height:1.4;white-space:nowrap}
.review-source span{font-size:1rem}
.review-source:hover{text-decoration:underline;text-underline-offset:3px}
.comments-marker{margin:20px 0 18px;padding-top:20px;border-top:1px solid var(--line)}
.comments-marker>span{font-size:var(--type-section);font-weight:650;line-height:1.3;letter-spacing:-.02em}
.comments-marker>p{margin-top:6px;font-size:var(--type-caption);color:var(--muted)}

/* All project types share the same 3:2 stage, including paired photos.
   Full selected source frames are preserved in the reader. */
.photo-chapter{margin:24px 0 30px;padding:24px 0;border-block:1px solid #e3dfed;scroll-margin-top:calc(var(--header-height) + 16px)}
.photo-chapter:last-child{margin-bottom:0}
.chapter-heading{max-width:720px;margin-bottom:18px}
.chapter-heading>.section-kicker{margin-bottom:6px}
.chapter-heading h3{margin-bottom:8px}
.chapter-heading>p:not(.section-kicker){color:var(--muted)}
.photo-rail{display:grid;grid-template-columns:minmax(0,1fr);align-items:start;gap:20px;min-width:0}
.project-case{position:relative;min-width:0}
.project-pair{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;aspect-ratio:3/2;overflow:hidden;border-radius:14px;direction:rtl;background:#e8e5ec}
.project-pair::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:4px;transform:translateX(-50%);background:#fff;pointer-events:none;z-index:1}
.project-pair figure{position:relative;min-width:0}
.project-pair .photo-window{aspect-ratio:3/4!important;border-radius:0}
.project-pair figcaption,.compare-label{position:absolute;top:10px;right:10px;padding:3px 10px;border-radius:7px;background:#ffffffed;color:#302a3e;line-height:1.5;font-size:var(--type-caption);font-weight:500;pointer-events:none;z-index:1;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.photo-open{position:relative;display:block;width:100%;padding:0;border:0;border-radius:0;overflow:hidden;background:transparent;text-align:inherit;cursor:zoom-in}
.photo-window{display:block;position:relative;width:100%;overflow:hidden;background:#e8e5ec}
.photo-window>img{position:absolute;left:var(--photo-left,0%);top:var(--photo-top,0%);width:var(--photo-width,100%);height:auto;max-width:none}
.process-case .photo-open{border-radius:14px}
.process-case .photo-window{aspect-ratio:3/2!important}
.case-caption,.process-case figcaption{margin:10px 0 0;color:#60586c;font-size:var(--type-caption);line-height:1.5}
.comparison{position:relative;width:100%;aspect-ratio:3/2;overflow:hidden;border-radius:14px;direction:ltr;background:#e8e5ec;--split:50%;touch-action:none;user-select:none;-webkit-user-select:none}
.compare-side{position:absolute;inset:0}
.compare-side>.photo-window{position:absolute;inset:0;aspect-ratio:3/2!important}
.compare-side.after{z-index:0}
.compare-side.before{z-index:1;clip-path:inset(0 0 0 var(--split))}
.compare-label.left{right:auto;left:10px}
.compare-label.right{right:10px}
.divider{position:absolute;top:0;bottom:0;left:var(--split);width:2px;background:white;transform:translateX(-50%);pointer-events:none;z-index:2}
.divider span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#fffffff5;color:#4b415c;box-shadow:0 2px 16px #1113;font-size:22px;line-height:1}
.comparison input{position:absolute;inset:0;width:100%;height:100%;padding:0;margin:0;opacity:0;z-index:3;touch-action:none;cursor:ew-resize}
.comparison:focus-within{outline:3px solid #7461ef;outline-offset:4px}
.comparison-open{display:inline-flex;align-items:center;gap:6px;margin:2px 0 0;padding:4px 0;min-height:36px;border:0;background:transparent;color:var(--purple);font-size:var(--type-caption);line-height:1.4}
.comparison-open svg{width:17px;height:17px}
.comparison-open:hover{text-decoration:underline;text-underline-offset:3px}
.rail-controls{display:none;align-items:center;justify-content:space-between;gap:14px;margin-top:16px}
.photo-chapter.gallery-ready .rail-controls{display:flex}
.rail-controls p{font-size:var(--type-caption);line-height:1.5;color:var(--muted);text-align:center}
.rail-controls button{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:1px solid #ded9e9;border-radius:50%;background:white;color:var(--purple);font-size:23px;line-height:1;transition:background .18s,border-color .18s}
.rail-controls button:hover:not(:disabled){background:var(--soft);border-color:#b9aedb}
.rail-controls button:disabled{opacity:.3}
.proof-quote{display:flex;align-items:baseline;gap:4px 14px;flex-wrap:wrap;margin-top:18px;padding:16px 18px;border-inline-start:2px solid #b6a7df;background:#ffffffb8;border-radius:8px;color:#4a405b}
.proof-quote .quote-label{display:none}
.proof-quote blockquote{font-size:1rem;line-height:1.5;font-weight:650;color:var(--purple)}
.proof-quote>p{flex-basis:100%;font-size:var(--type-caption);line-height:1.55;color:var(--muted);margin-top:3px}
.proof-quote .quote-author{font-size:var(--type-caption);color:var(--muted)}
.proof-quote>a{display:inline-flex;align-items:center;min-height:34px;font-size:var(--type-caption);line-height:1.4;color:var(--purple);text-decoration:underline;text-underline-offset:3px}
.commercial-proof{margin-top:12px!important;padding-top:12px;border-top:1px solid var(--line);font-size:var(--type-caption)!important;line-height:1.6}
.commercial-proof a{color:var(--purple);text-decoration:underline;text-underline-offset:3px}

.service-details,.coverage-details{margin:18px 0 26px;border:1px solid var(--line);border-radius:14px;background:#fff;scroll-margin-top:calc(var(--header-height) + 16px)}
.service-details>summary,.coverage-details>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:54px;padding:14px 16px;cursor:pointer;list-style:none;color:#514768;font-size:var(--type-caption);font-weight:600;line-height:1.5}
summary::-webkit-details-marker{display:none}
summary::marker{content:""}
.service-details>summary span,.coverage-details>summary span{color:var(--purple);font-size:var(--type-caption);font-weight:400;flex-shrink:0}
.service-details>summary span{transition:transform .2s}
.service-details[open]>summary span{transform:rotate(45deg)}
.service-details[open]>summary,.coverage-details[open]>summary{border-bottom:1px solid var(--line)}
.service-promises{padding:22px 18px;display:grid;gap:20px}
.service-promises>div{display:flex;flex-direction:column;gap:6px;padding-inline-start:14px;border-inline-start:2px solid #d6ceea}
.service-promises strong{font-size:1rem;line-height:1.5;font-weight:650}
.service-promises span{font-size:var(--type-body);color:var(--muted)}
.promise-note{grid-column:1/-1;font-size:var(--type-caption);line-height:1.65;color:var(--muted)}
.coverage-section{display:grid;gap:24px;padding:24px 20px}
.coverage-copy h2{margin:8px 0 16px}
.coverage-copy>p{color:var(--muted)}
.coverage-copy .section-kicker{color:var(--purple)}
.coverage-regions{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0}
.coverage-regions span{font-size:var(--type-caption);padding:4px 10px;border:1px solid var(--line);border-radius:20px;color:var(--muted)}
.coverage-copy .coverage-note{font-size:var(--type-caption)}
.coverage-illustration{width:100%;max-width:360px;justify-self:center;min-width:0}
.coverage-map{width:100%;height:auto;overflow:visible}
.coverage-map text{font-family:inherit}
.map-location circle{transition:fill .2s}
.map-location:hover circle{fill:#8774ed}
.map-credit{font-size:12px;line-height:1.5;text-align:center;color:var(--muted);margin:8px 0 0}
.map-credit a{text-decoration:underline;text-underline-offset:3px}

.closing{max-width:calc(780px + var(--page-gutter)*2);padding:36px var(--page-gutter) 26px;margin:auto;text-align:center}
.closing h2{margin:8px 0 14px}
.closing>p{max-width:620px;margin:0 auto 20px;color:var(--muted)}
.service{display:block;font-size:var(--type-caption);line-height:1.5;color:var(--muted);margin-top:16px}
.contact-hours{margin-top:26px;padding-top:20px;border-top:1px solid var(--line);text-align:right;scroll-margin-top:calc(var(--header-height) + 18px)}
.contact-hours>div{display:flex;align-items:center;flex-wrap:wrap;gap:6px 18px;font-size:var(--type-caption);line-height:1.5}
.contact-hours strong{font-weight:600}
.contact-hours>div>span{white-space:nowrap}
.contact-hours p{margin-top:10px;color:var(--muted);font-size:var(--type-caption);line-height:1.6}
footer{max-width:var(--content);margin:0 var(--page-gutter);padding:22px 0;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px}
footer>span{font-size:var(--type-caption);color:var(--muted)}
footer .brand img{width:110px}
.whatsapp-icon{stroke:none;shape-rendering:geometricPrecision}
.quick-nav{position:fixed;z-index:20;bottom:max(12px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:4px;width:min(370px,calc(100% - 20px));padding:5px;border:1px solid #e2ddee;border-radius:19px;background:#fffffff2;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 6px 25px #24203217}
.quick-nav a{display:flex;flex:1 1 auto;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:9px 10px;border-radius:13px;font-size:var(--type-caption);line-height:1.4;font-weight:600;white-space:nowrap;color:#63596f}
.quick-nav a[aria-current="true"]{background:var(--soft);color:var(--purple)}
.quick-nav .quick-contact{background:var(--purple);color:white}
.quick-contact svg{width:20px;height:20px}
.quick-nav .quick-contact:hover{background:var(--purple-dark)}

/* Original screenshots and photo crops open in a full-height, zoomable reader. */
.review-dialog{width:min(900px,calc(100vw - 12px));max-width:900px;max-height:calc(100dvh - 12px);margin:auto;padding:0;border:1px solid #e3dfed;border-radius:16px;background:#fff;box-shadow:0 24px 80px #17162440;overflow:hidden}
.review-dialog::backdrop{background:#1c1924b8;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.reader-shell{display:flex;flex-direction:column;height:min(94dvh,1000px);min-height:0}
.reader-toolbar{display:flex;align-items:center;gap:8px;flex:0 0 auto;padding:8px;border-bottom:1px solid var(--line);background:#fff}
.reader-toolbar h2{margin-inline-end:auto;font-size:1rem;line-height:1.4;letter-spacing:0;font-weight:600}
.reader-toolbar button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:#f8f7fb;font-size:var(--type-caption);line-height:1.4;color:var(--purple)}
.reader-toolbar .reader-close{width:44px;padding:0;font-size:26px;line-height:1}
.reader-toolbar .reader-zoom[aria-pressed="true"]{background:var(--soft)}
.reader-stage{flex:1 1 auto;min-height:0;min-width:0;overflow:auto;background:var(--wash);direction:ltr;overscroll-behavior:contain;touch-action:pan-x pan-y pinch-zoom;scrollbar-width:thin}
.reader-image{width:100%;min-height:100%;padding:6px;margin:0 auto}
.reader-image>.review-crop,.reader-image>.photo-window{width:100%;max-width:none;border-radius:7px}
.reader-image img{user-select:none;-webkit-user-drag:none}
.reader-footer{flex:0 0 auto;padding:7px 8px max(10px,env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff}
.reader-controls{display:flex;align-items:center;justify-content:space-between;gap:7px}
.reader-controls button,.reader-source{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 10px;border:1px solid var(--line);border-radius:11px;background:white;font-size:var(--type-caption);line-height:1.4;text-align:center;color:var(--purple)}
.reader-source{font-weight:600;background:var(--soft)}
.reader-controls button:disabled{opacity:.3}
.reader-hint{margin-top:7px;font-size:var(--type-caption);line-height:1.45;text-align:center;color:var(--muted)}
.reader-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.dialog-is-open{overflow:hidden}
.dialog-is-open .quick-nav{visibility:hidden}
.script-notice{margin:16px;padding:14px;background:var(--soft);border-radius:10px;font-size:var(--type-caption)}

@media(min-width:600px){
 :root{--page-gutter:24px;--preview-cap:196px}
 .brand img{width:142px}.header-link{display:block}
 .hero{padding-block:32px}.social-buttons{max-width:400px}
 .photo-rail{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
 .coverage-section{grid-template-columns:1fr 1fr;align-items:center;padding:28px;gap:28px}
 .service-promises{grid-template-columns:repeat(3,minmax(0,1fr));padding:24px}
 .reader-toolbar{padding:10px 14px}.reader-image{padding:12px}
}
@media(min-width:800px){
 :root{--type-display:2.5rem;--review-columns:3;--review-gap:16px;--preview-cap:210px}
 .hero{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:44px;padding-block:38px}
 .hero .eyebrow{grid-column:1/-1}
 .hero h1,.hero .intro,.hero-promises{grid-column:1}
 .hero-bottom{grid-column:2;grid-row:2;align-self:center;margin:0}
 .hero .social-panel{grid-column:2;grid-row:3/5;align-self:center;margin-top:4px}
 .hero .social-buttons{max-width:none}
 .reviews-section{padding-block:32px 40px}
 .photo-chapter{padding-block:28px;margin-block:28px 34px}
 .chapter-heading{margin-bottom:22px}
 .proof-quote{padding:16px 20px}
 .proof-quote blockquote{font-size:1.125rem}
 .closing{padding-block:44px 30px}
}
@media(min-width:1200px){
 :root{--review-columns:4;--preview-cap:220px}
 .hero h1{font-size:2.75rem}
 footer{margin-inline:auto}
}
@media(max-width:360px){
 :root{--page-gutter:12px;--review-gap:10px}
 .social-button{gap:5px;padding-inline:5px}
 .hero-promises{column-gap:11px}
 .review-card{padding:5px}
 .review-source{gap:3px}
 .reader-controls{gap:5px}.reader-controls button,.reader-source{padding-inline:7px}
}
@media(hover:hover) and (pointer:fine){
 .review-card:hover{border-color:#b8addb;box-shadow:0 6px 18px #5142bf10;transform:perspective(1100px) translateY(-2px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important}
 .review-card:hover{transform:none}
}
@media print{
 body{padding:0}body>header{position:static}
 .quick-nav,.rail-controls,.reader,.review-open-label,.comparison-open{display:none!important}
 .review-stream{columns:3}.review-viewport{max-height:none}
 .photo-rail{grid-template-columns:repeat(2,minmax(0,1fr))}.photo-rail>[hidden]{display:block!important}
 .photo-chapter{break-inside:avoid}
}