/* Our approach (/company). One page, read as one sheet of a drawing set:
   hero      = survey frame on a field photo (grid bubbles, chained dimension, crop marks) + title block strip that runs off the sheet
   archive   = contact sheet (stacked plates, frame numbers PH-01..06, plotter carriage between frames, frame ruler)
   approach  = detail callouts on a plotted line that follows the reader; review photo held in place on desktop
   close     = wall framing elevation plotted and counted (24'-0" at 16" o.c. = 18 spaces = 19 studs, marked illustrative)
   Final state is the default. Hidden states only under html.mo-live plus an element pages-company.js marked ([data-pg] or .pc-on).
   Built on pages-base.css (reveal kinds, .pg-s/.pg-f) and around motion.css (h1/h2 dimension strings, .vp-photo img feed). */
:root{--pc-ink:#102441;--pc-gold:#BA8B37;--pc-gold-d:#7d5c21;--pc-paper:#F6F4EE;--pc-stone:#E9E2D4;--pc-rule:rgba(16,36,65,.2);--pc-r:3px;
 --pc-mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;--pc-cond:'Barlow Condensed','Barlow',system-ui,sans-serif;
 --pc-ease:cubic-bezier(.2,.7,.1,1);--pc-stamp:cubic-bezier(.3,1.4,.5,1);
 --pc-tick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9'%3E%3Cpath d='M.5 8.5l8-8' stroke='%23BA8B37' stroke-width='1.3'/%3E%3C/svg%3E")}
@supports (overflow:clip){main#main{overflow-x:clip}}
@supports not (overflow:clip){.pc-tb::after{display:none}}

/* ---------- Hero: survey frame ---------- */
.vp-hero .vp-photo{display:grid;grid-template-columns:minmax(0,1fr);align-content:center;padding-top:44px;position:relative}
.vp-hero .vp-photo>img,.vp-hero .vp-photo>.pc-lens,.vp-hero .vp-photo>.pc-survey{grid-area:1/1}
.vp-hero .vp-photo>.pc-tb{grid-area:2/1}.vp-hero .vp-photo>figcaption{grid-area:3/1;margin-top:10px}
.vp-hero .vp-photo img{aspect-ratio:4/3;border-radius:var(--pc-r)}
.pc-lens{display:block;position:relative;overflow:hidden;border-radius:var(--pc-r)}
.pc-dolly{display:block;transform-origin:50% 62%}
.pc-dolly>img{display:block;width:100%}
.mo-live .pc-lens.pc-go .pc-dolly{scale:1.08;transition:scale 9s cubic-bezier(.15,.75,.3,1) .15s;translate:0 calc(var(--pc-drift,0)*2%)}
@supports (animation-timeline:scroll()){
 .mo-live .pc-lens.pc-go .pc-dolly{animation:pc-drift linear both;animation-timeline:scroll(root);animation-range:0px 900px}
}
@keyframes pc-drift{from{translate:0 0}to{translate:0 2%}}

.pc-survey{position:relative;pointer-events:none;align-self:stretch}
/* crop marks: edge lines extended outward, clear of the corner */
.pc-cm{position:absolute;width:20px;height:20px;--c:linear-gradient(var(--pc-gold),var(--pc-gold))}
.pc-cm--tl{left:-21px;top:-21px;background:var(--c) 0 100%/14px 1px no-repeat,var(--c) 100% 0/1px 14px no-repeat;--sx:-10px;--sy:-10px}
.pc-cm--tr{right:-21px;top:-21px;background:var(--c) 100% 100%/14px 1px no-repeat,var(--c) 0 0/1px 14px no-repeat;--sx:10px;--sy:-10px}
.pc-cm--bl{left:-21px;bottom:-21px;background:var(--c) 0 0/14px 1px no-repeat,var(--c) 100% 100%/1px 14px no-repeat;--sx:-10px;--sy:10px}
.pc-cm--br{right:-21px;bottom:-21px;background:var(--c) 100% 0/14px 1px no-repeat,var(--c) 0 100%/1px 14px no-repeat;--sx:10px;--sy:10px}
/* grid bubbles A-D with a chained dimension, rows 1-3 on the left */
.pc-gx{position:absolute;left:0;right:0;top:-42px;height:34px}
.pc-gx::before{content:"";position:absolute;left:calc(12.5% - 9px);right:calc(12.5% - 9px);bottom:7px;height:1px;background:var(--pc-gold);transform-origin:0 50%}
.pc-gx i,.pc-gy i{position:absolute;font:500 10px/18px var(--pc-mono);font-style:normal;color:var(--pc-ink);text-align:center}
.pc-gx i{bottom:0;width:20px;height:34px;margin-left:-10px;background:var(--pc-tick) 50% calc(100% - 3px)/9px 9px no-repeat}
.pc-gx i::before,.pc-gy i::before{content:"";position:absolute;left:1px;top:0;width:18px;height:18px;box-sizing:border-box;border:1px solid var(--pc-ink);border-radius:50%}
.pc-gx i::after{content:"";position:absolute;left:50%;top:18px;width:1px;height:16px;background:var(--pc-ink);opacity:.55}
.pc-gx i:nth-child(1){left:12.5%}.pc-gx i:nth-child(2){left:37.5%}.pc-gx i:nth-child(3){left:62.5%}.pc-gx i:nth-child(4){left:87.5%}
.pc-gx b{position:absolute;left:50%;bottom:11px;transform:translateX(-50%);font:500 9.5px/1 var(--pc-mono);letter-spacing:.16em;color:var(--pc-gold-d);white-space:nowrap}
.pc-gy{position:absolute;top:0;bottom:0;left:-46px;width:36px}
.pc-gy::before{content:"";position:absolute;top:calc(100%/6 - 9px);bottom:calc(100%/6 - 9px);right:6px;width:1px;background:var(--pc-gold);transform-origin:50% 0}
.pc-gy i{left:0;width:36px;height:20px;margin-top:-10px;text-align:left;padding-left:6px;box-sizing:border-box;background:var(--pc-tick) calc(100% - 2px) 50%/9px 9px no-repeat}
.pc-gy i::after{content:"";position:absolute;left:19px;top:9px;width:17px;height:1px;background:var(--pc-ink);opacity:.55}
.pc-gy i:nth-child(1){top:calc(100%/6)}.pc-gy i:nth-child(2){top:50%}.pc-gy i:nth-child(3){top:calc(500%/6)}

/* title block: runs past the photo to the edge of the sheet */
.pc-tb{position:relative;display:flex;margin-top:24px;border-block:1px solid var(--pc-ink);min-height:50px;color:var(--pc-ink)}
.pc-tb>.pc-c{display:flex;flex-direction:column;justify-content:center;gap:4px;min-width:0;padding:7px 14px 6px;border-left:1px solid var(--pc-rule)}
.pc-tb>.pc-c:first-child{border-left-color:var(--pc-ink)}
.pc-tb small{font:600 10px/1 var(--pc-cond);letter-spacing:.16em;text-transform:uppercase;color:#56606e}
.pc-tb b{font:500 12.5px/1.15 var(--pc-mono);letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc-tb .pc-tb-subj{flex:1 1 auto}.pc-tb .pc-tb-subj b{font:500 15px/1.15 var(--font-body,Barlow,sans-serif);letter-spacing:0}
.pc-tb::after{content:"";position:absolute;left:100%;top:-1px;bottom:-1px;width:100vw;border-block:1px solid var(--pc-ink);transform-origin:0 50%;pointer-events:none}
.pc-tb .pc-stamp{position:absolute;right:132px;top:-31px;z-index:1;padding:6px 10px 5px;border:1.5px solid #8a6626;outline:1px solid #8a6626;outline-offset:2px;border-radius:2px;background:var(--pc-paper);color:#6f5220;
 font:700 12px/1 var(--pc-cond);letter-spacing:.2em;text-transform:uppercase;transform:rotate(-5deg)}

/* hero entrance: frame registers after the photo feeds out */
.mo-live .pc-survey[data-pg]:not(.pg-in),.mo-live .pc-tb[data-pg]:not(.pg-in){opacity:1}
.mo-live .pc-survey[data-pg]:not(.pg-in) .pc-cm{opacity:0;translate:var(--sx) var(--sy)}
.mo-live .pc-survey[data-pg].pg-in .pc-cm{transition:opacity .3s ease var(--pc-dl,.55s),translate .7s var(--pc-ease) var(--pc-dl,.55s)}
.mo-live .pc-survey[data-pg]:not(.pg-in) :is(.pc-gx,.pc-gy)::before{transform:scale(0)}
.mo-live .pc-survey[data-pg].pg-in .pc-gx::before{transition:transform .8s var(--pc-ease) .25s}
.mo-live .pc-survey[data-pg].pg-in .pc-gy::before{transition:transform .7s var(--pc-ease) .45s}
.mo-live .pc-survey[data-pg]:not(.pg-in) :is(.pc-gx,.pc-gy) :is(i,b){opacity:0;transform:translateY(6px)}
.mo-live .pc-survey[data-pg]:not(.pg-in) .pc-gx b{transform:translate(-50%,6px)}
.mo-live .pc-survey[data-pg].pg-in :is(.pc-gx,.pc-gy) :is(i,b){transition:opacity .35s ease,transform .45s var(--pc-ease)}
.mo-live .pc-survey[data-pg].pg-in :is(.pc-gx,.pc-gy) i:nth-child(1){transition-delay:.35s}.mo-live .pc-survey[data-pg].pg-in :is(.pc-gx,.pc-gy) i:nth-child(2){transition-delay:.45s}
.mo-live .pc-survey[data-pg].pg-in :is(.pc-gx,.pc-gy) i:nth-child(3){transition-delay:.55s}.mo-live .pc-survey[data-pg].pg-in .pc-gx i:nth-child(4){transition-delay:.65s}.mo-live .pc-survey[data-pg].pg-in .pc-gx b{transition-delay:.8s}
.mo-live .pc-tb[data-pg]:not(.pg-in){border-color:transparent}
.mo-live .pc-tb[data-pg]:not(.pg-in)::before{transform:scaleX(0)}
.mo-live .pc-tb[data-pg]::before{content:"";position:absolute;inset:-1px 0;border-block:1px solid var(--pc-ink);transform-origin:0 50%;pointer-events:none}
.mo-live .pc-tb[data-pg].pg-in::before{transition:transform .7s var(--pc-ease) .7s}
.mo-live .pc-tb[data-pg].pg-in{transition:border-color 0s 1.4s}
.mo-live .pc-tb[data-pg]:not(.pg-in)::after{transform:scaleX(0)}
.mo-live .pc-tb[data-pg].pg-in::after{transition:transform 1.1s var(--pc-ease) 1.2s}
.mo-live .pc-tb[data-pg]:not(.pg-in)>.pc-c{opacity:0;transform:translateY(5px)}
.mo-live .pc-tb[data-pg].pg-in>.pc-c{transition:opacity .35s ease,transform .45s var(--pc-ease)}
.mo-live .pc-tb[data-pg].pg-in>.pc-c:nth-child(1){transition-delay:.85s}.mo-live .pc-tb[data-pg].pg-in>.pc-c:nth-child(2){transition-delay:.93s}
.mo-live .pc-tb[data-pg].pg-in>.pc-c:nth-child(3){transition-delay:1.01s}.mo-live .pc-tb[data-pg].pg-in>.pc-c:nth-child(4){transition-delay:1.09s}
.mo-live .pc-tb[data-pg]:not(.pg-in) .pc-stamp{opacity:0}
.mo-live .pc-tb[data-pg].pg-in .pc-stamp{animation:pc-stamp .55s var(--pc-stamp) 1.45s backwards}
@keyframes pc-stamp{0%{opacity:0;transform:scale(1.6) rotate(-14deg)}60%{opacity:1;transform:scale(.96) rotate(-4deg)}100%{transform:rotate(-5deg)}}

/* ---------- Archive: contact sheet ---------- */
.vp-gallery-panel>img{border-radius:var(--pc-r)}
.vp-gallery.is-enhanced{position:relative;padding-bottom:30px}
.pc-on .vp-gallery-panel>img,.pc-on .vp-gallery-panel>.pc-under,.pc-on .vp-gallery-panel>.pc-over{grid-area:1/1}
.pc-on .vp-gallery-panel>figcaption{grid-area:1/2}
.pc-on .vp-gallery-panel>img{position:relative;z-index:1;object-position:50% var(--pc-oy,50%);touch-action:pan-y pinch-zoom;-webkit-user-drag:none;user-select:none;cursor:grab}
.pc-on .vp-gallery-panel>img:active{cursor:grabbing}
.pc-under,.pc-over{display:block;align-self:end;width:100%;aspect-ratio:16/11;border-radius:var(--pc-r)}
/* plates stacked under the current frame: hard 1px sheet edges, no blur */
.pc-under{position:relative;z-index:0;background:#E4DDCF 50% var(--pc-oy,50%)/cover no-repeat;
 box-shadow:9px 9px 0 -1px var(--pc-paper),9px 9px 0 0 rgba(16,36,65,.32),18px 18px 0 -1px var(--pc-paper),18px 18px 0 0 rgba(16,36,65,.2)}
.pc-over{position:relative;z-index:2;overflow:hidden;pointer-events:none}
.pc-carriage{position:absolute;inset:0;opacity:0;border-right:2px solid var(--pc-gold);background:linear-gradient(90deg,transparent calc(100% - 56px),rgba(186,139,55,.2))}
.pc-dir-r .pc-carriage{border-right:0;border-left:2px solid var(--pc-gold);background:linear-gradient(270deg,transparent calc(100% - 56px),rgba(186,139,55,.2))}
.pc-tag{position:absolute;left:12px;top:12px;padding:6px 8px 5px;border-radius:2px;background:var(--pc-paper);color:var(--pc-ink);font:500 11px/1 var(--pc-mono);letter-spacing:.12em}
.pc-on .vp-gallery-panel>img.pc-drag{translate:var(--pc-dx,0) 0}
.mo-live .pc-on .vp-gallery-panel>img:not(.pc-drag){transition:translate .35s var(--pc-ease)}
/* frames on the contact sheet */
.pc-on [data-gallery-thumb]{position:relative}
.pc-on [data-gallery-thumb] img{border-radius:2px}
.vp-gallery-thumbs .pc-fn{position:absolute;left:9px;top:9px;display:block;margin:0;padding:3px 5px 2px;border-radius:2px;background:var(--pc-paper);color:var(--pc-ink);font:500 9.5px/1.1 var(--pc-mono);letter-spacing:.1em}
.pc-on [data-gallery-thumb]::after{content:"";position:absolute;inset:-7px;pointer-events:none;opacity:0;--c:linear-gradient(var(--pc-gold),var(--pc-gold));
 background:var(--c) 0 0/12px 1px,var(--c) 0 0/1px 12px,var(--c) 100% 0/12px 1px,var(--c) 100% 0/1px 12px,var(--c) 0 100%/12px 1px,var(--c) 0 100%/1px 12px,var(--c) 100% 100%/12px 1px,var(--c) 100% 100%/1px 12px;background-repeat:no-repeat}
.pc-on [data-gallery-thumb][aria-pressed=true]::after{opacity:1}
.pc-on [data-gallery-status]{font-family:var(--pc-mono);font-variant-numeric:tabular-nums;letter-spacing:.06em;display:inline-block}
/* frame ruler: one segment per frame, filled in gold up to the current one */
.pc-ruler{position:absolute;left:0;right:0;bottom:0;height:16px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:12px;pointer-events:none}
.pc-ruler::before{content:"";position:absolute;left:0;right:0;bottom:4px;height:1px;background:rgba(16,36,65,.26)}
.pc-ruler::after{content:"";position:absolute;right:0;bottom:0;width:1px;height:10px;background:rgba(16,36,65,.45)}
.pc-ruler i{position:relative}
.pc-ruler i::before{content:"";position:absolute;left:0;bottom:0;width:1px;height:10px;background:rgba(16,36,65,.45)}
.pc-ruler i::after{content:"";position:absolute;left:0;right:0;bottom:3px;height:3px;background:var(--pc-gold);transform:scaleX(0);transform-origin:0 50%}
.pc-ruler i.on::after{transform:none}
.mo-live .pc-ruler i::after{transition:transform .42s var(--pc-ease) var(--pc-dl,0s)}

/* archive motion: the first frame plots when the sheet comes into view (.pg-in), then every turn (.pc-turned) */
.mo-live .vp-gallery:is(.pg-in,.pc-turned) [data-gallery-panel]:not([hidden])>img{animation:pc-in-l .9s var(--pc-ease) .12s backwards}
.mo-live .vp-gallery:is(.pg-in,.pc-turned) [data-gallery-panel]:not([hidden]) .pc-carriage{animation:pc-car-l .9s var(--pc-ease) .12s backwards}
.mo-live .vp-gallery.pc-dir-r [data-gallery-panel]:not([hidden])>img{animation-name:pc-in-r}
.mo-live .vp-gallery.pc-dir-r [data-gallery-panel]:not([hidden]) .pc-carriage{animation-name:pc-car-r}
.mo-live .vp-gallery.pc-turned [data-gallery-panel]:not([hidden])>img,.mo-live .vp-gallery.pc-turned [data-gallery-panel]:not([hidden]) .pc-carriage{animation-duration:.72s;animation-delay:0s}
.mo-live .vp-gallery:is(.pg-in,.pc-turned) [data-gallery-panel]:not([hidden]) .pc-tag{animation:pc-tag .45s var(--pc-stamp) .62s backwards}
.mo-live .vp-gallery.pc-turned [data-gallery-panel]:not([hidden]) .pc-tag{animation-delay:.42s}
.mo-live .vp-gallery:is(.pg-in,.pc-turned) [data-gallery-panel]:not([hidden])>figcaption>*{animation:pc-rise .5s var(--pc-ease) backwards}
.mo-live .vp-gallery:is(.pg-in,.pc-turned) [data-gallery-panel]:not([hidden])>figcaption>:nth-child(1){animation-delay:.2s}
.mo-live .vp-gallery:is(.pg-in,.pc-turned) [data-gallery-panel]:not([hidden])>figcaption>:nth-child(2){animation-delay:.27s}
.mo-live .vp-gallery:is(.pg-in,.pc-turned) [data-gallery-panel]:not([hidden])>figcaption>:nth-child(3){animation-delay:.34s}
.mo-live .vp-gallery:is(.pg-in,.pc-turned) [data-gallery-panel]:not([hidden])>figcaption>:nth-child(4){animation-delay:.41s}
.mo-live .vp-gallery.pg-in:not(.pc-turned) [data-gallery-thumb]{animation:pc-rise .5s var(--pc-ease) calc(.35s + var(--pc-k,0)*55ms) backwards}
.mo-live .vp-gallery.pg-in:not(.pc-turned) .pc-ruler{animation:pc-line .9s var(--pc-ease) .7s backwards}
.mo-live .pc-on [data-gallery-thumb][aria-pressed=true]::after{animation:pc-register .38s var(--pc-ease)}
.mo-live .pc-on [data-gallery-status].pc-tick{animation:pc-tick .32s var(--pc-ease)}
@keyframes pc-in-l{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@keyframes pc-in-r{from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0)}}
@keyframes pc-car-l{0%{opacity:1;transform:translateX(-100%)}86%{opacity:1}100%{opacity:0;transform:none}}
@keyframes pc-car-r{0%{opacity:1;transform:translateX(100%)}86%{opacity:1}100%{opacity:0;transform:none}}
@keyframes pc-tag{0%{opacity:0;transform:scale(1.4) rotate(-6deg)}60%{opacity:1;transform:scale(.97)}}
@keyframes pc-rise{from{opacity:0;transform:translateY(10px)}}
@keyframes pc-line{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 -2px 0 0)}}
@keyframes pc-register{from{opacity:0;transform:scale(1.12)}}
@keyframes pc-tick{from{opacity:.2;transform:translateY(-5px)}}

/* ---------- Approach: detail callouts on a plotted line ---------- */
.vp-principles>li{position:relative;padding-left:82px}
.pc-bubble{position:absolute;left:0;top:17px;z-index:1;width:56px;height:56px;box-sizing:border-box;border:1.25px solid var(--pc-ink);border-radius:50%;background:#eae6dc;color:var(--pc-ink);
 display:grid;grid-template-rows:1fr 1fr;justify-items:center}
.pc-bubble::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--pc-ink)}
.pc-bubble b{align-self:end;padding-bottom:4px;font:500 16px/1 var(--pc-mono);letter-spacing:.02em}
.pc-bubble i{align-self:start;padding-top:6px;font:600 8.5px/1 var(--pc-cond);font-style:normal;letter-spacing:.12em;text-transform:uppercase}
.vp-principles>li:not(:last-child)::before,.vp-principles>li:not(:last-child)::after{content:"";position:absolute;top:45px;left:27.5px;width:1px;height:100%;pointer-events:none}
.vp-principles>li:not(:last-child)::before{background:repeating-linear-gradient(to bottom,rgba(16,36,65,.38) 0 6px,transparent 6px 11px)}
.vp-principles>li:not(:last-child)::after{left:27px;width:2px;background:var(--pc-gold);transform-origin:50% 0}
.mo-live .vp-principles>li[data-pg]:not(:last-child)::after{transform:scaleY(var(--pc-s,0))}
.mo-live .vp-principles>li[data-pg]:not(.pc-hit) .pc-bubble{opacity:0;transform:scale(1.45) rotate(-12deg)}
.mo-live .vp-principles>li[data-pg].pc-hit .pc-bubble{transition:opacity .18s ease,transform .5s var(--pc-stamp)}
.mo-live .vp-principles>li[data-pg] .nl-icon-heading>.nl-icon{stroke-dasharray:130;stroke-dashoffset:130}
.mo-live .vp-principles>li[data-pg].pc-hit .nl-icon-heading>.nl-icon{stroke-dashoffset:0;transition:stroke-dashoffset 1.1s var(--pc-ease) .2s}
.vp-approach .vp-photo{display:grid;grid-template-columns:minmax(0,1fr)}
.vp-approach .vp-photo>img,.vp-approach .vp-photo>.pc-survey{grid-area:1/1}
.vp-approach .vp-photo>figcaption{grid-area:2/1;margin-top:26px}
.vp-approach .vp-photo img{border-radius:var(--pc-r)}

