/* White collection surfaces, scoped entirely below the approved comic. */
#work,#career,#contact,#case{--paper:#fff;--ink:#202226;--muted:#697079;--rule:#e2e5e9}
#work.s-work{background:#fff;padding-top:40px;padding-bottom:72px;border-top-color:#e2e5e9;border-bottom-color:#e2e5e9}
#work .library-heading{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:28px}
#work .library-heading h2{font:400 clamp(44px,4.5vw,64px)/1.04 var(--disp);letter-spacing:-.025em;margin:0 0 12px}
#work .library-heading>div>p{font:400 15px/1.6 var(--sans);color:#656b73;margin:0;max-width:56ch}
#work .library-scale{font:400 12px/1.5 var(--sans);color:#747a82;margin:0 0 4px;white-space:nowrap;display:flex;gap:10px}
#work .library-scale>span{color:#c4c9d0}
#work .library-toolbar{display:flex;justify-content:space-between;align-items:center;gap:24px;border-top:1px solid #e2e5e9;padding-top:20px;margin-bottom:28px}
#work .library-toolbar[hidden]{display:none}
#work .library-filters{display:flex;flex-wrap:wrap;gap:6px}
#work .library-filters button{display:flex;align-items:center;gap:8px;min-height:40px;border:1px solid transparent;border-radius:4px;background:transparent;color:#686e77;padding:9px 12px;font:400 12px/1.5 var(--sans);white-space:nowrap;cursor:pointer;transition:background .18s,color .18s}
#work .library-filters button>span{font-size:10px;opacity:.65}
#work .library-filters button:hover{background:#f3f5f7;color:#202226}
#work .library-filters button[aria-pressed=true]{background:#202226;color:#fff}
#work .library-count{font:400 11px/1.5 var(--sans);color:#818791;margin:0;white-space:nowrap}
#work .library-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 28px}
#work .library-card{position:relative;min-width:0;display:flex;flex-direction:column;padding-bottom:18px;border-bottom:1px solid #e2e5e9}
#work .library-card[hidden]{display:none}
#work .library-preview{position:relative;aspect-ratio:16/9;display:grid;place-items:center;overflow:hidden;background:#1b1c20;color:#eeece6;border:1px solid #303238}
#work .library-preview svg{display:block;width:100%;height:100%}
#work .library-preview-arrow{position:absolute;right:14px;bottom:14px;display:grid;place-items:center;width:30px;height:30px;background:#fff;border-radius:50%;color:#272d35;font:400 19px/1 var(--sans);opacity:0;transform:translateY(3px);transition:opacity .18s,transform .18s}
#work .library-card:hover .library-preview-arrow,#work .library-card:focus-within .library-preview-arrow{opacity:1;transform:none}


