/* Compact editorial layout. All transforms are decorative enhancements. */
:root{--content:1520px;--gutter:clamp(20px,4.2vw,80px)}
.board-hero h1 em{white-space:normal}.sources a{overflow-wrap:anywhere}
.archive-list ul{gap:20px;grid-template-columns:repeat(4,minmax(0,1fr))}.archive-list li{border:1px solid var(--line);min-width:0;background:#fff}.archive-list a{display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:18px;height:100%;padding:22px 18px;font-size:15px;text-align:center;line-height:1.4;transition:background .2s,transform .3s var(--ease)}.archive-list a img{width:100%;height:110px;object-fit:contain}.archive-list a:hover{background:#e9edff;transform:translateY(-3px)}
@media(max-width:900px){.archive-list ul{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:540px){.archive-list ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.archive-list a{padding:16px 10px;font-size:14px}.archive-list a img{height:85px}}
.viewer-open{overflow:hidden}.project-dialog{width:min(1400px,94vw);max-height:92dvh;padding:0;border:0;border-radius:8px;background:var(--paper);color:var(--ink);box-shadow:0 30px 100px #0005;overscroll-behavior:contain}.project-dialog::backdrop{background:#0d172ac9;backdrop-filter:blur(7px)}.project-dialog[open]{animation:viewer-enter .35s var(--ease)}.viewer-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:15px 25px;border-bottom:1px solid var(--line);font-size:12px;letter-spacing:.05em}.viewer-close{display:flex;align-items:center;gap:18px;border:0;background:none;min-height:44px;padding:8px 12px;font-size:15px}.viewer-close span{font-size:28px;line-height:1}.viewer-layout{display:grid;grid-template-columns:1.35fr 1fr;max-height:calc(92dvh - 75px);overflow:auto}.viewer-visual{overflow:auto;background:#dce1dc;max-height:calc(92dvh - 75px);padding:30px;scrollbar-width:thin;overscroll-behavior:contain}.viewer-visual img{width:100%;height:auto;box-shadow:0 8px 30px #17223620}.viewer-info{padding:50px 40px;align-self:center}.viewer-info h2{font-size:clamp(35px,4vw,59px);margin:22px 0;line-height:1.06;overflow-wrap:break-word}.viewer-info>p:not(.eyebrow){font-size:17px;line-height:1.75;color:var(--muted)}.viewer-info .viewer-scope{font-size:13px!important;color:var(--blue)!important;margin-bottom:22px;font-weight:600}.viewer-info .text-link{display:inline-block;margin:25px 0 20px}.viewer-info .viewer-archive-note{font-size:12px!important}.viewer-controls{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--line);margin-top:30px;padding-top:18px}.viewer-controls button{font-size:14px;min-height:44px;padding:10px 14px;background:none;border:1px solid #9a9e98;border-radius:25px}.viewer-controls button:hover{background:var(--ink);color:white}@keyframes viewer-enter{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:760px){.project-dialog{width:95vw;max-height:94dvh}.viewer-toolbar{padding:10px 16px;font-size:10px}.viewer-layout{display:block;max-height:calc(94dvh - 65px)}.viewer-visual{height:40dvh;max-height:430px;padding:20px}.viewer-info{padding:28px 22px}.viewer-info h2{font-size:38px;margin:16px 0}.viewer-info>p:not(.eyebrow){font-size:16px}.viewer-controls{margin-top:22px}.viewer-close{font-size:14px;gap:10px}}
.nav,.hero,.client-strip,.section,.footer,.board-hero,.board-tools,.story,.archive-list,.board-footer{padding-left:max(var(--gutter),calc((100vw - var(--content))/2));padding-right:max(var(--gutter),calc((100vw - var(--content))/2))}
.nav{height:88px}.nav nav{gap:30px}.nav nav a[href='/storyboard.html']{display:inline!important}.nav .nav-contact{padding:11px 20px}.brand-symbol.code-logo{font-size:43px}.brand small{font-size:10px}.hero{padding-top:22px;padding-bottom:32px}.hero-top .eyebrow,.hero-location{font-size:11px}.hero-copy{display:grid;grid-template-columns:1.45fr .65fr;grid-template-rows:auto auto;column-gap:60px;align-items:end;padding:32px 0 8px}.hero h1{grid-column:1;grid-row:1/3;font-size:clamp(62px,6.6vw,104px);line-height:1;letter-spacing:-.065em}.intro{grid-column:2;grid-row:1;font-size:20px;line-height:1.55;margin:0;max-width:320px;padding-top:30px}.round-link{grid-column:2;grid-row:2;font-size:16px;margin-top:16px;align-self:start}.circle{width:42px;height:42px;font-size:20px}.client-strip{padding-top:20px;padding-bottom:24px;background:#eaeae3}.client-strip>p{font-size:10px;margin-bottom:16px}.client-strip>.client-logos{gap:12px}.client-logos img{height:78px;padding:14px;border-radius:0}.client-logos .wild-logo{padding:0}.work{padding-top:45px;padding-bottom:60px}.section-heading{margin-bottom:25px;align-items:center}.section-heading .eyebrow{font-size:10px;margin-bottom:12px}.section-heading h2{font-size:clamp(38px,4.2vw,62px)}.project-grid{grid-template-columns:1.08fr 1fr;gap:35px 24px}.project-wide{grid-column:auto}.project-visual,.project-wide .project-visual{height:clamp(320px,32vw,470px);padding:94px 28px 0;border-radius:5px;perspective:1000px;transition:box-shadow .65s var(--ease),background .6s}.kitchen{background:#d9ded4}.pearl{background:#c9e1e2}.wild{background:#112f48}.micro{background:#d5d9cb}.project-number{font-size:10px;top:24px;left:24px;max-width:70%}.project-mark{position:absolute;top:48px;left:24px;max-width:130px!important;height:28px;width:auto;object-fit:contain;object-position:left;z-index:2}.kitchen .project-mark{height:33px;background:#23343a;padding:4px 8px;box-sizing:content-box}.wild .project-mark{height:45px;width:70px;object-fit:contain;top:40px}.pearl .project-mark{height:34px}.browser-frame,.kitchen .browser-frame,.micro .browser-frame{position:relative;inset:auto;width:96%;max-height:none;height:100%;transform:translateY(17px) rotate(-2deg);transform-origin:50% 70%;border-radius:6px 6px 0 0;transition:transform .85s var(--ease),box-shadow .85s var(--ease)}.micro .browser-frame{width:73%;margin:0 auto}.browser-frame img{transition:transform 2s var(--ease)}.browser-bar{font-size:9px;height:26px}.project-visual::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at var(--shine-x,50%) var(--shine-y,50%),#ffffff40,transparent 48%);opacity:0;pointer-events:none;transition:opacity .5s}.project-open{height:46px;width:46px;bottom:20px;right:20px;z-index:3;font-size:24px}.project-caption{padding-top:17px;align-items:center}.project-caption h3{font-size:clamp(21px,1.8vw,28px);letter-spacing:-.045em}.project-caption>span{font-size:10px;margin:0}.project{min-width:0}.work-footer{margin-top:30px}.work-footer p,.text-link{font-size:14px}.contact{padding-top:48px;padding-bottom:50px}.contact-top{margin-bottom:24px}.contact h2{font-size:clamp(58px,6.5vw,94px)}.contact-link{font-size:20px;padding-top:16px;padding-bottom:16px}.contact .contact-note{font-size:12px;margin-top:18px}.footer{padding-top:24px;padding-bottom:24px}.footer .code-logo{font-size:29px}.footer p,.footer>a:not(.brand-symbol),.text-button{font-size:12px}
@media(hover:hover) and (pointer:fine){.project:hover .browser-frame{transform:translateY(-9px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) rotate(0deg);box-shadow:0 24px 65px #152c4a40}.project:hover .browser-frame img{transform:translateY(-7%)}.project:hover .project-visual{box-shadow:0 12px 30px #16242f14}.project:hover .project-visual::after{opacity:1}.project:hover .project-open{background:var(--blue);color:white;transform:translate(var(--arrow-x,0px),var(--arrow-y,0px)) rotate(0deg)}}
.project:focus-visible .browser-frame{transform:translateY(-8px) rotate(0)}.project:focus-visible .project-open{background:var(--blue);color:#fff}
@media(min-width:2000px){:root{--content:1680px;--gutter:80px}.nav{height:100px}.hero{padding-top:28px;padding-bottom:36px}.hero-copy{padding-top:38px}.hero h1{font-size:116px}.intro{font-size:23px;max-width:360px}.round-link{font-size:18px}.client-logos img{height:90px}.project-visual,.project-wide .project-visual{height:510px}.project-caption h3{font-size:31px}.nav nav{font-size:18px}.brand{font-size:14px}.brand small{font-size:12px}.hero-top .eyebrow,.hero-location,.client-strip>p,.section-heading .eyebrow,.project-number,.project-caption>span{font-size:13px}.project-mark{height:35px}.browser-bar{font-size:11px}.work-footer p,.text-link{font-size:17px}}
@media(min-width:3000px){:root{--content:1920px}.hero h1{font-size:132px}.hero-copy{column-gap:100px}.intro{font-size:26px;max-width:390px}.round-link{font-size:21px}.nav{height:112px}.nav nav{font-size:21px}.brand{font-size:16px}.brand small{font-size:13px}.brand-symbol.code-logo{font-size:53px}.client-logos img{height:104px}.client-strip{padding-top:25px;padding-bottom:28px}.hero-top .eyebrow,.hero-location,.client-strip>p,.section-heading .eyebrow,.project-number,.project-caption>span{font-size:14px}.project-visual,.project-wide .project-visual{height:570px}.section-heading h2{font-size:72px}.project-caption h3{font-size:34px}.work-footer p,.text-link{font-size:19px}.footer p,.footer>a:not(.brand-symbol),.text-button{font-size:16px}}
@media(max-width:1050px){.hero-copy{grid-template-columns:1.3fr .7fr;column-gap:35px}.hero h1{font-size:clamp(58px,7.2vw,76px)}.intro{font-size:18px;padding-top:18px}.round-link{font-size:14px;gap:12px}.client-strip>.client-logos{grid-template-columns:repeat(6,1fr);gap:8px}.client-logos img{height:70px;padding:10px}.project-caption{display:block}.project-caption>span{display:block;margin-top:8px}.project-visual,.project-wide .project-visual{height:350px;padding:91px 20px 0}.project-caption h3{font-size:24px}.micro .browser-frame{width:85%}}
@media(max-width:760px){.nav{height:80px}.nav nav{gap:20px;font-size:14px}.brand-symbol.code-logo{font-size:35px}.hero{padding-top:18px;padding-bottom:25px}.hero-copy{display:block;padding:27px 0 0}.hero h1{font-size:clamp(52px,9.5vw,73px)}.intro{font-size:18px;max-width:none;padding:0;margin-top:20px}.round-link{font-size:15px;margin-top:18px}.hero-location{font-size:10px}.hero-top .eyebrow{font-size:10px}.client-strip>.client-logos{grid-template-columns:repeat(3,1fr);gap:9px}.client-logos img{height:76px;padding:13px}.client-strip{padding-top:18px;padding-bottom:20px}.client-strip>p{font-size:10px;margin-bottom:12px}.project-grid{gap:30px 18px}.project-visual,.project-wide .project-visual{height:300px;padding:88px 14px 0}.project-number{font-size:9px;top:18px;left:17px}.project-mark{top:40px;left:17px;max-width:115px!important;height:25px}.kitchen .project-mark{height:27px}.wild .project-mark{top:34px;height:43px}.pearl .project-mark{height:30px}.project-caption h3{font-size:21px}.project-caption>span{font-size:9px}.project-open{width:40px;height:40px;right:14px;bottom:14px}.work{padding-top:35px}.section-heading h2{font-size:44px}.section-heading .eyebrow{font-size:10px}.contact h2{font-size:65px}.footer{gap:16px}.story-head{gap:20px}.story h2{font-size:40px}.story-steps{display:block}.story-steps section{margin-top:25px}}
@media(max-width:540px){.project-grid{display:grid;grid-template-columns:1fr;gap:28px}.project{margin:0}.project-visual,.project-wide .project-visual{height:340px;padding:88px 22px 0}.project-caption{display:flex;gap:15px;align-items:flex-start}.project-caption h3{font-size:24px}.project-caption>span{display:none}.section-heading h2{font-size:41px}.hero-copy{padding-top:24px}.hero h1{font-size:clamp(45px,11vw,62px)}.intro{font-size:17px;max-width:320px;line-height:1.55;margin-top:18px}.hero{padding-bottom:23px}.round-link{font-size:15px;margin-top:15px;gap:12px}.circle{width:38px;height:38px}.hero-top .eyebrow,.hero-location{font-size:9px}.nav{height:77px}.nav nav{gap:15px;font-size:13px}.nav .nav-contact{padding:10px 13px}.nav-contact span{margin-left:11px}.brand-symbol.code-logo{font-size:32px}.client-logos img{height:69px;padding:10px}.client-strip>p{font-size:9px}.section-heading{margin-bottom:22px}.work-footer{display:block}.work-footer .text-link{display:inline-block;margin-top:10px;font-size:15px}.contact h2{font-size:clamp(42px,10vw,59px)}.contact-top{font-size:9px}.contact-top .eyebrow{font-size:10px}.contact h2>span{font-size:.6em}.contact-link{font-size:19px}.contact .contact-note{font-size:12px}.footer p,.footer>a:not(.brand-symbol),.text-button{font-size:12px}.story h2{font-size:36px}.story-head{display:block}.board-hero h1{font-size:clamp(43px,11vw,58px)}.board-hero>p:not(.eyebrow){font-size:16px}.archive-list ul{grid-template-columns:repeat(2,minmax(0,1fr))}.status{white-space:normal;line-height:1.6}.story-steps .step,.status,.sources,.board-tools label,.board-tools>p{font-size:12px}}
@media(max-width:360px){.nav nav{gap:11px;font-size:12px}.brand-symbol.code-logo{font-size:29px}.nav .nav-contact{padding:10px}.nav-contact span{margin-left:6px}.hero h1{font-size:43px}.intro{font-size:16px}.client-logos img{height:63px}.project-visual,.project-wide .project-visual{height:300px}.project-caption h3{font-size:22px}}
@media(prefers-reduced-motion:reduce){.project .browser-frame,.project:hover .browser-frame,.project:focus-visible .browser-frame,.project:hover .browser-frame img,.project:hover .project-open{transform:none!important}.project-visual::after{display:none}}
.hero-services{display:block;margin-top:14px;font-size:.85em;line-height:1.65;color:var(--blue)}
