/* Revision 50: landscape filmstrip, moving client grid and expertise footer. */
#selected-work{--card-width:72vw;--card-gap:18px;--card-height:calc(var(--card-width)/2);background:#000}
#selected-work.is-scroll-sequence .work-pin{padding:56px 0 116px;top:max(0px,calc(100svh - var(--work-frame,650px)));background:#000}
#selected-work .work-window{overflow:hidden;margin:0}
#selected-work.is-scroll-sequence .work-track{padding:0 var(--gutter);gap:var(--card-gap);cursor:grab;touch-action:pan-y;user-select:none}
#selected-work.is-scroll-sequence .work-track.is-dragging{cursor:grabbing}
#selected-work .feature{width:var(--card-width);height:var(--card-height);aspect-ratio:2/1;max-height:none;flex:0 0 auto;border-radius:0}
#selected-work .feature-shade{background:linear-gradient(180deg,#0000 55%,#0002)}
#selected-work.is-scroll-sequence .work-overlay{inset:0;display:block}
#selected-work .work-labels{inset:18px var(--gutter) auto;font-size:12px;color:#999}
#selected-work .work-caption{inset:auto var(--gutter) 27px;align-items:flex-end}
#selected-work .work-copy h2{font-size:clamp(26px,2.6vw,40px);font-weight:500;letter-spacing:-.035em;margin-bottom:6px}
#selected-work .work-copy p{color:#aaa;font-size:13px}
#selected-work .work-open{width:44px;height:44px;transform:none;background:linear-gradient(140deg,#fff2,#fff05);border:1px solid #ffffff36;backdrop-filter:blur(16px);box-shadow:inset 0 1px #fff3,0 5px 20px #0005;color:#ddd}
#selected-work .work-open:hover{background:#fff3;color:#fff;box-shadow:inset 0 1px #fff5,0 0 22px #ffffff18}
#selected-work .work-open svg{width:17px;height:17px}
#selected-work:not(.is-scroll-sequence) .work-track{padding:0 var(--gutter);gap:28px}
#selected-work:not(.is-scroll-sequence) .feature{width:100%;height:auto;aspect-ratio:2/1}
#selected-work:not(.is-scroll-sequence) .feature-caption{display:flex}
#selected-work:not(.is-scroll-sequence) .feature-shade{background:linear-gradient(0deg,#000a,transparent 60%)}
/* Keep every supplied logo's intrinsic whitespace; lines belong to the cells. */
.clients .logo-row{--logo-gap:0px;border-top:1px solid #ffffff15}
.clients .logo-row:last-child{border-bottom:1px solid #ffffff15}
.clients .logo-group{gap:0;padding:0}
.clients .logo-group li{box-sizing:border-box;width:clamp(190px,20vw,290px);height:clamp(144px,13vw,188px);border-right:1px solid #ffffff15}
.clients .logo-group img{width:220px;max-width:90%;height:auto;transform:none}
.expertise{display:grid;grid-template-columns:1.65fr 1fr 1fr 1fr;gap:3vw;padding:90px var(--gutter) 120px;border-top:1px solid #ffffff1c;background:#000;scroll-margin-top:36px}
.section-kicker{font-size:11px;color:#777;line-height:1.5;margin:0 0 24px;letter-spacing:.035em}
.expertise h2{font-weight:400;font-size:clamp(32px,3.5vw,54px);line-height:1.06;letter-spacing:-.04em;margin:0}
.expertise h2 em{font-family:Georgia,serif;font-weight:400}
.expertise-column{padding-top:4px}
.expertise-column h3{font-size:11px;font-weight:500;letter-spacing:.065em;text-transform:uppercase;color:#777;margin:0 0 28px}
.expertise-column ul{padding:0;margin:0;list-style:none;font-size:clamp(15px,1.3vw,19px);line-height:1.5;color:#ddd}
.expertise-column li+li{margin-top:12px}
.site-footer{background:#000;padding:0 var(--gutter) 30px}
.footer-invitation{display:flex;justify-content:space-between;align-items:flex-end;border-top:1px solid #ffffff1c;padding:64px 0 80px;gap:24px}
.footer-invitation h2{font-size:clamp(48px,7vw,108px);font-weight:400;line-height:.98;letter-spacing:-.055em;margin:0}
.footer-cta{min-height:56px;gap:30px;font-size:16px;flex:none;margin-bottom:5px}
.cta-arrow{font-size:23px;font-weight:300}
.footer-baseline{display:flex;justify-content:space-between;gap:20px;color:#777;font-size:11px;letter-spacing:.025em}
.footer-baseline a:hover{color:#fff}
/* Small independent motes echo the hero; no extra WebGL rendering loop. */
.contact-button{position:relative;isolation:isolate;background:linear-gradient(135deg,#ffffff22,#ffffff08 50%,#ffffff16);border-color:#ffffff38;box-shadow:inset 0 1px 0 #ffffff35,0 0 26px #ffffff09;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:background .4s,box-shadow .4s,color .4s}
.contact-button:hover,.contact-button:focus-visible{background:#ffffff20;color:#fff;box-shadow:inset 0 1px 0 #ffffff55,0 0 34px #ffffff20}
.button-atmosphere{position:absolute;inset:-13px;pointer-events:none;border-radius:inherit;z-index:-1;overflow:visible}
.button-atmosphere i{position:absolute;left:var(--x);top:var(--y);width:2px;height:2px;background:#eee;border-radius:50%;box-shadow:0 0 5px #fff8;opacity:0;animation:button-mote var(--duration) ease-in-out var(--delay) infinite;animation-play-state:paused}
.atmosphere-visible .button-atmosphere i{animation-play-state:running}
@keyframes button-mote{0%,100%{opacity:0;transform:translate(0,5px) scale(.7)}35%{opacity:.6}70%{opacity:.25;transform:translate(7px,-7px) scale(1)}90%{opacity:0;transform:translate(10px,-12px) scale(.7)}}
.expertise-intro.reveal-ready,.expertise-column.reveal-ready,.footer-invitation.reveal-ready{transition:opacity 1s ease,translate 1.1s cubic-bezier(.2,.75,.2,1)}
.expertise-intro.reveal-pending,.expertise-column.reveal-pending,.footer-invitation.reveal-pending{opacity:0;translate:0 38px}
.expertise-column:nth-child(3){transition-delay:.12s}.expertise-column:nth-child(4){transition-delay:.24s}
@media(max-width:900px){
 #selected-work{--card-width:80vw;--card-gap:10px;--card-height:calc(var(--card-width)/1.5)}
 #selected-work.is-scroll-sequence .work-pin{padding:42px 0 100px}
 #selected-work .work-labels{inset:12px var(--gutter) auto;font-size:10px}
 #selected-work .work-caption{inset:auto var(--gutter) 22px;gap:12px}
 #selected-work .work-copy h2{font-size:25px;margin-bottom:6px}
 #selected-work .work-copy p{font-size:11px;max-width:none}
 #selected-work .work-open{width:36px;height:36px}
 .clients .logo-group li{width:calc(100vw/3.6);height:calc(100vw/3.6*.95)}
 .clients .logo-group img{width:118%;max-width:none;transform:none}
 .expertise{grid-template-columns:repeat(3,1fr);gap:40px 24px;padding:60px var(--gutter) 70px}
 .expertise-intro{grid-column:1/-1}.expertise h2{font-size:44px}.expertise-column h3{margin-bottom:20px;line-height:1.5}
 .expertise-column ul{font-size:14px}.expertise-column li+li{margin-top:10px}
}
@media(max-width:540px){
 .expertise{grid-template-columns:1fr 1fr;gap:36px 24px}
 .expertise-column:last-child{grid-column:1/-1}
 .footer-invitation{padding:40px 0 60px;display:block}.footer-invitation h2{font-size:56px}.footer-cta{margin-top:36px}
 .footer-baseline{font-size:10px}
}
@media(prefers-reduced-motion:reduce){
 .button-atmosphere{display:none}
 .expertise-intro.reveal-ready,.expertise-column.reveal-ready,.footer-invitation.reveal-ready{opacity:1;translate:none;transition:none}
 #selected-work .work-open,.contact-button{transition:none}
}
@media(min-width:901px){
 #selected-work{--card-height:min(36vw,calc(100svh - 200px))}
 #selected-work.is-scroll-sequence .work-pin{min-height:100svh;padding-top:max(56px,calc((100svh - var(--card-height) - 70px)/2));padding-bottom:116px}
 #selected-work .work-labels{top:32px}
 #selected-work .work-caption{bottom:36px}
}

/* The atmosphere belongs to the document and scrolls away with the opening view. */
body{background:#000;isolation:isolate}
body>#particles{position:absolute;inset:0 0 auto;width:100%;height:100svh;z-index:0;pointer-events:none;opacity:1}
body>main{position:relative;z-index:1}
.hero,#selected-work,.clients,.expertise,.site-footer{background:transparent}
#selected-work.is-scroll-sequence .work-pin{background:rgba(0,0,0,.3)}
.expertise,.site-footer{background:rgba(0,0,0,.34)}
/* Compact only the services; retain the approved introduction and top alignment. */
.hero-services .services-heading{font-size:14px;line-height:1.45;margin-bottom:12px}
.hero-services .service-columns{gap:clamp(20px,2.5vw,40px)}
.hero-services .service-columns li{font-size:15px;line-height:1.65}
@media(min-width:761px){
 .hero{min-height:600px}
 .hero-bottom{bottom:36px}
}
@media(min-width:761px) and (max-width:1350px), (min-width:761px) and (max-height:780px){
 .hero-services .services-heading{font-size:12px;margin-bottom:9px}
 .hero-services .service-columns li{font-size:13px;line-height:1.65}
 .hero-services .service-columns{gap:24px}
}
@media(max-width:760px){
 .hero-services .services-heading{font-size:12px;line-height:1.5;margin-bottom:10px}
 .hero-services .service-columns{gap:16px}
 .hero-services .service-columns li{font-size:13px;line-height:1.75}
}
/* Separate black tiles, retaining the original artwork whitespace and row loops. */
.clients .logo-row{--logo-gap:clamp(10px,1.1vw,18px);border:0;padding:0;margin-bottom:var(--logo-gap)}
.clients .logo-row:last-child{border:0;margin-bottom:0}
.clients .logo-group{gap:var(--logo-gap);padding:0 var(--logo-gap) 0 0}
.clients .logo-group li{border:0;background:#000;width:clamp(190px,20vw,290px);height:clamp(144px,13vw,188px);overflow:hidden;display:flex;align-items:center;justify-content:center}
.clients .logo-group img{width:220px;max-width:100%;height:auto;flex:none;transform:none}
@media(max-width:900px){
 .clients .logo-row{--logo-gap:8px}
 .clients .logo-group li{width:calc((100vw - 28.8px)/3.6);height:calc((100vw - 28.8px)/3.6*.95)}
 .clients .logo-group img{width:118%;max-width:none}
}
/* Restore the live site's four-part footer, without its dot or second skull. */
.site-footer{padding:0 var(--gutter) 30px}
.footer-invitation{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;align-items:start;gap:32px;padding:64px 0 80px}
.footer-invitation h2{font-size:clamp(36px,4vw,60px);font-weight:500;line-height:1.1;letter-spacing:-.025em;white-space:nowrap}
.footer-cta{font-size:12px;letter-spacing:.045em;min-height:48px;padding:0 22px;gap:18px;margin:0}
.footer-list h3{font-size:15px;line-height:1.5;font-weight:400;letter-spacing:.025em;margin:2px 0 18px}
.footer-list ul{list-style:none;margin:0;padding:0;font-family:Georgia,'Times New Roman',serif;font-size:15px;line-height:1.7;color:#a8a6a3}
.footer-list li+li{margin-top:4px}
.footer-baseline{justify-content:center;text-align:center;color:#999;font-size:11px;padding-top:10px}
@media(max-width:1050px){
 .footer-invitation{grid-template-columns:1fr 1fr;gap:42px 32px}
 .footer-invitation h2{font-size:48px}.footer-call{justify-self:end}
 .footer-list ul{font-size:14px}
}
@media(max-width:540px){
 .footer-invitation{gap:32px 22px;padding:40px 0 54px}
 .footer-invitation h2{font-size:34px;align-self:center}
 .footer-cta{padding:0 15px;gap:10px;font-size:11px;min-height:44px}
 .footer-cta .cta-arrow{font-size:19px}.footer-list h3{font-size:14px;margin-bottom:14px}
 .footer-list ul{font-size:13px;line-height:1.8}
 .footer-baseline{font-size:10px}
}

/* Revision 52: fixed scroll-driven identity and project-specific image labels. */
body>.brand{position:fixed;left:var(--gutter);top:44px;z-index:50}
.brand-placeholder{display:block;width:76px;height:76px;flex:none}
#selected-work.is-scroll-sequence .work-pin{padding-top:max(96px,calc((100svh - var(--card-height))/2));padding-bottom:44px}
#selected-work .work-labels{left:calc(var(--gutter) + 108px);top:70px;right:var(--gutter);pointer-events:none}
#selected-work .feature-caption,#selected-work.is-scroll-sequence .feature-caption{display:flex;inset:auto 32px 30px;gap:22px;align-items:flex-end;opacity:1;translate:none;transition:none;text-shadow:0 2px 12px #000b}
#selected-work .feature-title{min-width:0}
#selected-work .feature-title h2{font-size:clamp(25px,2.4vw,38px);font-weight:500;line-height:1.08;margin-bottom:8px;letter-spacing:-.025em}
#selected-work .feature-title p{font-size:12px;line-height:1.35;color:#eee}
#selected-work .feature-shade{background:linear-gradient(0deg,#0009 0%,#0004 18%,transparent 45%)}
.feature-controls{display:flex;align-items:center;gap:14px;flex:none}
.feature-number{font-size:12px;color:#eee;font-variant-numeric:tabular-nums;white-space:nowrap}
.feature-number>span{color:#bbb}
#selected-work .feature-arrow{width:44px;height:44px;transform:none;border:1px solid #ffffff50;background:linear-gradient(135deg,#ffffff38,#ffffff0a 55%,#ffffff22);backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%);box-shadow:inset 0 1px 0 #ffffff66,inset 0 -1px 0 #0003,0 5px 22px #0003;color:#fff;text-shadow:none}
#selected-work .feature-arrow svg{width:17px;height:17px}
#selected-work .feature-link:hover .feature-arrow{transform:none;background:#ffffff32}
#selected-work:not(.is-scroll-sequence) .work-labels{display:none}
.clients .logo-group img{width:176px;max-width:80%;transform:translate(var(--mark-x,0%),var(--mark-y,0%))}
/* A numbered editorial index. Original aspect ratios are retained. */
.project-index{padding:90px var(--gutter) 100px;background:#000b;scroll-margin-top:120px}
.index-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-bottom:54px}
.index-head h2{font-size:15px;font-weight:400;margin:0;letter-spacing:.02em}
.index-head p{font-size:11px;color:#888;margin:0}
.index-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:start;gap:70px 14px}
.index-frame{display:block;text-align:left;background:none;padding:0;min-width:0;color:#ddd;transition:opacity .35s ease}
.index-label{display:flex;justify-content:space-between;gap:8px;min-height:26px;font-size:11px;line-height:1.3;font-weight:400}
.index-label>span:last-child{margin-left:auto;font-variant-numeric:tabular-nums}
.index-frame img{display:block;width:100%;height:auto;max-height:290px;object-fit:contain;object-position:top;filter:none}
.project-index.has-highlight .index-frame{opacity:.22}
.project-index.has-highlight .index-frame.is-highlighted{opacity:1}
.index-frame:focus-visible{outline:1px solid #fff;outline-offset:7px}
.index-detail{min-height:25px;display:flex;gap:26px;align-items:baseline;margin-top:48px;font-size:11px;color:#999}
.index-project-link{color:#eee;margin-left:auto}.index-project-link span{margin-left:10px}
.index-reset{background:none;color:#999;padding:0;font-size:11px}
.index-project-link[hidden],.index-reset[hidden]{display:none}
/* Align the footer's heading, call action and column heads on one shared row. */
.footer-invitation h2{line-height:52px;font-size:clamp(36px,4vw,54px)}
.footer-call{height:52px;display:flex;align-items:center}
.footer-cta{min-height:44px;letter-spacing:.05em;padding-inline:26px;font-size:12px;line-height:1.2}
.footer-list h3{height:52px;display:flex;align-items:center;margin:0 0 16px}
.footer-list{scroll-margin-top:130px}
@media(max-width:1000px){.index-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:48px 14px}}
@media(max-width:900px){
 #selected-work.is-scroll-sequence .work-pin{padding-top:42px;padding-bottom:24px}
 #selected-work .work-labels{inset:12px var(--gutter) auto}
 #selected-work .feature-caption,#selected-work.is-scroll-sequence .feature-caption{inset:auto 18px 18px;gap:10px}
 #selected-work .feature-title h2{font-size:20px;margin-bottom:5px}
 #selected-work .feature-title p{font-size:10px}
 #selected-work .feature-controls{gap:8px}
 #selected-work .feature-number{font-size:10px}
 #selected-work .feature-arrow{width:32px;height:32px}
 #selected-work .feature-arrow svg{width:14px;height:14px}
 .clients .logo-group img{width:94.4%;max-width:none}
 .project-index{padding-block:60px 70px}
}
@media(max-width:760px){
 body>.brand{top:24px}
 .brand-placeholder{width:60px;height:60px}
 .index-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 12px}
 .index-head{display:block;margin-bottom:32px}.index-head p{margin-top:10px}
 .index-label{font-size:10px;min-height:34px}
 .index-detail{flex-wrap:wrap;gap:16px}
}
@media(max-width:540px){
 .index-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:38px 14px}
 .index-frame img{max-height:260px}
 .index-project-name{flex-basis:100%}.index-project-link{margin-left:0}
 .footer-invitation h2{font-size:34px}.footer-cta{font-size:11px;padding-inline:20px}
}
@media(prefers-reduced-motion:reduce){.index-frame{transition:none}}

/* Revision 53: section labels share the identity's right-hand alignment. */
.display-filters{position:absolute;pointer-events:none;overflow:hidden}
.clients{padding-top:70px;scroll-margin-top:-35px}
.clients-head{margin-left:calc(var(--gutter) + 108px);justify-content:flex-start;text-align:left}
.clients-head h2,.index-head h2{font-size:12px;line-height:1.5;font-weight:400;letter-spacing:.025em;color:#999}
.clients .logo-group li{background:transparent}
.clients .logo-group img{filter:url(#client-white-knockout)}
.project-index{padding-top:70px;background:transparent;scroll-margin-top:-35px}
.index-head{padding-left:108px}
@media(max-width:760px){
 .clients,.project-index{padding-top:46px}
 .clients-head{margin-left:calc(var(--gutter) + 84px)}
 .index-head{padding-left:84px}
 .clients-head h2,.index-head h2{font-size:11px}
}

/* Revision 54: uninterrupted atmosphere and a single lateral work entrance. */
.hero,#selected-work,.clients,.project-index,.site-footer,
#selected-work.is-scroll-sequence .work-pin{background:transparent}
#selected-work .work-pin{overflow:clip}
#selected-work .work-pin.reveal-ready .work-window,
#selected-work .work-pin.reveal-ready .work-labels{
 transition:translate 1.45s cubic-bezier(.22,.7,.2,1),opacity .8s ease;
}
#selected-work .work-pin.reveal-pending .work-window,
#selected-work .work-pin.reveal-pending .work-labels{translate:100vw 0;opacity:0}
/* Reduce the row pitch by one quarter while preserving mark dimensions. */
.clients .logo-row{--logo-gap:clamp(7.5px,.825vw,13.5px)}
.clients .logo-group li{width:clamp(142.5px,15vw,217.5px);height:clamp(108px,9.75vw,141px);overflow:visible}
.clients .logo-group img{width:clamp(152px,16vw,176px);max-width:none}
.footer-invitation{grid-template-columns:2fr 1fr 1fr;gap:32px}
.footer-contact{padding-left:108px;min-width:0}
.footer-call{height:auto;justify-self:start;justify-content:flex-start;margin-top:20px}
.footer-cta{margin:0;align-self:flex-start;min-height:44px;line-height:1}
@media(max-width:1050px){
 .footer-invitation{grid-template-columns:1fr 1fr;gap:42px 32px}
 .footer-contact{grid-column:1/-1}
}
@media(max-width:900px){
 .clients .logo-row{--logo-gap:6px}
 .clients .logo-group li{width:calc((100vw - 28.8px)/4.8);height:calc((100vw - 28.8px)/4.8*.95)}
 .clients .logo-group img{width:calc((100vw - 28.8px)/3.6*.944)}
}
@media(max-width:760px){.footer-contact{padding-left:84px}.footer-call{margin-top:14px}}
@media(max-width:540px){.footer-invitation{gap:32px 22px}}
@media(prefers-reduced-motion:reduce){
 #selected-work .work-pin.reveal-ready .work-window,
 #selected-work .work-pin.reveal-ready .work-labels{transition:none;translate:none;opacity:1}
}
/* Give the final section room to meet the fixed identity before the page ends. */
.site-footer{min-height:100svh;display:flex;flex-direction:column}
.footer-invitation{flex:1;align-content:start;padding-top:56px}
@media(max-width:760px){.footer-invitation{padding-top:28px}}

/* Revision 55: compact centered selected work; the next chapter may enter view. */
#selected-work.is-scroll-sequence .work-pin{min-height:0;padding:76px 0 24px;top:max(0px,calc((100svh - var(--work-frame,600px))/2))}
#selected-work .work-labels{top:26px}
.clients{padding-top:32px;scroll-margin-top:3px}
@media(max-width:900px){#selected-work.is-scroll-sequence .work-pin{padding:42px 0 20px}#selected-work .work-labels{top:12px}.clients{padding-top:24px;scroll-margin-top:-13px}}
/* Two editorial rows move independently of the page's vertical scroll. */
.index-grid{display:grid;grid-template-columns:none;grid-template-rows:repeat(2,auto);grid-auto-flow:column;grid-auto-columns:clamp(200px,19vw,280px);gap:44px 18px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:none;cursor:grab;padding:8px 0 18px;align-items:start;outline-offset:6px}
.index-grid::-webkit-scrollbar{display:none}.index-grid.is-dragging{cursor:grabbing;user-select:none}
.index-frame{margin:0;min-width:0}.index-art{position:relative}.index-select{display:block;width:100%;border:0;padding:0;background:none;cursor:inherit}
.index-frame img{max-height:310px;width:100%;height:auto;object-fit:contain;object-position:top;pointer-events:none}
.index-actions{position:absolute;inset:auto 9px 9px;display:flex;justify-content:space-between;align-items:center;gap:8px;opacity:0;translate:0 4px;transition:opacity .25s,translate .25s;pointer-events:none}
.index-frame:hover .index-actions,.index-frame:focus-within .index-actions,.index-frame.is-highlighted .index-actions{opacity:1;translate:none}
.index-actions a,.index-actions button{pointer-events:auto;color:white;background:#1119;border:1px solid #ffffff36;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);text-shadow:0 1px 4px #0008}
.index-zoom{width:32px;height:32px;border-radius:50%;padding:7px;flex:none}.index-zoom svg,.index-navigation svg,.lightbox-close svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.3}
.index-view{font-size:10px;line-height:30px;border-radius:20px;padding:0 10px;white-space:nowrap}.index-view span{margin-left:7px}
.index-navigation{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.index-navigation button{width:40px;height:40px;border-radius:50%;border:1px solid #ffffff40;background:#ffffff0c;padding:11px;backdrop-filter:blur(12px)}.index-navigation button:disabled{opacity:.25;cursor:default}
.art-lightbox{position:fixed;inset:24px;margin:0;width:calc(100% - 48px);height:calc(100% - 48px);max-width:none;max-height:none;background:#080808;color:#eee;border:1px solid #ffffff25;padding:20px;overflow:hidden}
.art-lightbox[open]{display:grid;grid-template-rows:40px minmax(0,1fr) 40px;gap:16px}.art-lightbox::backdrop{background:#000b;backdrop-filter:blur(12px)}
.art-lightbox header,.art-lightbox footer{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px}.lightbox-title{margin:0}.lightbox-close{width:40px;height:40px;background:transparent;padding:9px}.lightbox-stage{overflow:auto;display:flex;align-items:center;justify-content:center}.lightbox-stage img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}.is-actual .lightbox-stage{display:block}.is-actual .lightbox-stage img{max-width:none;max-height:none}.lightbox-scale{background:transparent;padding:10px 0;color:#ccc}
/* Services in two columns, with monochrome credential marks on the right. */
.footer-invitation{border-top:0;grid-template-columns:1.7fr 1.6fr 1fr}
#footer-services ul{columns:2;column-gap:24px}#footer-services li{break-inside:avoid}
.credential-grid{display:grid;grid-template-columns:1fr;gap:24px}.credential{display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-width:0}.credential img{display:block;width:auto;max-width:160px;max-height:32px;object-fit:contain;object-position:left center}.credential span{font-size:11px;color:#aaa;letter-spacing:.04em}.credential .credential-google{filter:brightness(0) invert(1);max-height:42px;max-width:180px}
.credential-other{display:flex;flex-direction:column;gap:8px;margin-top:25px;font-size:11px;color:#aaa}
@media(max-width:1050px){.footer-invitation{grid-template-columns:1.4fr 1fr}.footer-contact{grid-column:1/-1}}
@media(max-width:760px){
 .index-grid{grid-auto-columns:43vw;gap:32px 14px}.index-frame img{max-height:260px}.index-label{min-height:30px}
 .index-actions{inset:auto 5px 5px;gap:4px}.index-view{font-size:9px;padding:0 7px;line-height:28px}.index-zoom{width:29px;height:29px}
 .footer-invitation{grid-template-columns:1fr}.footer-contact,#footer-services,.footer-credentials{grid-column:1/-1}
 .credential-grid{grid-template-columns:1fr 1fr;gap:26px}.credential img{max-width:140px}.credential .credential-google{max-width:150px}
 .art-lightbox{inset:10px;width:calc(100% - 20px);height:calc(100% - 20px);padding:12px}.art-lightbox header{font-size:11px}
}
@media(hover:none){.index-actions{opacity:1;translate:none}}
@media(prefers-reduced-motion:reduce){.index-actions{transition:none}}

/* Keep each image action discoverable as new columns enter view. */
.index-actions{opacity:1;translate:none}

/* Revision 56: optical alignment and a clear lane for the fixed identity. */
@media(min-width:761px){.hero-services{padding-top:clamp(5px,.6vw,10px)}}
#selected-work.is-scroll-sequence .work-pin{top:0;padding:156px 0 24px}
#selected-work .work-labels{top:70px;left:calc(var(--gutter) + 108px)}
.clients{padding-top:64px;scroll-margin-top:-29px}
@media(max-width:760px){
 #selected-work.is-scroll-sequence .work-pin{padding-top:116px;padding-bottom:20px}
 #selected-work .work-labels{top:46px;left:calc(var(--gutter) + 84px)}
 .clients{padding-top:48px;scroll-margin-top:-37px}
}
/* Smaller editorial frames bleed past the gutter, dissolving at the viewport edges. */
.index-grid{grid-auto-columns:clamp(170px,15vw,220px);width:calc(100% + 2 * var(--gutter));margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);mask-image:linear-gradient(90deg,transparent,#000 var(--gutter),#000 calc(100% - var(--gutter)),transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--gutter),#000 calc(100% - var(--gutter)),transparent)}
.index-frame img{max-height:290px}
.index-actions,.index-frame.is-highlighted .index-actions{opacity:0;translate:none;pointer-events:none}
.index-frame:hover .index-actions,.index-frame:focus-within .index-actions{opacity:1}
.index-actions button{background:none;border:0;border-radius:0;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;filter:drop-shadow(0 1px 3px #000);pointer-events:none}
.index-frame:hover .index-actions button,.index-frame:focus-within .index-actions button{pointer-events:auto}
.index-zoom{width:34px;height:34px;padding:6px}
@media(max-width:760px){.index-grid{grid-auto-columns:calc((100vw - 2 * var(--gutter) - 14px)/2)}.index-frame img{max-height:260px}}
@media(hover:none){.index-actions{display:none}}
/* The fullscreen viewer leaves only the shared particle atmosphere behind the artwork. */
body.art-viewing>main,body.art-viewing>.brand{visibility:hidden}
.art-lightbox{inset:0;width:100%;height:100dvh;padding:24px var(--gutter);border:0;background:transparent;box-shadow:none;border-radius:0}
.art-lightbox::backdrop{background:transparent;backdrop-filter:none}
.art-lightbox[open]{grid-template-rows:44px minmax(0,1fr) 44px;gap:24px}
.lightbox-stage{touch-action:pan-y;user-select:none;min-height:0}
.art-lightbox.is-actual .lightbox-stage{touch-action:auto}
.lightbox-navigation{display:flex;align-items:center;gap:12px}
.lightbox-navigation button{background:none;border:0;padding:8px;font-size:20px;color:#eee;min-width:40px;min-height:40px}
.lightbox-navigation button:disabled{opacity:.25}
.lightbox-count{font-size:11px;color:#aaa;font-variant-numeric:tabular-nums;min-width:38px;text-align:center}
.art-lightbox footer{display:grid;grid-template-columns:1fr auto 1fr}
.lightbox-scale{justify-self:start}.lightbox-project{justify-self:end;white-space:nowrap}
@media(max-width:760px){.art-lightbox{padding:20px var(--gutter)}.art-lightbox[open]{gap:18px}.art-lightbox header,.art-lightbox footer{font-size:11px}.art-lightbox footer{gap:8px}.lightbox-navigation{gap:2px}.lightbox-navigation button{min-width:32px;padding:4px}.lightbox-title{max-width:calc(100% - 60px);line-height:1.5}}
/* Credentials follow the service list, with equally weighted, open monochrome marks. */
.footer-invitation{grid-template-columns:1.15fr 1fr;column-gap:70px;row-gap:32px}
.footer-contact{grid-column:1;grid-row:1 / 3}
#footer-services,.footer-credentials{grid-column:2}
.footer-credentials h3{height:auto;margin:0 0 28px}
.credential-grid{grid-template-columns:1fr 1fr;gap:30px 24px}
.credential{min-height:64px;justify-content:flex-start;gap:9px}
.credential>img{height:26px;width:auto;max-height:none;max-width:100%;object-fit:contain;object-position:left center}
.credential .credential-google{height:29px;max-height:none;max-width:100%}
.credential-lockup{display:flex;align-items:center;gap:8px;height:26px;white-space:nowrap}
.credential-lockup img{width:26px;height:26px;max-width:none;max-height:none;filter:brightness(0) invert(1)}
.credential-lockup b{font:500 20px/1 Arial,sans-serif;letter-spacing:-.6px;color:#eee}
.credential-ai>span{font-family:Arial,sans-serif;letter-spacing:0}
@media(max-width:1050px){.footer-invitation{column-gap:40px}.credential-lockup b{font-size:17px}}
@media(max-width:760px){.footer-invitation{grid-template-columns:1fr;row-gap:34px}.footer-contact,#footer-services,.footer-credentials{grid-column:1;grid-row:auto}.credential-grid{gap:28px 22px}.credential>img{height:24px}.credential .credential-google{height:27px}}
#selected-work{scroll-margin-top:0}
.credential{position:relative;padding-top:0}
.credential>img{height:28px;object-position:left center}
.credential>img[src$="shopify.svg"]{height:34px;margin-top:-4px;margin-bottom:-2px}
.credential>img[src$="webflow.svg"]{height:23px;margin-top:3px;margin-bottom:2px}
.credential .credential-google{height:28px;max-height:none}
.credential-lockup{height:28px}.credential-lockup img{height:28px;width:28px}
/* Compensate the shared anchor offset so a linked carousel is already pinned. */
#selected-work{scroll-margin-top:-35px}
#selected-work.is-scroll-sequence .work-pin{padding-bottom:48px}
@media(max-width:760px){#selected-work.is-scroll-sequence .work-pin{padding-bottom:40px}}
#selected-work .work-window{mask-image:linear-gradient(90deg,transparent,#000 calc(var(--gutter) * .65),#000 calc(100% - var(--gutter) * .65),transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 calc(var(--gutter) * .65),#000 calc(100% - var(--gutter) * .65),transparent)}
