*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:#fafaf8;color:#171717;font-family:Arial,'Helvetica Neue','Noto Sans JP',sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--cmyk-magenta);outline-offset:6px}.skip{position:fixed;left:20px;top:-100px;background:white;padding:12px;z-index:20}.skip:focus{top:10px}header{height:100px;display:flex;justify-content:space-between;align-items:center;padding:0 4%;border-bottom:1px solid #d5d5d1}.logo{font-size:34px;font-weight:900;letter-spacing:-2px}.logo span{vertical-align:top;font-size:12px;margin:5px 0 0 5px;display:inline-block;letter-spacing:0}nav{display:flex;gap:36px;font-size:15px}nav a:hover{color:var(--cmyk-magenta-ink)}.hero{padding:42px 4% 65px}.eyebrow{font-size:12px;letter-spacing:.09em;line-height:1.6}.hero>.eyebrow{display:flex;justify-content:space-between}h1{font-size:clamp(70px,11.2vw,180px);line-height:.94;letter-spacing:-.065em;font-weight:600;margin:48px 0 48px}.outline{color:transparent;-webkit-text-stroke:1.5px #171717}.intro{display:grid;grid-template-columns:1fr 1fr 70px;align-items:end;gap:30px}.statement{font-size:24px;line-height:1.6;font-weight:600;margin:0}.description{font-size:15px;line-height:1.9;margin:0}.down{border:1px solid #999;border-radius:50%;height:58px;width:58px;display:grid;place-items:center;font-size:28px}.down:hover{background:#171717;color:#fff}.works{padding:0 4% 110px}.section-heading{display:flex;align-items:baseline;justify-content:space-between;border-top:1px solid #aaa;padding:25px 0 28px}h2{margin:0}.section-heading h2{font-size:22px;letter-spacing:-.035em}.section-heading h2 span{font-size:12px;font-weight:400;margin-left:24px;letter-spacing:0}.count{font-size:12px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:52px 24px}.card{min-width:0}.card .card-main{width:100%;padding:0;border:0;background:transparent;text-align:left;color:inherit;cursor:pointer}.visual{position:relative;overflow:hidden;background:#e9e9e6;aspect-ratio:1.33}.visual img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.2,.8,.2,1)}.card .card-main:hover img{transform:scale(1.035)}.view{position:absolute;right:20px;bottom:20px;border-radius:50%;background:#fafaf8;width:52px;height:52px;display:grid;place-items:center;font-size:25px;opacity:0;transform:translateY(10px);transition:.25s}.card .card-main:hover .view,.card .card-main:focus-visible .view{opacity:1;transform:none}.caption{display:flex;justify-content:space-between;gap:15px;padding-top:17px}.caption h3{margin:0;font-size:clamp(18px,1.7vw,26px);letter-spacing:-.02em;line-height:1.35}.caption p{font-size:12px;color:#555;margin:9px 0 0;line-height:1.5}.number{font-size:12px;padding-top:5px}.about{background:#1b1b1b;color:#f5f5f2;padding:90px 4%;display:grid;grid-template-columns:1fr 2fr;gap:50px}.about-content h2{font-size:clamp(27px,3.2vw,46px);line-height:1.55;letter-spacing:-.04em}.about-content>p{font-size:16px;line-height:2;max-width:620px;margin:30px 0 48px;color:#ccc}.services>div{display:grid;grid-template-columns:30px 1fr;column-gap:15px;padding:25px 0;border-top:1px solid #505050}.services span{font-size:12px;padding-top:5px}.services h3{font-size:26px;margin:0;font-weight:400;letter-spacing:-.02em}.services p{grid-column:2;margin:12px 0 0;font-size:13px;color:#aaa}.contact{padding:65px 4% 60px;background:var(--cmyk-yellow)}.contact h2{font-size:clamp(58px,9vw,130px);font-weight:500;line-height:.99;letter-spacing:-.06em;margin:40px 0}.contact-bottom{display:flex;justify-content:space-between;gap:24px;align-items:center}.contact-bottom p{font-size:15px}.contact-bottom a{font-size:24px;border-bottom:1px solid #171717;padding:12px 0}.contact-bottom a span{margin-left:45px}footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:40px 4%}footer p,footer>a:last-child{font-size:12px}dialog{width:min(1050px,94vw);max-height:92vh;padding:64px 30px 30px;border:0;background:#fafaf8}dialog::backdrop{background:#000b;backdrop-filter:blur(7px)}dialog>img{width:100%;max-height:60vh;object-fit:contain;background:white}.close{position:absolute;right:28px;top:18px;background:none;border:0;cursor:pointer;padding:5px;font-size:16px}.detail-copy{padding:28px 8px 10px}.detail-copy h2{font-size:32px;letter-spacing:-.03em;line-height:1.4}dl{display:grid;grid-template-columns:100px 1fr;gap:18px;font-size:14px;line-height:1.6;margin-top:25px}dt{font-size:12px}dd{margin:0}body:has(dialog[open]){overflow:hidden}@media(min-width:1600px){main,header,footer{max-width:1920px;margin:auto}}@media(max-width:700px){header{height:76px;padding:0 6%}.logo{font-size:27px}nav{gap:20px;font-size:14px}.hero{padding:30px 6% 45px}.hero>.eyebrow{font-size:10px;gap:20px}.hero>.eyebrow span:last-child{white-space:nowrap}h1{font-size:clamp(55px,12vw,90px);margin:40px 0;letter-spacing:-.065em;line-height:1}.intro{grid-template-columns:1fr 50px;gap:20px}.statement{font-size:21px}.description{grid-column:1;font-size:14px}.down{grid-row:1/3;grid-column:2;height:44px;width:44px}.desktop{display:none}.works{padding:0 6% 65px}.section-heading h2{font-size:20px}.section-heading h2 span{margin-left:15px;font-size:11px}.grid{grid-template-columns:1fr;gap:32px}.visual{aspect-ratio:1.28}.view{opacity:1;transform:none;width:38px;height:38px;right:12px;bottom:12px;font-size:20px}.caption h3{font-size:21px}.about{padding:50px 6%;display:block}.about-content{margin-top:28px}.about-content>p{font-size:15px}.services h3{font-size:23px}.contact{padding:40px 6%}.contact-bottom{display:block}.contact-bottom a{display:inline-block;font-size:22px}footer{padding:30px 6%;flex-wrap:wrap}footer .logo{width:100%}footer p,footer>a:last-child{font-size:11px}dialog{padding:58px 15px 20px}.detail-copy h2{font-size:25px}dl{grid-template-columns:75px 1fr;font-size:13px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.logo img{display:block;width:190px;height:auto}footer .logo img{width:170px}@media(max-width:700px){.logo img{width:138px}footer .logo img{width:150px}}