#work .library-card-meta{display:flex;justify-content:space-between;align-items:start;gap:12px;margin:15px 0 8px;font:400 11px/1.5 var(--sans);color:#727982}
#work .library-card-meta>span:first-child{max-width:30ch}
#work .library-card-meta>span:last-child{white-space:nowrap}
#work .library-card h3{font:400 clamp(23px,2vw,28px)/1.13 var(--disp);letter-spacing:-.015em;margin:0 0 10px;max-width:27ch}
#work .library-open{display:block;border:0;padding:0;color:var(--ink);background:none;cursor:pointer;text-align:left;font:inherit;letter-spacing:inherit}
#work .library-open::after{content:'';position:absolute;inset:0;z-index:1}
#work .library-open:focus-visible{outline:none}
#work .library-card:focus-within{outline:2px solid var(--sig);outline-offset:6px}
#work .library-card:hover .library-open{color:#9f342b}
#work .library-role{font:400 13px/1.55 var(--sans);color:#697079;margin:0 0 14px;max-width:40ch}
#work .library-evidence{font:500 12px/1.5 var(--sans);color:#363c44;margin:auto 0 0}
#career .proof-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:40px}
#career .proof-heading .label{margin:0 0 17px;font-size:10px;letter-spacing:.1em}
#career .proof-heading h2{font:400 clamp(46px,5vw,70px)/1.02 var(--disp);letter-spacing:-.025em;margin:0}
#career.s-career{max-width:none;background:var(--paper);padding-top:76px;padding-bottom:76px}
#career>*{max-width:1320px;margin-left:auto;margin-right:auto}
#career .career-heading{margin-bottom:34px}
#career .career-heading .text-link{font-size:13px;white-space:nowrap;margin-bottom:5px}
#career .career-current{display:grid;grid-template-columns:130px 1fr auto;gap:28px;align-items:start;padding:26px 28px;background:#f5f6f8;border-left:2px solid var(--sig)}
#career .career-current>p{margin:4px 0 0;font:500 12px/1.4 var(--sans);color:#656258}
#career .career-current h3{font:400 clamp(24px,2.6vw,32px)/1.16 var(--disp);letter-spacing:-.015em;margin:0 0 9px}
#career .career-current div>p{margin:0;font:400 14px/1.6 var(--sans);color:#6b6960;max-width:57ch}
#career .career-current-date{font:400 12px/1.5 var(--sans);color:#77746b;padding-top:5px;white-space:nowrap}
#career .career-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));list-style:none;padding:0;margin-top:48px;margin-bottom:0;gap:0}
#career .career-list li{position:relative;display:block;padding:24px 24px 0 0;border:0;border-top:1px solid #cfcabf;min-width:0}
#career .career-list li::before{content:'';position:absolute;top:-4px;left:0;width:7px;height:7px;border-radius:50%;background:#aca69b;box-shadow:0 0 0 5px var(--paper)}
#career .career-list li:last-child::before{background:var(--sig)}
#career .career-list .year{display:block;margin:0 0 12px;font:400 11px/1.4 var(--sans);color:#77746b}
#career .career-list h3{font:400 clamp(22px,2.1vw,29px)/1.15 var(--disp);margin:0 0 11px;letter-spacing:-.015em}
#career .career-list .career-skill{font:500 12px/1.5 var(--sans);color:#56534b;margin:0 0 12px}
#career .career-list .career-proof>span{display:block}
#career .career-list .career-proof{font:400 12px/1.65 var(--sans);color:#8a867d;margin:0}
#contact.s-talk{display:grid;grid-template-columns:1fr auto;align-items:center;gap:48px;padding-top:66px;padding-bottom:64px}
#contact .contact-copy{max-width:620px}
#contact h2{font:400 clamp(52px,6.3vw,88px)/.98 var(--disp);letter-spacing:-.025em;margin:0 0 22px}
#contact .contact-copy>p{font:400 16px/1.65 var(--sans);color:#bbb8b0;max-width:36ch;margin:0}
#contact .contact-actions{display:grid;gap:20px;justify-items:start}
#contact .contact-actions .btn-light{padding:18px 26px;font:500 15px/1.2 var(--sans);display:flex;align-items:center;gap:35px;min-height:54px}
#contact .contact-email{font:400 13px/1.5 var(--sans);color:#d3cfc6;text-decoration:none;border-bottom:1px solid #ffffff30;padding:3px 0;display:flex;gap:22px}
#contact .contact-email:hover{color:#fff;border-color:#fff}
#contact .contact-actions>p{font:400 12px/1.5 var(--sans);color:#8e8a82;margin:8px 0 0}
/* The case opens with a summary. Depth remains a deliberate second step. */
#case .case-bar{padding-top:15px;padding-bottom:15px}
#case .case-bar,#case .case-scroll{width:min(1180px,100%);background:var(--paper)}
#case .case-body{display:block;padding:32px clamp(20px,4vw,48px) 34px}
#case .case-summary{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:48px;align-items:end;padding-bottom:26px;border-bottom:1px solid #e2e5e9}
#case .case-summary .label{margin:0 0 12px;font-size:10px;color:#737a84;letter-spacing:.07em}
#case .case-summary h2{font:400 clamp(31px,3.6vw,48px)/1.08 var(--disp);letter-spacing:-.02em;max-width:26ch;margin:0 0 12px;color:var(--ink)}
#case .case-ownership{font:400 15px/1.5 var(--sans);color:#666e78;margin:0;max-width:54ch}
#case .case-summary-result{margin:0;display:grid;gap:7px;padding:0 0 2px}
#case .case-summary-result strong{font:400 clamp(28px,3vw,42px)/1.1 var(--disp);letter-spacing:-.02em}
#case .case-summary-result>span{font:400 12px/1.55 var(--sans);color:#737a84;max-width:28ch}
#case .case-overview{display:grid;grid-template-columns:1.15fr 1fr;gap:40px;padding-top:28px;align-items:center}
#case .case-art{margin:0;min-width:0;color:#36352f}
#case .case-art>div{background:#1b1c20;border:1px solid #303238;aspect-ratio:16/9;display:grid;place-items:center;overflow:hidden}
#case .case-art svg{display:block;width:100%;height:100%}


