:root{--dark:#101b16;--paper:#edece6;--ink:#202b23;--light:#f4f2ec;--g:clamp(22px,5.25vw,90px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'DM Sans',Arial,sans-serif;background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased}body.no-scroll{overflow:hidden}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #9fc9a6;outline-offset:5px}img{display:block;max-width:100%}.skip{position:absolute;left:-9999px;top:0;z-index:999;background:#fff;color:#000;padding:10px}.skip:focus{left:10px}
.case-header{position:absolute;top:0;left:0;right:0;z-index:10;display:flex;justify-content:space-between;align-items:start;gap:24px;padding:32px var(--g);color:var(--light);letter-spacing:.12em}.case-logo{font-size:12px;font-weight:600;line-height:1.27}.case-logo span{display:block}.case-logo small{display:block;font-size:8px;letter-spacing:.18em;margin-top:12px;font-weight:500}.back-link{display:inline-block;border-bottom:1px solid #f4f2ec95;padding:9px 0;font-size:11px;font-weight:600;white-space:nowrap}.back-link span{margin-right:14px}
.case-hero{height:100svh;min-height:580px;position:relative;background:#303b34;overflow:hidden;color:var(--light)}.case-hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 50%;transform:scale(1.045)}.case-hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,25,17,.72) 0%,rgba(14,29,20,.33) 51%,rgba(15,27,21,.16)),linear-gradient(0deg,rgba(8,16,11,.64),transparent 31%)}.case-hero-content{position:relative;z-index:1;display:flex;justify-content:flex-end;flex-direction:column;height:100%;padding:clamp(150px,19vw,260px) var(--g) 55px}.eyebrow{font-size:10px;font-weight:600;letter-spacing:.19em}.case-hero h1{font-size:clamp(82px,12vw,205px);line-height:.87;font-weight:500;letter-spacing:-.105em;margin:35px 0 auto;max-width:1200px}.case-hero h1 em{font-style:normal;font-weight:400}.case-hero-footer{display:flex;justify-content:space-between;gap:25px;align-items:end;flex-wrap:wrap;font-size:10px;font-weight:600;letter-spacing:.13em}.case-hero-footer a{padding:10px 0;border-bottom:1px solid #d7e4d2}.case-hero-footer a span{margin-left:14px}.edge-note{position:absolute;right:var(--g);top:50%;writing-mode:vertical-rl;font-size:9px;letter-spacing:.13em;color:#e0e3d8bf}
.case-intro{display:grid;grid-template-columns:minmax(170px,.45fr) minmax(0,1.2fr);gap:clamp(40px,7vw,140px);padding:clamp(95px,10vw,175px) var(--g);background:var(--paper)}.case-intro-label{display:flex;align-items:start;gap:14px;flex-direction:column;font-size:10px;letter-spacing:.16em;font-weight:600;color:#4b6551}.divider-line{height:1px;width:70px;background:#a2b0a2}.case-intro-copy h2,.gallery-head h2,.case-next h2{font-size:clamp(58px,7vw,116px);line-height:.94;font-weight:500;letter-spacing:-.085em;margin:0 0 37px}.case-intro-copy p{font-size:clamp(16px,1.65vw,22px);line-height:1.67;max-width:720px;color:#4b5c4d}.case-intro-copy .small-note{margin-top:35px;font-size:11px;line-height:1.8;color:#718270;max-width:640px}
.case-gallery{background:#e1e3d9;padding:clamp(95px,10vw,160px) var(--g) 120px}.gallery-head{display:flex;align-items:end;justify-content:space-between;gap:30px;padding-bottom:clamp(60px,7vw,110px)}.eyebrow.dark{color:#49674e}.gallery-head h2{margin:24px 0 0}.gallery-count{font-size:10px;font-weight:600;letter-spacing:.13em;color:#55715a;margin-bottom:7px;white-space:nowrap}
.image-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(18px,3vw,55px);row-gap:clamp(48px,7vw,120px)}.view{min-width:0}.view.wide{grid-column:1/-1}.view:nth-child(4n+2):not(.wide){padding-top:clamp(40px,7vw,135px)}.view a{display:block;position:relative;cursor:zoom-in;overflow:hidden;background:#b1b6ad}.view img{width:100%;height:auto;object-fit:contain;transition:transform .75s cubic-bezier(.2,.8,.2,1);transform:scale(1)}.view a:hover img,.view a:focus-visible img{transform:scale(1.025)}.view figcaption{display:flex;justify-content:space-between;gap:14px;margin-top:17px;padding-top:15px;border-top:1px solid #acb8ac;font-size:10px;letter-spacing:.14em;color:#566a59;text-transform:uppercase;line-height:1.6}.view .view-zoom{font-size:10px}.view.wide img{max-height:1100px;object-fit:contain;object-position:center;background:#bdc4b9}
.case-next{background:#101b16;color:#f3f0e8;padding:clamp(100px,11vw,190px) var(--g) 70px}.case-next h2{margin:25px 0 55px}.case-next>a{display:inline-block;font-size:11px;font-weight:600;letter-spacing:.13em;padding:16px 0;border-bottom:1px solid #b6cdb3}.case-next>a span{margin-left:30px}.case-next small{display:block;margin-top:120px;font-size:10px;letter-spacing:.11em;color:#96a99b}.case-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:27px var(--g);background:#0b120e;color:#c5cfbe;font-size:10px;letter-spacing:.14em}
.lightbox[hidden]{display:none!important}.lightbox{position:fixed;inset:0;z-index:999;background:#0b120f;color:#f3f3ee;padding:24px var(--g);display:flex;align-items:center;justify-content:center}.lightbox-top{position:absolute;top:24px;left:var(--g);right:var(--g);display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:10px;letter-spacing:.13em}.lightbox-top button{background:transparent;color:inherit;border:0;border-bottom:1px solid #c0d0bf;padding:6px 0;font-size:11px;letter-spacing:.13em}.lightbox figure{margin:0;max-width:90%;width:100%;height:calc(100svh - 155px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px}.lightbox figure img{max-width:100%;max-height:calc(100% - 46px);width:auto;height:auto;object-fit:contain}.lightbox figcaption{display:flex;justify-content:space-between;gap:20px;width:min(100%,720px);text-transform:uppercase;font-size:10px;letter-spacing:.12em;color:#9db19d}.lightbox-arrow{position:absolute;top:50%;height:48px;width:48px;border-radius:50%;color:#fff;background:#364a3e80;border:1px solid #ffffff77;font-size:24px;transform:translateY(-50%)}.lightbox-arrow.previous{left:18px}.lightbox-arrow.next{right:18px}
@media(max-width:800px){.case-intro{grid-template-columns:1fr;gap:35px}.case-intro-label{flex-direction:row;align-items:center;gap:15px}.edge-note{display:none}.gallery-head{align-items:start;flex-direction:column}.case-hero h1{font-size:clamp(70px,13vw,118px)}}
@media(max-width:600px){.case-header{padding-top:20px}.case-logo{font-size:10px}.case-logo small{font-size:7px}.back-link{font-size:9px}.case-hero{min-height:550px}.case-hero-image{object-position:52% 50%}.case-hero-content{padding-bottom:40px;padding-top:150px}.case-hero h1{font-size:clamp(65px,15.2vw,105px);margin-top:26px}.case-hero-footer{flex-direction:column;align-items:start}.case-intro{padding:95px var(--g)}.case-intro-copy h2,.gallery-head h2,.case-next h2{font-size:clamp(52px,12vw,78px)}.image-grid{grid-template-columns:1fr;row-gap:48px}.view.wide{grid-column:auto}.view:nth-child(4n+2):not(.wide){padding-top:0}.case-gallery{padding-bottom:95px}.case-next small{margin-top:85px}.lightbox{padding:70px 10px 30px}.lightbox figure{max-width:100%;height:calc(100svh - 170px)}.lightbox-arrow{top:auto;bottom:10px;transform:none;height:42px;width:42px}.lightbox-arrow.previous{left:10px}.lightbox-arrow.next{right:10px}.lightbox-top{top:16px;left:16px;right:16px}.lightbox-top span{max-width:55%;line-height:1.7}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.case-hero-image,.view img{transform:none!important;transition:none!important}}

/* V16 / Consistent gallery rhythm for all case-study pages.
   Deliberately remove arbitrary large tiles, stagger offsets, and uneven image heights. */
.image-grid {--gallery-gap:clamp(16px,2.7vw,42px);grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gallery-gap);row-gap:clamp(28px,3vw,53px);align-items:start}
.image-grid .view,.image-grid .view.wide{grid-column:auto;min-width:0;margin:0;padding-top:0!important}
.image-grid .view:nth-child(4n+2):not(.wide){padding-top:0!important}
.image-grid .view a{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1/1;background:#d8d8d2;overflow:hidden}
.image-grid .view img,.image-grid .view.wide img{display:block;width:100%;height:100%;max-height:none;object-fit:contain;object-position:center center;background:#d8d8d2;transform:none;transition:filter .35s ease}
.image-grid .view a:hover img,.image-grid .view a:focus-visible img{transform:none;filter:brightness(.96)}
.image-grid .view figcaption{min-height:43px;margin-top:13px;padding-top:13px;align-items:flex-start;line-height:1.5}
.image-grid .view:last-child:nth-child(odd){grid-column:1/-1;max-width:calc((100% - var(--gallery-gap)) / 2);width:100%;margin-inline:auto}
@media(max-width:600px){.image-grid{grid-template-columns:1fr;row-gap:26px}.image-grid .view:last-child:nth-child(odd){grid-column:auto;max-width:none;width:100%}.image-grid .view figcaption{min-height:0}}
@media(prefers-reduced-motion:reduce){.image-grid .view img{transition:none!important}}


/* Shared hero-action pattern for project pages with a dedicated full-hero button. */
.colonial-hero-actions{display:flex;gap:26px;align-items:center;flex-wrap:wrap}
.colonial-cover-button{background:none;color:inherit;border:0;border-bottom:1px solid #d7e4d2;padding:10px 0;font:inherit;font-size:10px;font-weight:600;letter-spacing:.13em}
.colonial-cover-button:hover{border-color:#fff;color:#fff}
.colonial-gallery-note{max-width:600px;font-size:13px;line-height:1.8;color:#58705a;margin:0 0 clamp(32px,5vw,78px)}
@media(max-width:600px){.colonial-hero-actions{gap:6px 20px}.colonial-cover-button{font-size:9px}}

/* V22 — case studies: original full-frame imagery and two explicit next steps. */
.case-next-actions{display:flex;gap:18px 44px;align-items:center;flex-wrap:wrap}
.case-next-actions a{font-size:11px;font-weight:600;letter-spacing:.13em;padding:15px 0;border-bottom:1px solid #b6cdb3}
.case-next-actions a:first-child{color:#f4f1df;border-color:#f4f1df}
.case-next-actions a span{margin-left:15px}
.case-next-actions a:hover,.case-next-actions a:focus-visible{color:#dce9d7;border-color:#dce9d7}
.case-hero-footer .colonial-hero-actions{display:flex;gap:13px 26px;align-items:center;flex-wrap:wrap}
@media(max-width:600px){.case-next-actions{align-items:start;flex-direction:column;gap:12px}.case-next-actions a{font-size:10px}}