.offices{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:45px}.offices h3{font-size:12px;font-weight:400;letter-spacing:.08em}.offices p{font-size:13px;line-height:1.9;color:#aaa}.contact-bottom .phone{font-size:15px;border:0;padding:0}@media(max-width:700px){.hero>.eyebrow{flex-wrap:wrap;gap:8px}.offices{grid-template-columns:1fr;gap:12px}}

.projects{margin-top:52px}.projects>h3{font-weight:400;margin-bottom:20px;color:#aaa}.project-links{display:grid;grid-template-columns:1fr;gap:0}.project-links a{display:grid;grid-template-columns:1fr auto;gap:10px 20px;border-top:1px solid #505050;padding:22px 0;transition:color .2s}.project-links a>span:first-child{font-size:24px;letter-spacing:-.02em}.project-links a>span:nth-child(2){font-size:24px}.project-links small{grid-column:1/-1;font-size:14px;color:#bbb;line-height:1.6}.project-links a:hover{color:var(--cmyk-yellow)}.social-links{display:flex;flex-wrap:wrap;gap:20px;font-size:14px}.social-links a:hover{text-decoration:underline;text-underline-offset:5px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}footer{flex-wrap:wrap}@media(max-width:700px){.social-links{width:100%;gap:24px}.project-links a>span:first-child{font-size:22px}}

.company{padding:85px 4% 95px;display:grid;grid-template-columns:1fr 2fr;gap:50px}.company h2{font-size:32px;font-weight:500;margin-top:22px;letter-spacing:-.03em}.company-details{display:block;margin:0}.company-details>div{display:grid;grid-template-columns:125px minmax(0,1fr);gap:25px;border-top:1px solid #ccc;padding:23px 0}.company-details>div:last-child{border-bottom:1px solid #ccc}.company-details dt{font-size:14px;padding-top:3px;color:#555}.company-details dd{font-size:16px;line-height:1.9;overflow-wrap:anywhere}.company-en{display:block;color:#666;font-size:14px}.company-details ul{list-style:none;padding:0;margin:0}.company-details li+li{margin-top:8px}.company-details a{text-decoration:underline;text-underline-offset:5px}.company-details a:hover{color:#b5331c}.company-footer-link{font-size:14px}@media(max-width:700px){.company{padding:50px 6%;grid-template-columns:1fr;gap:30px}.company h2{font-size:27px;margin-top:15px}.company-details>div{grid-template-columns:80px minmax(0,1fr);gap:20px;padding:20px 0}.company-details dd{font-size:15px}}

.hero-ja{font-size:clamp(38px,6.8vw,110px);line-height:1.38;letter-spacing:-.065em;margin:34px 0 44px}.hero-ja .outline{-webkit-text-stroke:1.3px #171717}.statement-link{display:block;width:fit-content;margin-top:22px;font-size:14px;border-bottom:1px solid currentColor;padding-bottom:7px;line-height:1.6}.statement-link:hover{opacity:.7}.about-content>.statement-link{margin:0 0 45px}.statement-hero{padding:60px 6% 72px;border-bottom:1px solid #ccc}.statement-hero h1{font-size:clamp(34px,6.2vw,96px);line-height:1.45;letter-spacing:-.055em;margin:40px 0}.statement-lead{font-size:clamp(19px,2.4vw,32px);line-height:1.85;margin:0 0 20px}.statement-sub{font-size:16px;line-height:2}.statement-body{max-width:780px;margin:auto;padding:72px 30px 100px}.statement-body>p{font-size:17px;line-height:2.2;letter-spacing:.025em;margin:0 0 30px}.statement-body h2{font-size:clamp(23px,3vw,32px);line-height:1.6;letter-spacing:-.025em;margin:70px 0 32px}.statement-body .statement-quote{font-size:clamp(20px,3vw,30px);font-weight:600;line-height:1.75;margin:44px 0}.back-to-work{display:flex;justify-content:space-between;font-size:18px;border-top:1px solid #aaa;padding:28px 0;margin-top:65px}.statement-body+footer{border-top:1px solid #ccc}nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:6px}@media(max-width:700px){header{height:auto;min-height:90px;flex-wrap:wrap;gap:20px;padding-top:20px;padding-bottom:18px}header nav{gap:22px;width:100%;font-size:14px;justify-content:space-between}.hero-ja{font-size:clamp(27px,6.7vw,47px);margin:28px 0 34px;line-height:1.55;letter-spacing:-.055em}.hero .intro{grid-template-columns:minmax(0,1fr);gap:20px}.hero .intro .statement{font-size:17px}.hero .intro .description{font-size:14px}.hero .intro .down{display:none}.statement-hero{padding:32px 6% 42px}.statement-hero h1{font-size:clamp(27px,6.7vw,47px);line-height:1.55;margin:30px 0}.statement-sub{font-size:15px}.statement-body{padding:45px 6% 65px}.statement-body>p{font-size:16px;line-height:2.1}.statement-body h2{margin-top:50px}.statement-body .statement-quote{font-size:22px}}

/* Preserve every project image, including on hover and on small screens. */
.visual{aspect-ratio:3 / 2;background:transparent;overflow:hidden}
.visual img{width:100%;height:100%;object-fit:contain;object-position:center;transform:none;transition:none}
.card .card-main:hover img{transform:none}

.card .card-main{display:block}.work-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:16px;font-size:14px;color:#555}.work-detail{padding:4px 0;border:0;border-bottom:1px solid currentColor;background:transparent;color:inherit;cursor:pointer}.work-detail:hover{color:#171717}

/* A closed square opens into a word; the headline settles once, without looping. */
.elastic-copy .elastic-line{display:block;white-space:nowrap}
.opening-schema{display:inline-block;width:4.675em;height:1em;vertical-align:-.05em;position:relative;letter-spacing:-.065em}
.schema-word{position:absolute;left:0;top:50%;line-height:1;transform:translateY(-50%);white-space:nowrap}
.schema-block{position:absolute;inset:.1em 0;border:.045em solid currentColor;background:transparent;opacity:0;transform-origin:left center}
.stretch-dashes{display:inline-block;width:0;overflow:hidden;vertical-align:bottom;white-space:nowrap;letter-spacing:-.1em;transform-origin:left center}
.elastic-tail{display:inline-block;transform-origin:left center}
@media(prefers-reduced-motion:no-preference){
 .opening-schema{animation:schema-open 2.2s 1.95s both}
 .schema-block{animation:schema-unfold 2.2s 1.95s both}
 .schema-word{animation:schema-letters 2.2s 1.95s both}
 .stretch-dashes{animation:copy-stretch 2.2s 1.95s both}
 .elastic-tail{animation:copy-recoil 2.2s 1.95s both}
}
@keyframes schema-open{
 0%,22%{width:.82em;animation-timing-function:cubic-bezier(.65,0,.25,1)}
 53%{width:4.95em;animation-timing-function:cubic-bezier(.2,.8,.3,1)}
 68%{width:4.48em}82%{width:4.75em}100%{width:4.675em}
}
@keyframes schema-unfold{
 0%,22%{opacity:1;transform:scaleY(1)}
 47%{opacity:1;transform:scaleY(.7)}
 58%{opacity:0;transform:scaleY(.06)}100%{opacity:0;transform:scaleY(.06)}
}
@keyframes schema-letters{
 0%,44%{opacity:0;clip-path:inset(0 100% 0 0)}
 63%,100%{opacity:1;clip-path:inset(0 0 0 0)}
}
@keyframes copy-stretch{
 0%,22%{width:0;animation-timing-function:cubic-bezier(.65,0,.25,1)}
 53%{width:3.1em;animation-timing-function:cubic-bezier(.2,.8,.3,1)}
 68%{width:0}82%{width:.2em}100%{width:0}
}
@keyframes copy-recoil{
 0%,53%{transform:translateX(0)}68%{transform:translateX(-.12em)}
 82%{transform:translateX(.06em)}100%{transform:translateX(0)}
}
@media(max-width:700px){.hero-ja.elastic-copy{font-size:clamp(22px,6.7vw,47px)}}

@media(prefers-reduced-motion:no-preference){.type-glyph{display:inline-block;animation:copy-type .08s steps(1,end) var(--at) backwards}}
@keyframes copy-type{from{opacity:0}to{opacity:1}}

/* Quiet portfolio images, with color available to pointer and keyboard users. */
.visual img{filter:grayscale(1);transition:filter .35s ease}
.card:hover .visual img,.card:focus-within .visual img,.card:active .visual img{filter:grayscale(0)}
.work-pagination{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:55px;flex-wrap:wrap}
.work-pagination button{min-width:44px;height:44px;padding:0 12px;border:1px solid #ccc;background:transparent;color:inherit;font-size:15px;cursor:pointer;transition:background .2s,color .2s}
.work-pagination button[aria-current="page"],.work-pagination button:hover:not(:disabled){background:#171717;color:#fff;border-color:#171717}
.work-pagination button:disabled{opacity:.3;cursor:default}
@media(max-width:700px){.work-pagination{gap:6px;margin-top:36px}.work-pagination button{min-width:36px;height:44px;padding:0 9px}}

/* One generous click target per project. */
.work-filters{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 34px}
.work-filters button{min-height:46px;padding:10px 20px;border:1px solid #b6b6b0;background:transparent;color:#171717;font-size:15px;cursor:pointer}
.work-filters button[aria-pressed="true"]{background:#171717;color:white;border-color:#171717}
.work-filters button:hover{border-color:#171717}
.topic-tags{display:flex;flex-wrap:wrap;gap:6px 12px;margin-bottom:10px;font-size:13px;color:#64645e}
.topic-tags:empty{display:none}
.caption p{font-size:14px}
.detail-cta{display:flex;align-items:center;justify-content:space-between;min-height:52px;margin-top:20px;padding:12px 17px;border:1px solid #a7a7a1;font-size:14px;transition:color .25s,background .25s}
.detail-cta>span{font-size:22px;line-height:1}
.card-main:hover .detail-cta,.card-main:focus-visible .detail-cta{color:#fff;background:#171717;border-color:#171717}
.work-square{position:absolute;right:18px;bottom:18px;width:34px;height:34px;border:1px solid #171717;background:#fafaf8bb;transition:width .5s cubic-bezier(.2,.8,.2,1),height .5s cubic-bezier(.2,.8,.2,1),background .5s;pointer-events:none}
.card-main:hover .work-square,.card-main:focus-visible .work-square{width:calc(100% - 36px);height:calc(100% - 36px);background:transparent}
dialog{padding-top:76px;overscroll-behavior:contain}
.close{position:sticky;top:0;display:flex;align-items:center;justify-content:center;margin:-60px 0 20px auto;right:auto;min-width:110px;min-height:48px;border:1px solid #b6b6b0;background:#fafaf8;z-index:2}
.detail-copy h2{overflow-wrap:anywhere}
#detail-topics{font-size:14px;margin:0 0 18px;color:#666}
.detail-site{display:flex;align-items:center;justify-content:space-between;min-height:54px;padding:15px 22px;margin-top:28px;width:fit-content;min-width:240px;background:#171717;color:white;font-size:16px}
.detail-site:hover{background:#393939}
.detail-site[hidden],.work-pagination[hidden]{display:none}
.project-preview{position:fixed;inset:0;z-index:50;background:#fff;pointer-events:none;visibility:hidden;opacity:0;clip-path:inset(45% 45%);transition:clip-path .55s cubic-bezier(.2,.8,.2,1),opacity .2s,visibility .55s}
.project-preview.is-visible{visibility:visible;opacity:1;clip-path:inset(0)}
.project-preview img{width:100%;height:100%;object-fit:contain;display:block}
.project-preview span{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);padding:10px 16px;background:#171717;color:white;font-size:12px;letter-spacing:.06em;white-space:nowrap}
.office-section{padding:80px 4% 0}.office-section .section-heading{padding-bottom:24px}
.office-section figure{margin:0}.office-section img{display:block;width:100%;height:auto}
.office-section figcaption{display:flex;justify-content:space-between;gap:20px;margin-top:18px;font-size:14px;color:#555}
.company-details dd small{display:block;font-size:14px;color:#666}
@media(max-width:700px){.work-filters{gap:8px;margin-bottom:26px}.work-filters button{padding:10px 13px;font-size:14px}.office-section{padding:50px 6% 0}.office-section figcaption{font-size:13px}.detail-site{width:100%;min-width:0}.close{margin-top:-60px}.work-square{width:26px;height:26px}.detail-cta{margin-top:15px}}
@media(prefers-reduced-motion:reduce){.project-preview{display:none}.work-square{transition:none}}

/* Slowly changing frames sit behind the page, never over controls or images. */
body{isolation:isolate}
.schema-background{position:fixed;inset:0;overflow:hidden;z-index:-1;pointer-events:none}
.schema-background i{position:absolute;display:block;width:38vw;height:38vw;max-width:620px;max-height:620px;border:1px solid rgba(35,35,31,.11);background:rgba(50,50,40,.025);transform-origin:center}
.schema-background i:first-child{right:-10vw;top:14vh;animation:ambient-frame 24s ease-in-out infinite}
.schema-background i:last-child{left:-15vw;bottom:-12vw;width:30vw;height:30vw;animation:ambient-frame 31s ease-in-out -13s infinite reverse}
@keyframes ambient-frame{0%,100%{transform:translate(0,0) scale(1,1) rotate(0)}30%{transform:translate(-5vw,3vh) scale(.8,1.14) rotate(9deg)}64%{transform:translate(-1vw,-4vh) scale(1.16,.76) rotate(-5deg)}}
.motion-toggle{position:fixed;right:16px;bottom:16px;z-index:12;padding:10px 14px;min-height:44px;background:#fafaf8ed;color:#555;border:1px solid #c7c7c0;font-size:12px;cursor:pointer}
.motion-paused .schema-background i,.motion-paused .reading-diagram *{animation-play-state:paused!important}
.office-section{display:grid;grid-template-columns:minmax(180px,1fr) minmax(0,640px);gap:40px;align-items:start}
.office-section .section-heading{border-top:0;padding-top:0;display:block}
.office-section .section-heading h2 span{display:block;margin:12px 0 0;font-size:14px}
.office-section figure{max-width:640px;width:100%;justify-self:end}
.office-section img{clip-path:inset(4px 2px 2px 4px)}
.office-section figcaption{font-size:12px}
/* A true square aperture opens into each project, then closes to a square. */
.project-preview{clip-path:inset(calc(50% - 18px) calc(50% - 18px));transition:clip-path .7s cubic-bezier(.65,0,.2,1),opacity .3s,visibility .7s;background:#fafaf8}
.project-preview.is-visible{clip-path:inset(0);animation:project-square-open .85s cubic-bezier(.2,.75,.25,1) both}
@keyframes project-square-open{0%{clip-path:inset(calc(50% - 18px) calc(50% - 18px))}35%{clip-path:inset(calc(50% - 130px) calc(50% - 130px))}100%{clip-path:inset(0)}}
.awards{padding:70px 4% 0;display:grid;grid-template-columns:1fr 2fr;gap:50px}
.awards h2{font-size:24px;margin-top:16px}
.awards-list{border-top:1px solid #aaa}
.award-row{display:grid;grid-template-columns:80px 1fr 24px;gap:20px;padding:24px 0;border-bottom:1px solid #ccc}
.award-row time{font-size:14px;color:#666}.award-row strong{font-size:19px;font-weight:500;display:block;margin-bottom:10px}.award-row p{font-size:14px;line-height:1.8;margin:0;color:#555}.award-row:hover strong{text-decoration:underline;text-underline-offset:5px}
.statement-reading{max-width:1180px;display:grid;grid-template-columns:230px minmax(0,780px);gap:70px;margin:auto;padding:72px 35px 100px}
.statement-reading .statement-body{width:100%;padding:0;margin:0;max-width:none}
.statement-body section>p{font-size:17px;line-height:2.2;letter-spacing:.025em;margin:0 0 30px}
.statement-body section>.statement-quote{font-size:clamp(20px,3vw,30px);font-weight:600;line-height:1.75;margin:44px 0}
.reading-support{align-self:start;position:sticky;top:140px;padding:22px 0;pointer-events:none}
.reading-number{font-size:12px;color:#777;letter-spacing:.1em}
.reading-diagram{position:relative;width:220px;height:230px;margin:18px 0}
.reading-diagram span{position:absolute;left:40px;top:45px;width:140px;height:140px;border:1px solid #777;transition:transform 1.8s ease,opacity 1.8s,border-color 1.8s}
.reading-diagram .frame-one{animation:frame-breathe 12s ease-in-out infinite}
.reading-diagram .frame-two{transform:scale(.7);opacity:.2}
.reading-support[data-scene="balance"] .frame-one{transform:translate(-17px,-13px);animation:none}
.reading-support[data-scene="balance"] .frame-two{transform:translate(17px,13px);opacity:.65}
.reading-support[data-scene="open"] .frame-one{transform:translateX(-30px) rotate(-8deg);border-right-color:transparent;animation:none}
.reading-support[data-scene="open"] .frame-two{transform:translateX(30px) rotate(8deg);border-left-color:transparent;opacity:.65}
@keyframes frame-breathe{0%,100%{transform:scale(.88);opacity:.35}50%{transform:scale(1);opacity:.8}}
.reading-label{font-size:15px;letter-spacing:.03em;margin:0}
@media(max-width:900px){.statement-reading{grid-template-columns:160px minmax(0,1fr);gap:30px}.reading-diagram{width:160px;transform:scale(.75);transform-origin:left center}.awards{gap:30px}}
@media(max-width:700px){.schema-background i{width:70vw;height:70vw}.schema-background i:last-child{width:60vw;height:60vw;left:-40vw}.office-section{grid-template-columns:1fr;gap:18px}.office-section figure{max-width:480px}.office-section .section-heading{padding-bottom:0}.awards{padding:50px 6% 0;grid-template-columns:1fr;gap:25px}.award-row{grid-template-columns:55px 1fr 16px;gap:12px}.award-row strong{font-size:17px}.statement-reading{display:block;padding:40px 6% 65px}.reading-support{position:relative;top:auto;display:grid;grid-template-columns:90px 1fr;align-items:center;padding:0 0 28px}.reading-diagram{width:90px;height:90px;transform:none;margin:0;grid-column:1;grid-row:1/3}.reading-diagram span{width:56px;height:56px;left:17px;top:17px}.reading-support .reading-number,.reading-support .reading-label{grid-column:2}.reading-support .reading-number{align-self:end;margin:0 0 5px}.reading-support .reading-label{align-self:start}.statement-body section>p{font-size:16px;line-height:2.1}.motion-toggle{right:10px;bottom:10px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.schema-background i,.reading-diagram span{animation:none!important;transition:none!important}.project-preview{display:none}.motion-toggle{display:none}}

.award-names{list-style:none;padding:0;margin:0;border-top:1px solid #aaa}
.award-names li{padding:17px 0;border-bottom:1px solid #d5d5d1;display:flex;align-items:baseline;justify-content:space-between;gap:12px 24px;flex-wrap:wrap}
.award-names li>span{font-size:clamp(16px,1.45vw,21px);line-height:1.5;letter-spacing:-.015em}
.award-names small{font-size:13px;line-height:1.6;color:#666}
.award-ranking{margin:22px 0 0;font-size:14px;line-height:1.8;color:#555}.award-ranking span{font-size:12px;color:#777}
@media(max-width:700px){.award-names li{display:block;padding:16px 0}.award-names small{display:block;margin-top:5px}.award-ranking{font-size:13px}}
.award-names li{position:relative;isolation:isolate;padding:17px 34px 17px 12px;transition:background .45s ease}
.award-names li::after{content:'';position:absolute;right:7px;top:50%;width:12px;height:12px;transform:translateY(-50%);border:1px solid #999;pointer-events:none;z-index:-1;transition:width .5s cubic-bezier(.2,.8,.2,1),height .5s cubic-bezier(.2,.8,.2,1),border-color .4s}
.award-names li:hover{background:rgba(23,23,23,.025)}
.award-names li:hover::after{width:calc(100% - 14px);height:calc(100% - 10px);border-color:#555}
@media(prefers-reduced-motion:reduce){.award-names li::after{transition:none}}

.featured-awards{margin-bottom:32px;border-top:1px solid #aaa}
.featured-awards .award-row{position:relative;isolation:isolate;padding:24px 14px;grid-template-columns:64px minmax(0,1fr) 18px}
.featured-awards strong small{display:inline-block;font-size:12px;color:#777;font-weight:400;margin-left:8px}
.award-read{display:block;font-size:13px;margin-top:14px;color:#555}
.award-box{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:14px;height:14px;border:1px solid #999;pointer-events:none;z-index:-1;transition:width .5s cubic-bezier(.2,.8,.2,1),height .5s cubic-bezier(.2,.8,.2,1)}
.featured-awards .award-row:hover .award-box,.featured-awards .award-row:focus-visible .award-box{width:calc(100% - 20px);height:calc(100% - 12px)}
.profile-record{padding:0 4% 90px;display:grid;grid-template-columns:1fr 2fr;gap:50px}
.profile-record h2{font-size:30px;font-weight:500;margin:18px 0}.profile-role{font-size:14px;line-height:1.9;color:#555}
.profile-record h3{font-size:21px;font-weight:500;margin:0 0 16px}.profile-note{font-size:14px;color:#555;line-height:1.9;margin:0 0 28px;max-width:610px}
.engagement-list{display:block;margin:0}.engagement-list>div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:24px;padding:23px 0;border-top:1px solid #ccc}.engagement-list>div:last-child{border-bottom:1px solid #ccc}
.engagement-list dt{font-size:14px;color:#666}.engagement-list strong{font-size:16px;font-weight:500;line-height:1.7;display:block}.engagement-list dd>span{display:block;font-size:14px;color:#555;line-height:1.8;margin-top:8px}.engagement-list dd>p{font-size:13px;line-height:1.9;color:#666;margin:12px 0 0}
@media(max-width:700px){.profile-record{padding:0 6% 55px;grid-template-columns:1fr;gap:26px}.profile-record h2{font-size:27px}.engagement-list>div{grid-template-columns:1fr;gap:8px}.featured-awards .award-row{grid-template-columns:45px minmax(0,1fr) 8px;gap:12px}.featured-awards strong small{margin-left:0;display:block;margin-top:4px}}
@media(prefers-reduced-motion:reduce){.award-box{transition:none}}

/* MTG refinement: calm surfaces and natural Japanese text metrics. */
.hero{padding-top:48px;padding-bottom:64px}
.hero-ja.refined-copy{font-size:clamp(32px,7.4vw,116px);line-height:1.4;letter-spacing:0;font-feature-settings:"palt";margin:40px 0 48px;font-weight:600}
.refined-copy>span{display:block;white-space:nowrap;transform-origin:left center;animation:hero-unfold 1.8s cubic-bezier(.2,.7,.2,1) both}
.refined-copy>span:nth-child(2){animation-delay:.1s}
@keyframes hero-unfold{0%{clip-path:inset(0 100% 0 0);transform:scaleX(1)}45%{clip-path:inset(0);transform:scaleX(1)}68%{clip-path:inset(0);transform:scaleX(1.025)}100%{clip-path:inset(0);transform:scaleX(1)}}
.visual img,.card:hover .visual img,.card:focus-within .visual img{filter:none;transform:none!important}
.detail-cta{border:0;padding:10px 0;min-height:48px;margin-top:10px;width:fit-content;gap:28px}
.card-main:hover .detail-cta,.card-main:focus-visible .detail-cta{background:transparent;color:#171717;text-decoration:underline;text-underline-offset:5px}
.work-filters button{border:0;background:#efefeb}.work-filters button:hover{background:#e3e3dd}.work-filters button[aria-pressed="true"]{background:#171717}
.award-names,.featured-awards{border-top:0}.award-names li{border:0;padding:13px 0}.award-names li::after{content:none}.award-names li:hover{background:transparent}
.featured-awards .award-row{grid-template-columns:64px 1fr;padding:22px 0;border:0}.featured-awards{margin-bottom:24px}
.reading-diagram .frame-one{animation:none}
.member-link{display:inline-block;font-size:13px;margin-top:12px;padding:8px 0;text-decoration:underline;text-underline-offset:5px}
.member-intro{padding:64px 4% 72px}.member-intro h1{font-size:clamp(34px,5vw,72px);line-height:1.4;letter-spacing:0;margin:24px 0}.member-intro>p:last-child{font-size:15px;line-height:1.8;color:#666}
.member-president{padding:0 4% 70px}.member-president h2{font-size:30px;font-weight:500;margin:18px 0}.member-president>p:last-child{font-size:14px;color:#555}
.member-back{display:block;width:fit-content;margin:0 4% 70px;padding:12px 0}.member-back:hover{text-decoration:underline}
@media(max-width:700px){.hero{padding-top:30px;padding-bottom:44px}.hero-ja.refined-copy{font-size:clamp(26px,7.8vw,52px);line-height:1.5;margin:30px 0 36px}.featured-awards .award-row{grid-template-columns:45px 1fr}.member-intro{padding:40px 6%}.member-president{padding:0 6% 45px}.member-back{margin:0 6% 45px}}
@media(prefers-reduced-motion:reduce){.refined-copy>span{animation:none}}

/* Restored elastic headline: native baseline, measured brackets, no glyph tracking. */
.refined-copy>span{animation:none;transform:none}
.hero-square-word{display:inline-block;position:relative;vertical-align:baseline;white-space:nowrap}
.hero-word{display:inline-block;white-space:nowrap}
.hero-square{position:absolute;left:0;right:0;top:.275em;height:.85em;border:.04em solid currentColor;pointer-events:none}
.hero-dash{display:inline-block;width:0;overflow:hidden;white-space:nowrap;vertical-align:bottom;letter-spacing:0}

/* A single quiet frame around the image, without a corner badge. */
.visual::after{content:"";position:absolute;inset:0;border:1px solid #555;pointer-events:none;opacity:0;transition:opacity .22s ease}
@media(hover:hover){.card-main:hover .visual::after{opacity:1}}
.card-main:focus-visible .visual::after{opacity:1}

/* A quick clockwise trace, four short strokes, no expanding frame. */
.visual::after{border:0;background-image:linear-gradient(#444,#444),linear-gradient(#444,#444),linear-gradient(#444,#444),linear-gradient(#444,#444);background-repeat:no-repeat;background-position:left top,right top,right bottom,left bottom;background-size:0 1px,1px 0,0 1px,1px 0;transition:opacity .12s}
@keyframes work-frame-trace{0%{background-size:0 1px,1px 0,0 1px,1px 0}25%{background-size:100% 1px,1px 0,0 1px,1px 0}50%{background-size:100% 1px,1px 100%,0 1px,1px 0}75%{background-size:100% 1px,1px 100%,100% 1px,1px 0}100%{background-size:100% 1px,1px 100%,100% 1px,1px 100%}}
@media(hover:hover){.card-main:hover .visual::after{animation:work-frame-trace .44s linear both}}
.card-main:focus-visible .visual::after{animation:work-frame-trace .44s linear both}
@media(prefers-reduced-motion:reduce){.visual::after{animation:none!important;background-size:100% 1px,1px 100%,100% 1px,1px 100%}}

/* Photo-led thumbnails, a quiet office carousel, and scroll-revealed navigation. */
.hero-square{border-width:.07em}
.home-header{position:sticky;top:0;z-index:20;background:#fafaf8}
.scroll-menu .home-header nav{opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .25s,transform .25s,visibility .25s}
.scroll-menu.menu-visible .home-header nav{opacity:1;visibility:visible;transform:none}
.visual{display:grid;place-items:center}
.thumbnail-screen{width:100%;aspect-ratio:1.76;background-size:102.5% auto;background-repeat:no-repeat;background-position:center 25%}
.office-slides{position:relative;aspect-ratio:1130 / 760;overflow:hidden}
.office-section .office-slide{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;clip-path:none;opacity:0;transition:opacity .75s ease}
.office-section .office-slide.is-active{opacity:1}
.office-controls{display:flex;align-items:center;gap:12px;margin-top:14px;color:#555}
.office-controls button{min-width:44px;min-height:44px;padding:8px;border:0;background:transparent;color:inherit;cursor:pointer}
.office-controls button:hover{color:#171717;background:#efefeb}.office-count{font-size:12px;font-variant-numeric:tabular-nums;letter-spacing:.08em}.office-controls .office-play{font-size:12px;margin-left:auto;padding:8px 12px}
@media(prefers-reduced-motion:reduce){.office-section .office-slide,.scroll-menu .home-header nav{transition:none;transform:none}}

/* Mobile navigation emerges below the logo without reserving an empty row. */
@media(max-width:700px){
 html{scroll-padding-top:140px}
 .scroll-menu .home-header{height:72px;min-height:72px;padding:0 6%;gap:0;flex-wrap:nowrap}
 .scroll-menu .home-header nav{position:absolute;top:100%;left:0;width:100%;margin:0;padding:6px 6%;gap:12px;background:#fafaf8;border-bottom:1px solid #d5d5d1;opacity:0;visibility:hidden;clip-path:inset(0 0 100% 0);transform:translateY(-10px);transition:clip-path .24s cubic-bezier(.2,.7,.2,1),transform .24s cubic-bezier(.2,.7,.2,1),opacity .18s,visibility .24s}
 .scroll-menu .home-header nav a{display:flex;align-items:center;min-height:44px}
 .scroll-menu.menu-visible .home-header nav{opacity:1;visibility:visible;clip-path:inset(0);transform:translateY(0)}
}
@media(max-width:700px) and (prefers-reduced-motion:reduce){.scroll-menu .home-header nav{transition:none;transform:none}}

/* Keep portrait artwork inside the same gallery frame as landscape artwork. */
.visual{display:block}
.visual img{position:absolute;inset:0;width:100%;height:100%;min-height:0;min-width:0;object-fit:contain}
.thumbnail-screen{position:absolute;left:0;top:50%;transform:translateY(-50%)}

.detail-case{display:flex;align-items:center;min-height:54px;padding:14px 0;margin-top:24px;font-size:16px;text-decoration:underline;text-underline-offset:7px}
.case-page main{max-width:1440px;margin:auto}.case-intro{max-width:1180px;padding:56px 6% 44px;margin:auto}.case-back{display:inline-block;padding:12px 0;margin-bottom:32px;font-size:14px}.case-intro h1{font-size:clamp(30px,4.5vw,66px);line-height:1.45;letter-spacing:-.02em;margin:24px 0;overflow-wrap:anywhere}.case-lead{max-width:800px;font-size:19px;line-height:1.95;margin:0 0 36px}.case-meta{display:block;margin:0}.case-meta>div{display:grid;grid-template-columns:100px minmax(0,1fr);gap:25px;margin-top:18px}.case-meta dd{font-size:15px;line-height:1.9}.case-meta dt{font-size:12px;padding-top:5px;color:#666}.case-site{display:inline-block;font-size:15px;padding:14px 0;margin-top:24px;border-bottom:1px solid #777}.case-visual{margin:0;padding:0 4%}.case-visual img{display:block;width:100%;max-height:800px;object-fit:contain}.case-story{max-width:1180px;margin:65px auto 0;padding:0 6%}.case-chapter{display:grid;grid-template-columns:1fr 1.6fr;gap:48px;padding:48px 0;border-top:1px solid #d5d5d1}.case-chapter h2{font-size:clamp(24px,2.4vw,32px);font-weight:500;margin:15px 0 0}.case-chapter p{font-size:17px;line-height:2.1;margin:0}.case-chapter p+p{margin-top:1.2em}.case-end{max-width:1180px;margin:35px auto 65px;padding:0 6%;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;font-size:15px}.case-end a{padding:14px 0}.case-end a:hover,.case-back:hover{text-decoration:underline;text-underline-offset:5px}
@media(max-width:700px){.case-intro{padding:30px 6%}.case-back{margin-bottom:20px}.case-lead{font-size:16px}.case-meta>div{grid-template-columns:70px 1fr;gap:16px}.case-visual{padding:0 6%}.case-story{margin-top:35px}.case-chapter{grid-template-columns:1fr;gap:22px;padding:32px 0}.case-chapter p{font-size:16px}.case-end{display:block;margin:20px auto 40px}.case-end a{display:block}}
.case-visual img{height:auto}

/* Four deliberate lines on phones; desktop keeps its two-line lockup. */
.hero-mobile-break{display:none}
@media(max-width:700px){.hero-mobile-break{display:block}.hero-ja.refined-copy{font-size:clamp(36px,12.2vw,74px);line-height:1.38;margin:32px 0 40px}.hero>.eyebrow{font-size:10px}}

/* Direct case-study navigation, with quiet category and related-work links. */
.card .card-main{display:block}
a:focus-visible,button:focus-visible{outline-color:#171717}
.case-explore{padding:40px 6% 60px;max-width:1440px;margin:auto}
.case-explore>h2,.case-related>h2{font-size:22px;margin:0 0 24px}
.case-categories{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:36px}
.case-categories a{padding:12px 16px;background:#eeeee9;font-size:14px}
.case-sequence{display:grid;grid-template-columns:1fr 1fr;gap:32px;border-top:1px solid #ccc;padding-top:24px;margin-bottom:60px}
.case-sequence a{display:flex;flex-direction:column;gap:12px;min-width:0}
.case-sequence span,.case-related a>span{font-size:12px;color:#666}
.case-sequence strong{font-size:20px;line-height:1.6}
.case-related>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.case-related img{display:block;width:100%;aspect-ratio:3/2;object-fit:contain;background:#f1f1ee;margin-bottom:14px}
.case-related h3{font-size:18px;line-height:1.6;margin:8px 0 0}
.case-explore a:hover{text-decoration:underline;text-underline-offset:4px}
@media(max-width:700px){.case-sequence{gap:20px}.case-sequence strong{font-size:16px}.case-related>div{grid-template-columns:1fr}.case-related a{margin-bottom:12px}}

.case-visual figcaption{font-size:12px;color:#666;margin-top:12px;line-height:1.8}

/* One canvas, two density options, and a restrained lift on hover. */
.grid .visual{aspect-ratio:3/2;background:#fff;transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s ease}
.grid .visual::after{display:none!important;animation:none!important}
.grid .card-main{outline-offset:5px}
@media(hover:hover){.grid .card-main:hover .visual{transform:translateY(-5px);box-shadow:0 12px 25px -18px #17171766}.grid .card-main:hover .detail-cta span{transform:translateX(5px)}}
.detail-cta span{display:inline-block;transition:transform .3s ease}
.work-layout{display:flex;align-items:center;justify-content:flex-end;gap:6px;margin:0 0 16px;font-size:13px}
.work-layout>span{margin-right:8px;color:#666}
.work-layout button{border:0;background:#eeeee9;color:#171717;min-height:44px;padding:10px 18px;cursor:pointer}
.work-layout button[aria-pressed="true"]{background:#171717;color:white}
.grid[data-columns="4"]{grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 20px}
.grid[data-columns="4"] h3{font-size:17px;line-height:1.5}
.grid[data-columns="4"] .caption{gap:8px}
.grid[data-columns="4"] .topic-tags{font-size:10px}
.grid[data-columns="4"] .detail-cta{font-size:12px}
.press-section{padding:0 4% 90px}
.press-section .section-heading>a{font-size:13px}
.press-list article{display:grid;grid-template-columns:130px 1fr;gap:24px;padding:26px 0;border-bottom:1px solid #ddd}
.press-list time{font-size:13px;color:#666;padding-top:5px}
.press-list h3{font-size:20px;line-height:1.6;margin:0 0 10px}
.press-list p{font-size:12px;color:#666}.press-list article div>a{font-size:13px}.press-section a:hover{text-decoration:underline;text-underline-offset:4px}
.team-members{padding:40px 6% 70px}.team-members>h2{font-size:28px;margin:15px 0 30px}.team-members>div{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.team-members article{padding:24px 0;border-top:1px solid #ccc}.team-members h3{font-size:24px;line-height:1.5;margin:0 0 16px}.team-members p,.team-members a{font-size:14px;line-height:1.8}
@media(max-width:1000px){.grid[data-columns="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.grid[data-columns]{grid-template-columns:1fr}.work-layout{display:none}.press-section{padding:0 6% 60px}.press-section .section-heading{display:block}.press-section .section-heading>a{display:inline-block;margin-top:16px}.press-list article{grid-template-columns:1fr;gap:12px}.press-list h3{font-size:18px}.team-members>div{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.grid .card-main:hover .visual{transform:none;box-shadow:none}.grid .card-main:hover .detail-cta span{transform:none}}

/* Shared screen palette: cyan, magenta, yellow, key. */
:root{--cmyk-cyan:#b2d5fc;--cmyk-magenta:#ffb5e2;--cmyk-yellow:#eeff84;--cmyk-key:#171717;--cmyk-cyan-ink:#275d90;--cmyk-magenta-ink:#a32b73;--cmyk-yellow-ink:#586600;--link-hover:#eeeee9}
.statement-link,.member-link,.case-back,.case-end a,.back-to-work,.press-heading>a,.address-link{transition:background-color .22s ease,color .22s ease;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.statement-link:hover,.member-link:hover,.case-back:hover,.case-end a:hover,.back-to-work:hover,.press-heading>a:hover,.address-link:hover{background:var(--link-hover);color:var(--cmyk-key);opacity:1}
.address-link{display:inline-block;line-height:1.8}

/* Read the introduction from top to bottom, on the same left edge. */
.home-page .hero .intro{display:grid;grid-template-columns:minmax(0,1fr) 70px;gap:30px;align-items:end}
.home-page .hero .statement{grid-column:1;grid-row:1}
.home-page .hero .description{grid-column:1;grid-row:2;max-width:760px;margin-top:0}
.home-page .hero .down{grid-column:2;grid-row:2}
.home-page .hero .statement-link{margin-top:28px}
.home-page .hero{padding-bottom:65px}
.scroll-menu .home-header{border-bottom-color:transparent;transition:border-color .28s ease}
.scroll-menu.menu-visible .home-header{border-bottom-color:#d5d5d1}
.scroll-menu .home-header .logo img{width:210px;transform:scale(.84);transform-origin:left center;transition:transform .35s cubic-bezier(.22,.8,.2,1)}
.scroll-menu.menu-visible .home-header .logo img{transform:scale(1)}
.grid .card{transform-origin:top left}
.work-layout button{display:grid;place-items:center;width:48px;padding:10px}
.work-layout button svg{display:block}
@media(max-width:700px){
 .scroll-menu .home-header .logo img{width:165px;transform:scale(.86)}
 .home-page .hero .intro{grid-template-columns:minmax(0,1fr);gap:24px}
 .home-page .hero .description{grid-column:1;grid-row:2}
 .home-page .hero .down{display:none}
 .home-page .hero{padding-bottom:44px}
 .scroll-menu.menu-visible .home-header{border-bottom-color:transparent}
}

.grid .visual{display:block}




/* Project imagery first, followed by context, role and the three design chapters. */
.case-page main{max-width:1600px}
.case-intro{max-width:1300px;padding:38px 5% 32px}
.case-intro .case-back{margin-bottom:20px}
.case-intro h1{font-size:clamp(25px,3vw,44px);line-height:1.5;margin:16px 0 0}
.case-gallery{max-width:1300px;margin:auto;padding:0 5%;display:grid;gap:36px}
.case-gallery .case-visual{padding:0;margin:0}
.case-gallery .case-visual img{width:100%;height:auto;max-height:none;background:white;object-fit:contain}
.case-overview{max-width:1300px;margin:64px auto 0;padding:0 5%;display:grid;grid-template-columns:1fr 1.2fr;gap:64px}
.case-summary{font-size:18px;line-height:2;margin:0}
.case-overview .case-site{margin-right:24px}
.case-story{max-width:1300px;padding:0 5%;margin-top:60px}
.case-chapter{border-top:0;padding:28px 0 42px}
.case-chapter h2{font-weight:700;font-size:26px}
.case-chapter p{line-height:2.1}
@media(max-width:700px){.case-intro{padding:26px 6%}.case-gallery{padding:0 6%;gap:20px}.case-overview{grid-template-columns:1fr;gap:32px;padding:0 6%;margin-top:36px}.case-summary{font-size:16px}.case-story{margin-top:35px;padding:0 6%}.case-chapter{padding:22px 0 30px}}

/* Pale CMY belongs on surfaces; saturated companions belong on text. */
::selection{background:var(--cmyk-cyan);color:var(--cmyk-key)}
.contact{background:var(--cmyk-yellow);color:var(--cmyk-key)}
.contact-bottom a:hover{color:var(--cmyk-yellow-ink)}
.case-site:hover{color:var(--cmyk-cyan-ink)}
.case-categories a:hover{background:var(--cmyk-cyan);color:var(--cmyk-key)}

/* Hover: wide page-colored bands cut across the work image, drifting slowly (logo hatch direction, steeper). */
.grid .visual{container-type:inline-size}
.grid .visual::before{content:"";position:absolute;top:0;bottom:0;left:-20cqw;right:-20cqw;z-index:1;pointer-events:none;opacity:0;transition:opacity .3s ease;background:repeating-linear-gradient(60deg,#fafaf8 0 6.5cqw,transparent 6.5cqw 15cqw)}
.grid .card-main:hover .visual::before,.grid .card-main:focus-visible .visual::before{opacity:1;animation:work-hatch-drift 2.4s linear infinite}
@keyframes work-hatch-drift{from{transform:translateX(0)}to{transform:translateX(17.3205cqw)}}
@media (prefers-reduced-motion:reduce){.grid .card-main:hover .visual::before,.grid .card-main:focus-visible .visual::before{animation:none}}

/* Work cards: no index number, no underline on the CTA; the arrow nudges right on hover. */
.card-main:hover .detail-cta,.card-main:focus-visible .detail-cta{text-decoration:none}
.grid .card-main:hover .detail-cta span,.grid .card-main:focus-visible .detail-cta span{transform:translateX(6px)}