/* ---------- Close: wall framing plotted and counted ---------- */
.tk-close{position:relative;overflow:hidden;background:var(--pc-paper);border-top:1px solid var(--pc-rule)}
.tk-close>.tk-wrap{position:relative;z-index:1}
.pc-wall{display:block;height:auto;pointer-events:none;overflow:visible}
.pc-wall path{fill:none;stroke-linecap:square}
.pc-wall .pc-w-ln{stroke:var(--pc-ink);stroke-width:1;stroke-opacity:.62}
.pc-wall .pc-w-st{stroke:var(--pc-ink);stroke-width:.9;stroke-opacity:.5}
.pc-wall .pc-w-dm{stroke:var(--pc-gold);stroke-width:.9}
.pc-wall .pc-w-tk{stroke:var(--pc-gold);stroke-width:1.3}
.pc-wall text{font-family:var(--pc-mono);font-size:11px;letter-spacing:.08em;fill:var(--pc-ink);fill-opacity:.86}
.pc-wall .pc-w-g{fill:var(--pc-gold-d);fill-opacity:1}
.pc-wall .pc-w-count{font-size:12px;letter-spacing:.14em;fill-opacity:1}
.pc-wall .pc-n{font-size:22px;letter-spacing:.02em;font-weight:500}
.pc-wall .pc-w-note{font-size:10.5px;letter-spacing:.18em;fill-opacity:.86}

