/* Shared UI refinement, 4 November 2026. */
h1,h2,h3,.intro-copy h1,.paper-face h2,.paper-face h3,.screen-face .slide-txt h2,.reference-intro h1,.project-intro h1,.card-copy h2,.project-story h2,.project-story h3{font-family:'Fira Code',monospace!important;font-weight:400!important}
.masthead,.reference-header,.text-mode .masthead{background:linear-gradient(#8888882b,#fff0)}
.masthead #main-menu{position:relative;isolation:isolate}.masthead #main-menu>a,.masthead #main-menu>.nav-group>a{position:relative;z-index:1;background:transparent!important;color:#17211d!important}.masthead #main-menu>a.indicator-target,.masthead #main-menu>.nav-group>a.indicator-target{color:#fff!important}
.menu-indicator{position:absolute;left:0;top:0;z-index:0;pointer-events:none;border-radius:30px;background:#101713;transition:transform .32s cubic-bezier(.2,.8,.2,1),width .32s cubic-bezier(.2,.8,.2,1),height .32s;will-change:transform}
.masthead .nav-submenu{display:block;top:calc(100% + 5px);left:0;min-width:205px;border-radius:0 0 18px 18px;background:#fffdf4;overflow:hidden;max-height:0;padding:0 8px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:max-height .28s ease,opacity .2s,transform .28s,visibility .28s;box-shadow:0 9px 16px #0001}.nav-group:before{content:'';position:absolute;left:0;right:0;top:100%;height:10px}.masthead .nav-group:hover .nav-submenu,.masthead .nav-group:focus-within .nav-submenu{max-height:145px;padding:8px;opacity:1;visibility:visible;transform:translateY(0)}.masthead .nav-submenu a{font-size:12px!important;min-height:38px}.masthead .nav-submenu a:hover,.masthead .nav-submenu a[aria-current]{background:#101713!important;color:#fff!important}
.project-cta{position:relative;border:0!important;border-radius:28px 28px 28px 7px!important;overflow:visible}.project-cta svg{display:none!important}.project-cta:after{content:'';position:absolute;left:0;bottom:-7px;border-top:13px solid #f7f8f3;border-right:13px solid transparent;transform:rotate(8deg);transform-origin:top left}.project-cta:hover{background:#eaf2ff}.project-cta:hover:after{border-top-color:#eaf2ff}
.button,.paper-body .button,.project-view-link,.screen-face .project-view-link,.all-projects-link,.mini-nav a,.hotspot,.hotspot.secondary,.paper-reading-button,.reference-filters button,.all-references,.view-tools button{font:400 11px/1.5 'Open Sans',sans-serif!important;border:0!important;background-color:#ececea!important;color:#363b38;border-radius:25px;padding:10px 15px}.button:hover,.paper-body .button:hover,.project-view-link:hover,.screen-face .project-view-link:hover,.all-projects-link:hover,.mini-nav a:hover,.hotspot:hover,.paper-reading-button:hover,.reference-filters button:hover,.all-references:hover,.view-tools button:hover{color:#000!important;background-color:#e3e3e0!important}.reference-filters button[aria-pressed=true]{background:#111!important;color:#fff!important}
.term-tag,.screen-face .term-tag:before,.chat .term-tag:before{animation:none!important;opacity:1}.screen-face .term-dot{animation:blink-dot 1.2s infinite!important}.screen-face .term-reset{display:inline-flex;align-items:center;gap:6px;font-size:11px!important;line-height:1.4;min-height:30px;color:#555}.term-reset:before{content:'';display:inline-block;width:14px;height:14px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M16 8A6.3 6.3 0 1 0 16 13M16 3v5h-5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}.chat-proof,.chat-proof span{font:400 11px/1.5 'Fira Code',monospace;color:#555}
.reel-arrows{bottom:22px;right:35px}.reel-arrows button{display:grid;place-items:center;padding:0;width:30px;height:30px;border:0;border-radius:50%;background:#ececea;color:#111}.reel-arrows svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.reel-progress{position:absolute;bottom:13px;left:40px;right:40px;height:3px;border-radius:5px;background:#d9ddd9;overflow:hidden}.reel-progress>span{display:block;width:100%;height:100%;background:#4488a5;transform-origin:0 50%;will-change:transform}.screen-face .reference-screen .slide{padding-bottom:75px;animation:reference-appear .45s ease}@keyframes reference-appear{from{opacity:.35}to{opacity:1}}
.intro-illustration{display:none}.text-mode .intro-copy{scroll-margin-top:125px;padding:40px;position:relative}.text-mode .intro-copy>.intro-illustration{display:block;position:absolute;right:25px;top:25px;width:30%;height:auto;opacity:.1;pointer-events:none}.text-mode .intro-copy>*:not(.intro-illustration){width:66%;max-width:66%}.text-mode #paper-content>section{scroll-margin-top:125px}.text-mode .view-tools{right:4vw;bottom:85px}
.paper-body>.mini-nav:last-child{justify-content:center!important;gap:10px!important}.paper-body>.mini-nav:last-child a{display:inline-flex;align-items:center;gap:5px;font:400 11px/1.5 'Open Sans',sans-serif!important;border:0!important;background:#ececea;border-radius:25px;padding:9px 15px!important}.home-arrow{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1;stroke-linecap:round;stroke-linejoin:round}
.all-projects-link,.reading-references>.button{font-size:11px!important;border:0;background:#ececea!important;color:#000!important;border-radius:25px!important}
.studio-timeline{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px;margin:30px 0 45px;padding:0;list-style:none}.studio-timeline:before{content:'';position:absolute;left:6px;right:6px;top:10px;border-top:1px solid #849da6}.studio-timeline li{position:relative;border:0;padding:30px 0 0;min-width:0}.studio-timeline li:before{content:'';position:absolute;left:0;top:6px;width:8px;height:8px;border-radius:50%;background:#faf6ed;border:1px solid #849da6}.studio-timeline b{font:400 13px 'Fira Code',monospace;margin:0 0 12px;display:block}.studio-timeline span{font-size:12px;line-height:1.5;display:block}
.studio-photos{display:grid;grid-template-columns:2fr 1fr 1fr;gap:18px;align-items:center}.studio-photos img{width:100%;height:230px;object-fit:cover}.studio-photos .studio-beaver{height:200px;object-fit:contain;margin:0}
#kontakt h2{white-space:normal}#kontakt .contact-links{font-size:15px;line-height:1.65;margin:20px 0}#kontakt .contact-links a{font-size:15px}#kontakt .contact-address{font-size:15px;margin-bottom:2px}#kontakt .map-link{display:inline-block;font-size:15px;margin:0 0 18px;border:0;text-decoration:underline;text-underline-offset:3px}
@media(max-width:760px){.masthead #main-menu{position:fixed;isolation:auto}.menu-indicator{display:none}.masthead #main-menu>a[aria-current],.masthead #main-menu>.nav-group>a[aria-current]{color:#fff!important;background:#101713!important}.masthead #main-menu>a.indicator-target:not([aria-current]),.masthead #main-menu>.nav-group>a.indicator-target:not([aria-current]){color:#17211d!important}.masthead .nav-submenu{position:static;max-height:none;overflow:visible;padding:0 0 0 14px;opacity:1;visibility:visible;transform:none;box-shadow:none;border-radius:0;background:none}.masthead .nav-group:hover .nav-submenu,.masthead .nav-group:focus-within .nav-submenu{max-height:none;padding:0 0 0 14px}.nav-group:before{display:none}.masthead .project-cta,.reference-header .project-cta{font-size:11px!important;padding:10px 12px;white-space:normal;max-width:115px}.project-cta:after{bottom:-5px}.masthead{gap:10px;padding-left:18px;padding-right:18px}.moto-logo{width:105px}.text-mode .intro-copy{padding:25px}.text-mode .intro-copy>*:not(.intro-illustration){width:66%;max-width:66%}.text-mode .intro-copy h1{font-size:26px}.text-mode .intro-copy>.intro-illustration{right:15px;top:25px;width:30%}.text-mode .view-tools{bottom:85px}.studio-timeline{grid-template-columns:repeat(6,130px);overflow-x:auto;padding-bottom:12px}.studio-timeline:before{width:880px;right:auto}.studio-photos{grid-template-columns:2fr 1fr 1fr;gap:8px}.studio-photos img{height:110px}.studio-photos .studio-beaver{height:100px}.paper-body>.mini-nav:last-child{gap:6px!important}.paper-body>.mini-nav:last-child a{padding:8px 10px!important;white-space:nowrap}.reel-progress{left:20px;right:20px;bottom:10px}.reel-arrows{bottom:23px;right:20px}.paper-reading-button{border-radius:2px}}
@media(prefers-reduced-motion:reduce){.menu-indicator,.nav-submenu{transition:none!important}.screen-face .term-dot{animation:none!important}}
.screen-face .chat .chip,.btn{font:400 11px/1.5 'Open Sans',sans-serif!important;border:0!important;background:#ececea!important;color:#363b38!important;padding:10px 15px;border-radius:25px}.screen-face .chat .chip:hover,.btn:hover{color:#000!important;background:#e3e3e0!important}.text-mode #chat .chat-proof{padding-left:0}
@media(max-width:760px){.text-mode .intro-copy>*:not(.intro-illustration){width:100%;max-width:100%}.text-mode .intro-copy>.intro-illustration{width:40%}.studio-timeline{overscroll-behavior-x:contain}}
@media(max-width:760px){.masthead #main-menu{background:#faf8ef url('./textures/paper-grain.png')!important}}
/* Refinements and supplied artwork, 5 November 2026. */
.screen-face .chat button.chip{min-height:34px!important;padding:8px 14px}.screen-face .chat-proof,.text-mode .chat-proof{font-size:11px!important}.screen-face .chat .msg-system,.screen-face .chat .msg-system .msg-txt{color:#009fe3!important}.screen-face .chat .term-reset:hover{color:#009fe3!important}
.menu-indicator{background:#151a1c}.masthead .nav-submenu a:hover,.masthead .nav-submenu a[aria-current]{background:#151a1c!important}.masthead .project-cta:hover,.reference-header .project-cta:hover{background:#151a1c!important;color:#fff!important}.masthead .project-cta:hover:after,.reference-header .project-cta:hover:after{border-top-color:#151a1c}
.paper-reading-button{border-radius:2px!important;padding:15px 20px}.intro-copy .intro-actions>a{font:400 12px/1.5 'Open Sans',sans-serif!important;border:1px solid #151a1c!important;background-color:transparent!important;color:#363b38!important;border-radius:25px!important;padding:10px 14px!important;display:inline-flex;align-items:center;justify-content:center;gap:10px}.intro-copy .intro-actions>a:hover{color:#000!important;background-color:transparent!important}.intro-actions{margin-top:40px;margin-bottom:30px}.travel-status{background:transparent!important;box-shadow:none!important;border:0}
.text-mode .intro-copy>.intro-illustration{mix-blend-mode:multiply;opacity:.8}.text-mode .view-tools #back-desk{display:inline-flex;align-items:center;gap:7px}.text-mode #back-desk:before{content:'';width:18px;height:18px;display:block;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 13h18M5 13v8m14-8v8M8 5h8v6H8zM12 11v2' fill='none' stroke='black' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}.text-mode #chat .chat{border:1px solid #cbcbcb;margin:40px 15px;border-radius:25px;width:calc(100% - 30px);padding:30px}.text-mode #chat .chat-proof{margin:0 15px 30px;border:0;background:transparent;padding:0}
.service-icon img{width:100%;height:100%;object-fit:contain;display:block}.service-icon.icon-0,.service-icon.icon-2{background:transparent;padding:0}.service-icon.icon-0{width:64px;height:72px}.service-icon.icon-2{width:72px;height:72px}.service-four .service .paper-link,.note-strip>a{font:400 11px/1.5 'Open Sans',sans-serif;border:0!important;background:#ececea;border-radius:25px;padding:9px 15px;display:inline-flex;align-items:center;align-self:flex-start;color:#363b38;white-space:normal;text-decoration:none}.service-four .service .paper-link:hover,.note-strip>a:hover{color:#000}.paper-body>.mini-nav:last-child a,.device-page-nav a{border:1px solid #363b38!important;background:transparent!important}
#arbeitsweise .paper-body{position:relative}#arbeitsweise .workflow-illustration{position:absolute;right:45px;top:62px;width:27%;height:auto;max-height:280px;object-fit:contain;mix-blend-mode:multiply;opacity:.8;pointer-events:none}#arbeitsweise .paper-body>h2,#arbeitsweise .paper-body>.lead{width:66%;max-width:66%}
.agency-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:25px}.agency-actions .button{font-size:12px!important;background-color:#ececea!important}
.team-cards h3{margin:15px 0 0!important}.team-cards h3+p{font-size:12px!important}.team-cards a{font-size:14px!important}.studio-photos .studio-beaver{height:260px;max-height:100%;width:100%;object-fit:contain}
#contact-form>.button,#support-form>.button{font-size:12px!important;background-color:#363b38!important;color:#fff!important}#contact-form>.button:hover,#support-form>.button:hover{background-color:#151a1c!important;color:#fff!important}
.device-page-nav{display:flex;justify-content:center;gap:10px;margin:0 auto 35px}.device-page-nav a{display:inline-flex;align-items:center;gap:5px;font:400 11px/1.5 'Open Sans',sans-serif;padding:9px 15px;border-radius:25px;color:#363b38}.device-page-nav a:hover{color:#000!important;background:transparent!important}
@media(max-width:760px){.masthead #main-menu>a[aria-current],.masthead #main-menu>.nav-group>a[aria-current]{background:#151a1c!important}.paper-reading-button{padding:12px 10px}#arbeitsweise .workflow-illustration{right:25px;top:60px;width:27%;max-height:160px}.text-mode #chat .chat{padding:22px 18px}.studio-photos .studio-beaver{height:140px}.agency-actions{gap:8px}.agency-actions .button{padding:9px 12px}.device-page-nav{gap:6px}.device-page-nav a{padding:8px 10px;white-space:nowrap}.intro-copy .intro-actions{gap:10px}}
.service-icon{height:72px}
#arbeitsweise .paper-body>.lead{min-height:180px}
@media(max-width:760px){#arbeitsweise .paper-body>.lead{min-height:150px}}
/* Follow-up: continuous reading order and full-height spatial reading windows. */
.chat-box{height:100%}.chat-page-nav{display:none}
.text-mode #chat{min-height:0}.text-mode #chat .chat-box{height:auto;border:1px solid #cbcbcb;margin:40px 15px;border-radius:25px;width:calc(100% - 30px);padding:30px}
.text-mode #chat .chat{border:0;margin:0;width:100%;padding:0 0 25px}.text-mode #chat .chat-proof{margin:0 0 25px;padding:0}.text-mode #chat .chat-page-nav{display:flex;margin:0;flex-wrap:wrap}
.screen-face .chat .msg-intro,.screen-face .chat .msg-intro .msg-txt,.screen-face .chat .msg-user,.screen-face .chat .msg-user .msg-txt{color:#151a1c!important}
.screen-face .chat .term-tag:before,.screen-face .chat h2,.screen-face .chat h3,.screen-face .chat .form-inline label{font-family:'Fira Code',monospace!important;font-weight:400!important}
body:not(.text-mode) .paper-face.active>.paper-body{scrollbar-width:thin;scrollbar-color:#999a95 transparent;padding-bottom:55px}
.process-four{margin-bottom:18px}.process-four li{position:relative}.process-four li:not(:last-child):after{content:'';position:absolute;top:22px;left:55px;right:-20px;border-top:1px dashed #929a98;pointer-events:none}
.step-number{background:#faf7ef;position:relative;z-index:1}.step-icon{display:flex;align-items:center;gap:10px}
#arbeitsweise .process-legend{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin:0 0 45px;font-size:12px;color:#626965}#arbeitsweise .process-legend svg{width:23px;height:23px}#arbeitsweise .process-legend svg:not(:first-child){margin-left:12px}
#arbeitsweise .tag-list span{border:1px solid #cfd2d0;color:#858d89;background:transparent}
.travel-status:before{filter:grayscale(1);color:#151a1c}
@media(max-width:760px){.text-mode #chat .chat-box{padding:22px 18px}.process-four{gap:28px}.process-four li{padding-left:65px;min-height:80px}.process-four .step-number{position:absolute;left:0;top:0}.process-four li:not(:last-child):after{top:55px;bottom:-18px;left:22px;right:auto;border-top:0;border-left:1px dashed #929a98}#arbeitsweise .process-legend{margin-bottom:30px}}

.screen-face .chat button.chip{color:#151a1c!important}