#case .case-art figcaption{font:400 11px/1.6 var(--sans);color:#737a84;margin-top:9px}
#case .case-art figcaption a{color:inherit;text-decoration:none;border-bottom:1px solid #cfc8ba}
#case .case-facts{margin:0;display:grid;gap:19px}
#case .case-facts>div{display:grid;gap:6px}
#case .case-facts dt{font:500 11px/1.4 var(--sans);color:#737a84}
#case .case-facts dd{font:400 15px/1.55 var(--sans);color:#3b424a;margin:0}
#case .case-use{display:grid;grid-template-columns:130px 1fr;gap:24px;margin:26px 0;padding:17px 20px;background:#f3f5f7;font:400 14px/1.6 var(--sans);color:#666055}
#case .case-use>span{font-weight:500;color:#827b70;font-size:11px;padding-top:3px}
#case .case-full{border-top:1px solid #e2e5e9;border-bottom:1px solid #e2e5e9}
#case .case-full>summary{display:flex;justify-content:space-between;gap:20px;list-style:none;cursor:pointer;padding:18px 0;font:500 14px/1.5 var(--sans);color:#3b424a}
#case .case-full>summary::-webkit-details-marker{display:none}
#case .case-full[open]>summary>span{transform:rotate(45deg)}
#case .case-full>div{max-width:760px;padding:14px 0 26px}
#case .case-lead{font-size:21px}
#case .case-steps{margin-top:22px}
#case .case-steps p{font:400 16px/1.65 var(--sans)}
#case .case-steps li{grid-template-columns:32px 1fr;gap:6px 16px;padding:20px 0;border-color:#e2e5e9}
#case .case-steps h3{font-size:24px}
#case .case-source{margin:10px 0 20px;font-size:13px}
#case .case-scene{margin-top:16px;max-width:440px;border-color:#d3cdbf;border-radius:0;background:#f7f8fa}
#case .case-scene .label{font-size:10px}
#case .case-claim{border:0;background:none;margin:0;padding:17px 0;border-bottom:1px solid #e2e5e9}
#case .case-claim summary{font:400 12px/1.5 var(--sans);color:#888074}
#case .case-claim p{max-width:80ch;font:400 14px/1.6 var(--sans)}
#case .case-nav{margin-top:22px;gap:20px}
#case .case-nav button{padding:16px 0;border:0;background:none;font-size:20px}
#case .case-nav button:hover{color:var(--sig)}
#case .case-nav .label{font-size:10px}
@media(max-width:1000px){#career .career-current{grid-template-columns:100px 1fr auto;gap:20px;padding:24px}#case .case-overview{gap:28px}#case .case-summary{gap:30px}}
@media(max-width:860px){#career .career-list{grid-template-columns:1fr;margin-top:34px}#career .career-list li{display:grid;grid-template-columns:105px 1fr 1fr;gap:7px 20px;border-top:0;border-left:1px solid #cfcabf;margin-left:4px;padding:0 0 28px 24px}#career .career-list li::before{top:6px;left:-4px}#career .career-list li:last-child{padding-bottom:0}#career .career-list .year{grid-column:1;grid-row:1/span 2;margin:3px 0 0}#career .career-list h3{grid-column:2;margin:0;font-size:27px}#career .career-list .career-skill{grid-column:2;margin:0}#career .career-list .career-proof{grid-column:3;grid-row:1/span 2}#contact.s-talk{grid-template-columns:1fr 1fr;gap:32px}#case .case-overview{grid-template-columns:1fr 1fr;gap:24px}#case .case-facts{gap:16px}#case .case-facts dd{font-size:14px}}
@media(max-width:650px){#career .career-heading .text-link{margin-top:24px}#career .career-current{grid-template-columns:1fr auto;padding:22px 20px;gap:16px}#career .career-current>p{margin:0}#career .career-current>div{grid-column:1/-1;grid-row:2}#career .career-current-date{grid-column:2;grid-row:1;padding:0;font-size:11px}#career .career-current h3{font-size:29px;max-width:24ch}#career .career-current div>p{font-size:13px}#career .career-list li{grid-template-columns:76px 1fr;gap:6px 14px;padding-left:20px;padding-bottom:28px}#career .career-list .year{grid-row:1/span 3;font-size:10px}#career .career-list h3{font-size:26px}#career .career-list .career-proof{grid-column:2;grid-row:3;margin-top:3px}#career .career-list .career-proof>span{display:inline}#career .career-list .career-proof>span+span::before{content:' · '}#contact.s-talk{grid-template-columns:1fr;gap:32px;padding-top:50px;padding-bottom:50px}#contact h2{font-size:66px;max-width:10ch}#contact .contact-copy>p{font-size:15px;max-width:34ch}#contact .contact-actions{gap:18px}#contact .contact-actions>p{margin-top:6px}#case .case-body{padding-top:24px}#case .case-summary{grid-template-columns:1fr;gap:20px;padding-bottom:22px}#case .case-summary h2{font-size:35px;max-width:25ch}#case .case-ownership{font-size:14px}#case .case-summary-result{grid-template-columns:auto 1fr;gap:16px;align-items:center}#case .case-summary-result strong{font-size:32px;white-space:nowrap}#case .case-summary-result>span{font-size:11px;max-width:28ch}#case .case-overview{grid-template-columns:1fr;gap:22px;padding-top:22px}#case .case-art>div{aspect-ratio:16/8}#case .case-art svg{max-width:480px}#case .case-facts{gap:18px}#case .case-facts dd{font-size:15px}#case .case-use{grid-template-columns:1fr;gap:6px;padding:16px;margin:22px 0;font-size:13px}#case .case-use>span{padding:0}#case .case-nav{gap:20px}#case .case-nav button{font-size:19px}}
@media(max-width:360px){#career .career-current h3{font-size:27px}#case .case-summary h2{font-size:32px}#case .case-summary-result strong{font-size:28px}}
@media(prefers-reduced-motion:reduce){#case[open] .case-bar,#case[open] .case-scroll{animation:none}}

#contact.s-talk{background:#fff;color:#202226;border-top:1px solid #e2e5e9}
#contact h2{color:#202226}
#contact .contact-copy>p{color:#697079}
#contact .contact-actions .btn-light{background:#202226;color:#fff;border:1px solid #202226}
#contact .contact-email{color:#414851;border-bottom-color:#cdd2d9}
#contact .contact-email:hover{color:#202226;border-bottom-color:#202226}
#contact .contact-actions>p{color:#818791}
.studio main+.site-foot{background:#fff;color:#818791;border-top-color:#e2e5e9}
.studio main+.site-foot a,.studio main+.site-foot button{color:#656b73}
@media(max-width:1000px){#work .library-grid{gap:32px 22px}#work .library-filters button{padding:8px 9px;font-size:11px}#work .library-toolbar{gap:12px}#work .library-card h3{font-size:25px}}
@media(max-width:860px){#work .library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#work .library-heading{align-items:start}#work .library-scale{margin-top:8px}#work .library-card h3{font-size:27px}}
@media(max-width:650px){#work.s-work,#career.s-career{padding-top:46px;padding-bottom:52px}#work .library-heading{display:block;margin-bottom:24px}#work .library-heading h2{font-size:46px}#work .library-heading>div>p{font-size:14px;max-width:36ch}#work .library-scale{margin-top:14px;font-size:11px}#work .library-toolbar{padding-top:16px;margin-bottom:24px}#work .library-filters{gap:5px}#work .library-filters button{font-size:11px;padding:9px 10px;min-height:40px}#work .library-grid{grid-template-columns:1fr;gap:30px}#work .library-card-meta{font-size:11px}#work .library-card h3{font-size:29px}#work .library-role{font-size:14px;max-width:42ch}#work .library-evidence{font-size:12px}#work .library-preview-arrow{opacity:1;transform:none}#career .proof-heading{display:block;margin-bottom:30px}#career .proof-heading h2{font-size:49px}}
@media(max-width:360px){#work .library-heading h2{font-size:42px}#work .library-card h3{font-size:27px}#work .library-filters button{padding:8px 9px}}
@media(prefers-reduced-motion:reduce){#work .library-filters button,#work .library-preview-arrow{transition:none}}

#work .library-count{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(min-width:1180px){#work .library-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 24px}#work .library-card h3{font-size:25px;min-height:2.26em}#work .library-card-meta{min-height:33px;margin-top:12px}#work .library-role{font-size:13px}}

/* Eight editorial covers, composed for recognition at thumbnail size. */
#work .work-art{isolation:isolate}
#work .cover-selected,#work .cover-pawn,#work .cover-knight,#work .cover-rook,#work .cover-web-frame,#work .cover-cursor,#work .cover-reply,#work .cover-brief-bubble,#work .cover-testimony,#work .cover-seal,#work .cover-input,#work .cover-engine,#work .cover-review,#work .cover-microphone,#work .cover-lens{transform-box:fill-box;transform-origin:center;transition:transform .55s cubic-bezier(.2,.8,.2,1)}
#work .cover-knight{transform-origin:center bottom}
#work .cover-seal{transform-origin:center}
#work .cover-route{stroke-dasharray:180;stroke-dashoffset:180;transition:stroke-dashoffset .7s cubic-bezier(.2,.8,.2,1)}
#work .cover-web-underline{stroke-dasharray:203;stroke-dashoffset:75;transition:stroke-dashoffset .55s}
#work .cover-web-button{transition:fill .4s}
#work .library-card:is(:hover,:focus-within) .cover-selected{transform:translateY(-14px)}
#work .library-card:is(:hover,:focus-within) .cover-knight{transform:translate(8px,-4px) rotate(-3deg)}
#work .library-card:is(:hover,:focus-within) .cover-pawn{transform:translateX(-3px)}
#work .library-card:is(:hover,:focus-within) .cover-rook{transform:translateX(3px)}
#work .library-card:is(:hover,:focus-within) .cover-web-frame{transform:rotate(-1deg)}
#work .library-card:is(:hover,:focus-within) .cover-cursor{transform:translate(-18px,-22px)}
#work .library-card:is(:hover,:focus-within) .cover-web-underline{stroke-dashoffset:0}
#work .library-card:is(:hover,:focus-within) .cover-web-button{fill:#f18a7d}
#work .library-card:is(:hover,:focus-within) .cover-reply{transform:translate(8px,-6px)}
#work .library-card:is(:hover,:focus-within) .cover-brief-bubble{transform:translate(-5px,4px)}
#work .library-card:is(:hover,:focus-within) .cover-testimony{transform:translateY(-5px)}
#work .library-card:is(:hover,:focus-within) .cover-seal{transform:rotate(-8deg)}
#work .library-card:is(:hover,:focus-within) .cover-engine{transform:translateY(-5px)}
#work .library-card:is(:hover,:focus-within) .cover-route{stroke-dashoffset:0}
#work .cover-audio{transform-box:fill-box;transform-origin:center}
#work .library-card:is(:hover,:focus-within) .cover-audio{animation:work-voice .7s ease-in-out 2}
#work .library-card:is(:hover,:focus-within) .cover-audio-1,#work .library-card:is(:hover,:focus-within) .cover-audio-3{animation-delay:.08s}
#work .library-card:is(:hover,:focus-within) .cover-audio-2{animation-delay:.16s}
#work .library-card:is(:hover,:focus-within) .cover-microphone{transform:translateY(-3px)}
#work .library-card:is(:hover,:focus-within) .cover-lens{transform:translate(-14px,-7px)}
#case .case-proof{margin:26px 0}
#case .case-proof img{display:block;width:100%;height:auto;border:1px solid #dce0e5}
#case .case-proof figcaption{font:400 12px/1.6 var(--sans);color:#737a84;margin-top:9px}
#case .case-proof a{color:inherit}
@keyframes work-voice{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.55)}}
@media(prefers-reduced-motion:reduce){#work .library-card .work-art *{transition:none!important;animation:none!important}}
