/* Preserve the original typography, palette, artwork and sidebar. */
:root { --rail:52px; --ink:#58585a; --panel:#1c1d1f; }
html { min-height:100%; }
body { min-width:0; min-height:100vh; min-height:100dvh; }
a:focus-visible,button:focus-visible,.actual-image:focus-visible { outline:2px solid #898888;outline-offset:4px; }
#blank { display:none; }
.menu { position:fixed;z-index:40;top:0;bottom:0;height:100vh;height:100dvh;min-height:0; }
.menu .menu-cont { height:100%;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;display:flex;flex-direction:column; }
.menu .menu-cont .menu-mantis { flex-shrink:0; }
.menu .menu-cont .list-works { flex-shrink:0;display:block;width:205px;min-width:0;padding-top:100px;margin:0 auto 36px; }
.menu .menu-cont .bottom-menu-content { position:static;margin-top:auto;padding:0 12px 24px;flex-shrink:0; }
.menu .right-navi ul li a { outline-offset:-5px; }
.menu .right-navi ul li a:focus-visible { outline:2px solid #c0b4b7;outline-offset:-5px; }
.menu .right-navi ul li.last-item .email { background-image:url('../icons/mail.svg?v=3bc5a83d45de'); }
.icon::before,.glyphicon::before { content:''!important;display:inline-block;width:1em;height:1em;background:currentColor;vertical-align:-.1em;mask:var(--icon) center/contain no-repeat;-webkit-mask:var(--icon) center/contain no-repeat; }
.icon-a-left { --icon:url('../icons/arrow-left.svg?v=3bc5a83d45de'); }
.icon-a-right { --icon:url('../icons/arrow-right.svg?v=3bc5a83d45de'); }
.icon-a-down { --icon:url('../icons/arrow-down.svg?v=3bc5a83d45de'); }
.icon-a-navi-left { --icon:url('../icons/previous.svg?v=3bc5a83d45de'); }
.icon-a-navi-right { --icon:url('../icons/next.svg?v=3bc5a83d45de'); }
.icon-msg { --icon:url('../icons/message.svg?v=3bc5a83d45de'); }
.icon-my-fb { --icon:url('../icons/facebook.svg?v=3bc5a83d45de'); }
.icon-my-in { --icon:url('../icons/linkedin.svg?v=3bc5a83d45de'); }
.icon-my-gplus { --icon:url('../icons/google-plus.svg?v=3bc5a83d45de'); }
.glyphicon-chevron-right { --icon:url('../icons/chevron-right.svg?v=3bc5a83d45de'); }
.glyphicon-chevron-left { --icon:url('../icons/chevron-left.svg?v=3bc5a83d45de'); }
.glyphicon-chevron-up { --icon:url('../icons/chevron-up.svg?v=3bc5a83d45de'); }
.glyphicon-chevron-down { --icon:url('../icons/chevron-down.svg?v=3bc5a83d45de'); }
.header,.bio-header,.body,.footer { left:var(--rail); }
.my-container { width:min(915px,calc(100% - 40px)); }
.body:not(.bio) .my-container { width:calc(100% - 32px);height:100%; }
.actual-image { position:relative;width:100%;height:100%;touch-action:pan-y pinch-zoom; }
.actual-image img { display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain; }
.gallery-status { position:absolute;bottom:8px;left:12px;right:12px;margin:0;text-align:center;background:rgba(255,255,255,.95);z-index:20; }
.gallery-status:empty { display:none; }
.image-counter,.gallery-step { display:none; }
.serie-navi ul { display:flex;justify-content:center;flex-wrap:wrap;max-width:100%; }
.serie-navi ul li { float:none; }
.serie-navi ul li.first { padding-right:clamp(8px,5vw,80px); }
.serie-navi ul li.last { padding-left:clamp(8px,5vw,80px); }
.footer .buttons { position:absolute;top:34px;left:0;right:0; }
.footer .buttons a { z-index:1; }
.serie-info { position:fixed;z-index:50;top:0;bottom:0;height:100vh;height:100dvh;max-width:calc(100% - var(--rail));width:470px;transform:translateY(-105%);visibility:hidden;padding-inline:clamp(24px,6vw,90px); }
.serie-info.active { transform:translateY(0);visibility:visible; }
.serie-info .navigation a { display:inline-flex;min-width:44px;min-height:44px;align-items:center;justify-content:center; }
.serie-info .close-btn { display:flex;align-items:center;justify-content:center;min-height:44px; }
.menu .works-thumbs .works-box { overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin; }
.menu .works-thumbs .project { position:relative;display:none; }
.menu .works-thumbs .project.active { display:block; }
.menu .works-thumbs .project a { display:block;width:max-content;max-width:100%;margin:10px auto; }
.menu .works-thumbs .project img { max-width:100%; }
.menu .works-thumbs .project a .hover { display:flex;align-items:center;justify-content:center;line-height:1; }
.bio .my-container { display:flex;align-items:flex-start;gap:clamp(20px,4vw,106px);max-width:915px; }
.bio .my-container .half-col { float:none;width:calc(50% - 20px);margin:0;min-width:0;flex:1; }
.bio img { max-width:100%;height:auto; }
.bio p,.info-text { overflow-wrap:anywhere; }
.bio .box { padding-inline:clamp(16px,3vw,30px); }
@media(min-width:768px) and (max-height:650px) {
 .header { height:80px; }.header .header-project { padding-top:45px; }#mini-logo { margin-top:30px; }
 .body:not(.bio) { top:90px;bottom:80px; }.footer { height:70px;padding-top:24px; }
}
@media(max-width:767px), (max-width:1000px) and (max-height:500px) and (orientation:landscape) {
 :root { --rail:48px; }
 body { height:auto;min-height:100vh;min-height:100dvh; }
 .menu { width:min(357px,100vw);left:calc(-1 * (min(357px,100vw) - var(--rail))); }
 .menu.active { left:0; }
 .menu .right-navi,.menu .right-navi ul { width:var(--rail); }
 .menu .right-navi ul li a { width:var(--rail);background-position:center top;background-repeat:no-repeat; }
 .menu .right-navi ul li .bio:before,.menu .right-navi ul li .works:before { width:var(--rail);background-position:center top;background-repeat:no-repeat; }
 .menu .right-navi { padding-top:env(safe-area-inset-top,0px); }
 .menu .right-navi ul li.shine-cont { top:calc(80px + env(safe-area-inset-top,0px)); }
 .menu .right-navi ul li.last-item { bottom:calc(8px + env(safe-area-inset-bottom,0px)); }
 .menu .menu-cont { width:calc(100% - var(--rail));padding-top:env(safe-area-inset-top,0px); }
 .menu .menu-cont .list-works { padding-top:66px;width:calc(100% - 40px);margin-bottom:30px; }
 .menu .menu-cont .menu-mantis { top:36px; }
 .menu .menu-cont .list-works a { min-height:44px;display:flex;align-items:center;font-size:12px;padding:10px 0; }
 .menu .works-thumbs { display:none; }
 .menu-open { overflow:hidden; }
 .my-container { width:calc(100% - 24px); }
 .header { height:132px;padding-top:env(safe-area-inset-top,0px); }
 .header .my-container { display:flex;flex-direction:column;align-items:center;gap:15px; }
 #mini-logo { flex-shrink:0;float:none;margin-top:22px; }
 .header .header-project { float:none;padding:0;display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%; }
 .header .header-project #project-name { font-size:11px;line-height:1.5;max-width:70%; }
 .header .header-project .more { padding:0;flex-shrink:0; }
 .header .header-project .more .more-icon { display:none; }
 .header .header-project .more #more-info { position:static;display:flex;align-items:center;min-height:44px;font-size:10px; }
 .header:before { bottom:0; }
 .body:not(.bio) { top:calc(142px + env(safe-area-inset-top,0px));bottom:calc(142px + env(safe-area-inset-bottom,0px)); }
 .body:not(.bio) .my-container { width:calc(100% - 16px); }
 .footer { position:absolute;height:132px;bottom:env(safe-area-inset-bottom,0px);padding-top:4px; }
 .footer .my-container { height:100%; }
 .serie-navi { display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center; }
 .serie-navi ul { grid-column:2;grid-row:1; }
 .serie-navi .navs { display:none; }
 .gallery-step { display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;background:transparent;border:0;color:var(--ink);padding:0;grid-row:1; }
 .gallery-previous { grid-column:1; }.gallery-next { grid-column:3; }
 .serie-navi ul { display:flex;flex-wrap:nowrap;align-items:center;width:100%;overflow-x:auto;scrollbar-width:none;justify-content:safe center;padding:0 4px; }
 .serie-navi ul li { flex:0 0 auto; }
 .serie-navi ul li:first-child { margin-left:auto; }.serie-navi ul li:last-child { margin-right:auto; }
 .serie-navi ul li.first,.serie-navi ul li.last { padding:0; }
 .serie-navi ul li a { display:flex;justify-content:center;align-items:center;min-width:32px;min-height:44px;padding:0 10px; }
 .serie-navi ul li.navs a { min-width:44px; }
 .dot { margin:0; }
 .image-counter { display:block;font-size:11px;line-height:24px;grid-column:1/-1;grid-row:2; }
 .footer .buttons { top:auto;bottom:6px;left:0;right:0;height:44px; }
 .footer .buttons a { display:flex;align-items:center;justify-content:center;min-height:44px;max-width:49%;font-size:10px;padding:4px 7px; }
 .serie-info { width:calc(100% - var(--rail));padding:env(safe-area-inset-top,0px) 24px calc(40px + env(safe-area-inset-bottom,0px));font-size:14px; }
 .serie-info .navigation { padding:12px 0; }
 .bio-header { position:relative;height:100px;left:var(--rail);width:calc(100% - var(--rail));padding-top:env(safe-area-inset-top,0px); }
 #mini-logo.center { margin:30px auto; }
 .body.bio { position:relative;left:var(--rail);top:0;width:calc(100% - var(--rail));padding-bottom:env(safe-area-inset-bottom,0px); }
 .bio .my-container { display:block; }
 .bio .my-container .half-col { width:100%;margin:0; }
 .bio .box { padding:20px 16px; }.bio .box p { font-size:13px;line-height:1.7; }
 .box h2:before,.box h2:after { width:22px; }.box h2:before { left:-32px; }.box h2:after { right:-32px; }
}
@media(max-height:500px) and (max-width:1000px) and (orientation:landscape) {
 body { min-height:420px; }.header { height:80px; }#mini-logo { margin-top:16px; }
 .header .my-container { flex-direction:row;justify-content:space-between; }.header .header-project { width:auto;max-width:62%;padding-top:14px; }
 .body:not(.bio) { top:90px;bottom:76px; }.footer { height:68px; }.footer .buttons { display:none; }.image-counter,.gallery-step { display:none; }
 .serie-navi ul li a { min-height:44px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important;transition:none!important;scroll-behavior:auto!important; } }
/* Outlined SVG lettering; no font download or raster scaling is needed. */
#mini-logo { background-image:url('../icons/wordmark.svg?v=3bc5a83d45de');background-repeat:no-repeat;background-size:contain; }
.menu .right-navi ul li .bio { background-image:url('../icons/bio.svg?v=3bc5a83d45de'); }
.menu .right-navi ul li .bio:before { background-image:url('../icons/bio-hover.svg?v=3bc5a83d45de'); }
.menu .right-navi ul li .works { background-image:url('../icons/works.svg?v=3bc5a83d45de'); }
.menu .right-navi ul li .works:before { background-image:url('../icons/works-hover.svg?v=3bc5a83d45de'); }
.mobile-menu-toggle,.mobile-menu-backdrop,.mobile-primary { display:none; }
.actual-image { overflow:hidden; }
@media(max-width:767px), (max-width:1000px) and (max-height:500px) and (orientation:landscape) {
 :root { --rail:0px; }
 .mobile-menu-toggle { display:flex;align-items:center;justify-content:center;position:fixed;left:calc(12px + env(safe-area-inset-left,0px));right:auto;top:calc(16px + env(safe-area-inset-top,0px));z-index:90;width:44px;height:44px;border:0;padding:10px;background:transparent;color:var(--ink); }
 .mobile-menu-toggle svg { width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round; }
 .menu-open .mobile-menu-toggle { background:var(--panel);color:#c0b4b7; }
 .menu { width:min(360px,calc(100vw - 32px));left:0;transform:translateX(-105%);visibility:hidden;pointer-events:none;transition:transform 200ms ease,visibility 200ms;z-index:80; }
 .menu.active { left:0;transform:translateX(0);visibility:visible;pointer-events:auto; }
 .menu .right-navi,.menu .menu-cont .menu-mantis { display:none; }
 .menu .menu-cont { width:100%;padding-top:calc(76px + env(safe-area-inset-top,0px));background:var(--panel); }
 .mobile-primary { display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 24px 12px;padding-bottom:12px;border-bottom:1px solid #58585a; }
 .mobile-primary a { display:flex;align-items:center;justify-content:center;min-height:44px;text-transform:uppercase;letter-spacing:1px;font-size:11px;color:#c0b4b7; }
 .mobile-primary a:hover,.mobile-primary a:focus-visible { color:white; }
 .menu .menu-cont .list-works { padding-top:8px;width:calc(100% - 48px); }
 .menu-open .mobile-menu-backdrop { display:block;position:fixed;inset:0;border:0;background:rgba(28,29,31,.34);z-index:70; }
 .header .my-container { width:calc(100% - 32px); }
 #mini-logo { width:180px;height:34px;margin-top:22px; }
 #mini-logo.center { margin-top:24px; }
 .bio-header { left:0;width:100%; }
 .body.bio { left:0;width:100%; }
 .serie-info { max-width:100%;width:100%; }
 .serie-navi ul li a { min-width:44px; }
}
@media(max-height:500px) and (max-width:1000px) and (orientation:landscape) {
 body { min-height:100vh;min-height:100dvh; }
 .mobile-menu-toggle { top:calc(8px + env(safe-area-inset-top,0px)); }
 .header { height:76px; }.header .my-container { padding-left:calc(48px + env(safe-area-inset-left,0px));padding-right:0; }
 #mini-logo { margin-top:16px; }
 .header .header-project { max-width:55%; }
 .body:not(.bio) { top:84px;bottom:102px; }.footer { height:94px; }
 .footer .buttons { display:block;height:44px;bottom:0; }
 .gallery-step { display:flex; }
 .menu .menu-cont { padding-top:calc(56px + env(safe-area-inset-top,0px)); }
}

/* Social marks are inline vectors, with no decorative rules crossing them. */
.menu .menu-cont .bottom-menu-content .social { display:flex;align-items:center;justify-content:center;gap:12px; }
.menu .menu-cont .bottom-menu-content .social::before,
.menu .menu-cont .bottom-menu-content .social::after { content:none;display:none; }
.menu .menu-cont .bottom-menu-content .social a { display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:0; }
.social-icon { display:block;width:20px;height:20px;fill:currentColor; }
/* Gallery controls share one colour, stroke weight and vertical centre. */
.serie-navi { --gallery-control:#a99da1; }
.serie-navi ul { align-items:center; }
.serie-navi ul li a { display:flex;align-items:center;justify-content:center;min-height:44px;color:var(--gallery-control); }
.serie-navi .gallery-step { color:var(--gallery-control); }
.serie-navi .icon-a-navi-left,.serie-navi .icon-a-navi-right { display:block;width:20px;height:20px;line-height:1; }
.serie-navi .icon-a-navi-left::before,.serie-navi .icon-a-navi-right::before { display:block;width:20px;height:20px;vertical-align:0; }
.serie-navi .dot { box-sizing:border-box;width:10px;height:10px;margin:0;border:2px solid var(--gallery-control);background:var(--gallery-control); }
.serie-navi .dot.active,.serie-navi a:hover .dot { background:transparent; }
.serie-navi a:hover,.serie-navi button:hover { color:#58585a; }
/* Keep the series links and gallery navigation in the same footer row. */
.serie-navi .icon-a-navi-left,.serie-navi .icon-a-navi-right,
.serie-navi .icon-a-navi-left::before,.serie-navi .icon-a-navi-right::before { width:26px;height:26px; }
@media(min-width:1001px), (min-width:768px) and (min-height:501px) {
 .footer .my-container { display:grid;grid-template-columns:140px minmax(0,1fr) 140px;column-gap:16px;align-items:center; }
 .footer .buttons { display:contents; }
 .footer .buttons a { position:static;grid-row:1;justify-self:start;float:none;margin:0; }
 .footer .buttons a.rightuj { grid-column:3;justify-self:end; }
 .footer .buttons a.leftuj { grid-column:1; }
 .serie-navi { grid-column:2;grid-row:1;display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;min-width:0; }
 .serie-navi .navs { display:none; }
 .serie-navi ul { grid-column:2;grid-row:1;display:flex;flex-wrap:nowrap;justify-content:safe center;overflow-x:auto;scrollbar-width:none; }
 .serie-navi ul li { flex:0 0 auto; }
 .serie-navi ul li:first-child { margin-left:auto; }.serie-navi ul li:last-child { margin-right:auto; }
 .serie-navi .gallery-step { display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;background:transparent;grid-row:1; }
 .serie-navi .gallery-previous { grid-column:1; }.serie-navi .gallery-next { grid-column:3; }
}
/* Original sidebar divider, independent of the envelope artwork. */
.menu .right-navi ul li.last-item::before { content:'';position:absolute;left:18px;top:0;width:16px;height:1px;background:#c0b4b7; }

.sidebar-menu-toggle { position:absolute;top:50%;left:4px;transform:translateY(-50%);width:44px;height:44px;padding:0;border:0;background:transparent;cursor:pointer; }

/* Avoid a spinner flash on cached images; hide it as soon as decoding finishes. */
.actual-image .loader { transition:none; }
.actual-image .loader.active { transition:opacity 120ms ease 150ms; }
/* Ubuntu uses native type outlines for the brand and navigation, not traced pixels. */
@font-face { font-family:'Ubuntu Navigation';font-style:normal;font-weight:400;font-display:swap;src:url('../icons/ubuntu-regular.woff?v=3bc5a83d45de') format('woff'); }
@font-face { font-family:'Ubuntu Navigation';font-style:normal;font-weight:700;font-display:swap;src:url('../icons/ubuntu-bold.woff?v=3bc5a83d45de') format('woff'); }
.mobile-primary,.menu .list-works,.header-project,.footer .myBtn,.bottom-menu-content { font-family:'Ubuntu Navigation',sans-serif; }
@media(min-width:1001px), (min-width:768px) and (min-height:501px) {
 .header .my-container { position:relative; }
 .header #mini-logo { position:absolute;left:50%;transform:translateX(-50%);float:none;width:180px;height:34px;margin-top:24px; }
 .header .header-project { max-width:100%; }
 .bio-header #mini-logo.center { width:180px;height:34px;margin-top:24px; }
 .body.bio { top:110px; }
}
@media(min-width:768px) and (min-height:501px) and (max-height:650px) {
 .header #mini-logo,.bio-header #mini-logo.center { margin-top:10px; }
 .body.bio { top:90px; }
}
@media(min-width:1001px), (min-width:768px) and (min-height:501px) {
 .header .header-project { display:flex;align-items:center;justify-content:flex-end;gap:10px; }
 .header .header-project #project-name { min-width:0; }
 .header .header-project .more { padding-left:0;flex-shrink:0; }
}

/* Click/tap feedback uses the menu's existing colours, not browser focus frames. */
body:not(.keyboard-navigation) a:focus,
body:not(.keyboard-navigation) button:focus,
body:not(.keyboard-navigation) .actual-image:focus { outline:none!important;box-shadow:none; }
.menu a,.menu button { -webkit-tap-highlight-color:transparent; }
.menu .menu-cont a:focus,.menu .works-thumbs a:focus { outline:none!important;box-shadow:none; }
.keyboard-navigation .menu .menu-cont a:focus,
.keyboard-navigation .menu .menu-cont .list-works li a:focus { text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px; }
.keyboard-navigation .menu .works-thumbs a:focus { outline:1px solid #c0b4b7!important;outline-offset:2px; }

/* Keep overflowing image dots swipeable without drawing a scrollbar. */
.serie-navi ul::-webkit-scrollbar { display:none;width:0;height:0; }