/* text links keep their look but get a 44px hit area */
main .vp-quiet-link{position:relative}
main .vp-quiet-link::before{content:"";position:absolute;left:-4px;right:-4px;top:50%;height:44px;transform:translateY(-50%)}

/* ---------- Desktop and laptop ---------- */
@media(min-width:1101px){
 .vp-approach{align-items:start}
 .vp-approach>.vp-photo{position:sticky;top:136px}
}
@media(min-width:1024px){
 .tk-close{padding-block:64px}
 #project-archive.vp-section{padding-bottom:72px}
 .tk-close-inner{display:grid;grid-template-columns:minmax(0,min(560px,46%));justify-content:start;row-gap:30px}
 .tk-close-inner>.btn{justify-self:start}
 .pc-wall{position:absolute;z-index:0;top:50%;right:-18px;width:min(51%,820px);transform:translateY(-50%)}
}
@media(max-width:1100px){
 .vp-hero .vp-photo img{aspect-ratio:1/1}
 .pc-gy{display:none}
 .pc-tb .pc-stamp{right:14px}
 .vp-principles .nl-icon-heading>.nl-icon{display:none}
}
@media(max-width:1023px){
 .tk-close{display:flex;flex-direction:column;padding-block:40px 56px}
 .pc-wall{width:min(calc(100% - 64px),540px);margin:0 auto 22px 32px}
 .pc-wall .pc-w-ln{stroke-width:1.3}.pc-wall .pc-w-st{stroke-width:1.2}.pc-wall .pc-w-dm{stroke-width:1.2}
 .pc-wall text{font-size:12.5px}.pc-wall .pc-w-count{font-size:14px}.pc-wall .pc-w-note{font-size:12px}
}
@media(max-width:850px){.tk-close-inner>.btn{align-self:flex-start}}
@media(max-width:700px){.pc-wall{width:calc(100% - 40px);margin-left:20px}}

/* ---------- Phones ---------- */
@media(max-width:600px){
 .vp-hero .vp-photo{padding-top:38px}
 .vp-hero .vp-photo img{aspect-ratio:2/1}
 .pc-cm{width:16px;height:16px}.pc-cm--tl,.pc-cm--bl{left:-14px}.pc-cm--tr,.pc-cm--br{right:-14px}.pc-cm--tl,.pc-cm--tr{top:-17px}.pc-cm--bl,.pc-cm--br{bottom:-17px}
 .pc-cm{--c:linear-gradient(var(--pc-gold),var(--pc-gold))}
 .pc-cm--tl{background-size:10px 1px,1px 10px}.pc-cm--tr{background-size:10px 1px,1px 10px}.pc-cm--bl{background-size:10px 1px,1px 10px}.pc-cm--br{background-size:10px 1px,1px 10px}
 .pc-gx{top:-36px;height:30px}
 .pc-gx i{height:30px;width:18px;margin-left:-9px;font-size:9px;line-height:16px}
 .pc-gx i::before{width:16px;height:16px}.pc-gx i::after{top:16px;height:14px}
 .pc-tb{margin-top:20px;min-height:42px}
 .pc-tb>.pc-c{padding:6px 10px 5px;gap:3px}
 .pc-tb small{font-size:9px}.pc-tb b{font-size:11px}.pc-tb .pc-tb-subj b{font-size:13.5px}
 .pc-tb .pc-tb-src{display:none}
 .pc-tb .pc-stamp{right:10px;top:-27px;font-size:10.5px;padding:5px 8px 4px}
 .vp-hero .vp-photo>figcaption{margin-top:8px}
 .pc-on .vp-gallery-panel{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
 .pc-on .vp-gallery-panel>figcaption{grid-area:2/1}
 .vp-gallery-panel>img,.pc-under,.pc-over{aspect-ratio:3/2}
 .pc-under{box-shadow:6px 6px 0 -1px var(--pc-paper),6px 6px 0 0 rgba(16,36,65,.32),12px 12px 0 -1px var(--pc-paper),12px 12px 0 0 rgba(16,36,65,.2)}
 .pc-tag{left:9px;top:9px;font-size:10px;padding:5px 7px 4px}
 /* the contact sheet becomes a filmstrip you can flick */
 .vp-gallery.is-enhanced .vp-gallery-thumbs{display:flex;gap:9px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:20px;
  margin-inline:-20px;padding:8px 20px 6px;scrollbar-width:none;position:relative}
 .vp-gallery.is-enhanced .vp-gallery-thumbs::-webkit-scrollbar{display:none}
 .vp-gallery.is-enhanced .vp-gallery-thumbs>button{flex:0 0 calc((100% - 40px - 18px)/3.35);scroll-snap-align:start}
 .vp-gallery-thumbs .pc-fn{left:7px;top:7px;font-size:9px}
 .vp-gallery.is-enhanced{padding-bottom:24px}
 .pc-ruler{column-gap:4px}
 .vp-principles>li{padding-left:60px;padding-block:16px}
 .vp-principles .nl-icon-heading>.nl-icon{display:none}
 .pc-bubble{width:46px;height:46px;top:14px}
 .pc-bubble b{font-size:13.5px;padding-bottom:3px}.pc-bubble i{font-size:7.5px;padding-top:5px;letter-spacing:.1em}
 .vp-principles>li:not(:last-child)::before,.vp-principles>li:not(:last-child)::after{top:37px;left:22.5px}
 .vp-principles>li:not(:last-child)::after{left:22px}
 .tk-close{padding-block:24px 48px}
 .tk-close-inner>div>p:not(.tk-overline){display:none} /* repeats the hero line; the drawing says it on phones */
 .pc-wall{width:calc(100% - 28px);margin:0 0 12px 14px}
 .pc-wall text{font-size:17px}.pc-wall .pc-w-count{font-size:18px}.pc-wall .pc-n{font-size:34px}.pc-wall .pc-w-note{font-size:16.5px}
 .pc-wall text[y="296"]{font-size:15.5px;letter-spacing:0}
 .pc-wall .pc-w-ln{stroke-width:1.9}.pc-wall .pc-w-st{stroke-width:1.7}.pc-wall .pc-w-dm{stroke-width:1.7}.pc-wall .pc-w-tk{stroke-width:2.2}
 .pc-wall .pc-w-hide-s{display:none}
}

@media(prefers-reduced-motion:reduce){
 .pc-dolly{scale:none!important;translate:none!important;animation:none!important;transition:none!important}
 .pc-cm,.pc-tb>.pc-c,.pc-bubble,.pc-gx i,.pc-gy i{opacity:1!important;transform:none!important;translate:none!important;transition:none!important}
 .pc-gx b{opacity:1!important;transition:none!important}
 .pc-tb .pc-stamp{opacity:1!important;animation:none!important}
 .vp-principles .nl-icon{stroke-dasharray:none!important}
 .vp-gallery *{animation:none!important}
}
@media print{.pc-survey,.pc-tb::after,.pc-ruler,.pc-carriage{display:none!important}.pc-dolly{scale:none!important;translate:none!important}}