/* A quiet global bar, a local page bar, and a clear next step. */
:root{--nav-height:64px;--page-nav-height:0px;--demo-entry-height:0px;--reading-top:calc(var(--nav-height) + var(--page-nav-height) + var(--demo-entry-height));--link:#216b9c}
.site-header{position:sticky;top:0;z-index:30;background:#fbf9f6ed;backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.site-header-inner{max-width:1120px;margin:auto;min-height:64px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.site-brand{font-size:15px;font-weight:700;letter-spacing:.12em;text-decoration:none;white-space:nowrap}
.site-nav{display:flex;gap:26px;align-items:center}.site-nav a{font-size:13px;text-decoration:none;color:var(--muted);white-space:nowrap;padding:19px 0;position:relative}
.site-nav a:hover{color:var(--ink)}.site-nav a[aria-current=page]{color:var(--ink);font-weight:700}.site-nav a[aria-current=page]::after{content:'';position:absolute;bottom:10px;height:2px;left:0;right:0;background:var(--ink)}
.site-header .langbar{padding:0;gap:0}.site-header .langbar button{font-size:11px;padding:5px 8px}.site-header .langbar button[aria-pressed=true]{background:none;text-decoration:underline;text-underline-offset:5px}
.page-navigation{position:sticky;top:var(--nav-height);z-index:25;background:var(--bg);margin:0 -24px;padding:14px 24px;border-bottom:1px solid var(--line)}
.breadcrumbs{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--muted)}.breadcrumbs a{color:inherit;text-decoration:none}.breadcrumbs a:hover{text-decoration:underline}.breadcrumbs b{color:var(--ink);font-weight:600}.breadcrumbs a:last-child:not(:first-child){margin-left:auto}
.section-nav{display:flex;gap:22px;overflow-x:auto;scrollbar-width:thin}.section-nav:empty{display:none}.section-nav a{font-size:12px;text-decoration:none;color:var(--muted);white-space:nowrap;padding:9px 0 2px}.section-nav a[aria-current=page]{color:var(--ink);font-weight:700}
[hidden]{display:none!important}html{scroll-padding-top:calc(var(--reading-top) + 24px)}.section-anchor,.app,[id^=project-],.case-section{scroll-margin-top:0}
.breadcrumbs [aria-current=page]{color:var(--ink);font-weight:600}
.explore{gap:18px}.explore a{font-size:14px;font-weight:600;color:var(--link);text-decoration:none;border:1px solid var(--line);border-radius:999px;padding:9px 18px;background:var(--card)}.explore a:hover{background:#edf2f4}
.everyday-feature{padding:48px 0 68px}.everyday-feature .section-heading{font-size:clamp(30px,4.4vw,42px);letter-spacing:-.03em;line-height:1.3;margin-bottom:18px}.everyday-feature .section-intro{font-size:16px;max-width:44em;margin-bottom:30px}
.everyday-grid{gap:20px}.small-project{padding:0;overflow:hidden;display:flex;flex-direction:column}.project-cover{width:100%;height:190px;object-fit:cover;object-position:top;background:#fff;border-bottom:1px solid var(--line)}.small-project h3{font-size:22px;margin:22px 22px 10px}.small-project p{margin:0 22px 24px;font-size:14px;flex:1}.small-project .card-link{margin:0 22px 22px;color:var(--link)}
.work-preview{margin:0 0 30px}.selected-projects{padding:54px 0}.career-next p{font-size:18px;max-width:43em}.section-heading{font-size:clamp(25px,3.6vw,34px);line-height:1.4}
.reading-next{display:flex;gap:12px;flex-wrap:wrap;padding:30px 0;border-top:1px solid var(--line);margin-top:24px}.reading-next a{font-size:14px;color:var(--link);padding:10px 16px;border:1px solid var(--line);border-radius:12px;text-decoration:none;background:var(--card)}.reading-next a:hover{text-decoration:underline;text-underline-offset:4px}
.project-overview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.project-overview-card{border:1px solid var(--line);border-radius:20px;background:white;text-decoration:none;overflow:hidden;display:flex;flex-direction:column;transition:transform .18s}.project-overview-card:hover{transform:translateY(-3px)}.project-overview-card img{width:100%;height:200px;object-fit:cover;object-position:top;background:white}.project-overview-card>div{padding:24px;display:flex;flex-direction:column;flex:1}.project-overview-card h2{font-size:23px;line-height:1.35;margin:0 0 16px}.project-overview-card p{font-size:14px;color:var(--muted);flex:1;margin:0 0 22px}.project-overview-card .card-link{color:var(--link)}.overview-mark{font-size:34px;margin:24px 24px 0}.research-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.research-overview{margin-top:32px}.research-overview h2{margin-bottom:24px}
.page-head h1{letter-spacing:-.02em;font-size:clamp(32px,5vw,48px);line-height:1.25}.page-head{padding:36px 0 40px}.app-title h2{font-size:24px}.text-link,.quiet-link{color:var(--link)}
.app>h2.app-section-heading{font-size:17px;margin:30px 0 12px;line-height:1.5}
.related-title{flex-basis:100%;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:2px}

.site-brand{display:inline-flex;align-items:center;gap:10px}
.site-logo{width:44px;height:44px;object-fit:contain;flex:0 0 44px}
.copy-email-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:11px 14px;min-height:44px;border:1px solid #c4d4dc;border-radius:10px;background:var(--card);color:var(--link);font:inherit;font-size:13px;font-weight:600;line-height:1.5;cursor:pointer}
.copy-email-button:hover{background:#f7fafb;border-color:var(--link)}
.copy-email-button svg{width:17px;height:17px;flex-shrink:0}
.copy-email-button[data-copy-state=success]{color:var(--accent);border-color:#a9bfb6;background:var(--accent-soft)}
.copy-email-status{display:block;width:100%;font-size:12px;line-height:1.6;color:var(--muted)}
.copy-email-status:empty{display:none}
.reading-contact{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.kiwi-finale{display:flex;justify-content:center;padding:22px 0 12px;pointer-events:none}
.kiwi-finale img{display:block;width:min(100%,480px);height:auto;aspect-ratio:3/1;object-fit:contain}
.page-head.mascot-page-head{display:grid;grid-template-columns:minmax(0,1fr) 116px;column-gap:24px;align-items:start}
.mascot-page-head>h1,.mascot-page-head>p{grid-column:1;min-width:0}
.mascot-page-head>h1{grid-row:1}
.page-mascot{grid-column:2;grid-row:1/4;align-self:center;width:116px;height:116px;object-fit:contain;pointer-events:none}
.page-head.compact-mascot{grid-template-columns:minmax(0,1fr) 86px}
.compact-mascot .page-mascot{width:86px;height:86px}
@media(max-width:650px){.page-head.mascot-page-head{grid-template-columns:minmax(0,1fr) 68px;column-gap:12px}.mascot-page-head>h1{grid-column:1/-1}.page-mascot,.compact-mascot .page-mascot{grid-row:2/4;align-self:start;width:68px;height:68px}}
@media(max-width:650px){.kiwi-finale{padding:16px 0 6px}.kiwi-finale img{width:min(100%,340px)}}
@media print{.kiwi-finale,.section-mascot,.contact-mascot{display:none}}
@media print{.page-mascot{display:none}.page-head.mascot-page-head{display:block}}
@media(max-width:850px){.site-logo{width:32px;height:32px;flex-basis:32px}.site-brand{gap:7px}}
@media(max-width:360px){.site-brand{font-size:12px}.site-logo{width:28px;height:28px;flex-basis:28px}.site-header .langbar button{font-size:10px;padding:5px 6px}}

/* Wide screens keep the outline in the empty left margin; smaller screens use normal flow. */
.section-rail{position:sticky;top:calc(var(--reading-top) + 8px);z-index:20;margin:0 0 28px;font-size:12px;color:var(--muted);background:var(--bg);box-shadow:0 -8px 0 var(--bg)}
html.has-outline{scroll-padding-top:calc(var(--reading-top) + 80px)}
.section-rail details{border:1px solid var(--line);border-radius:12px;background:var(--bg)}
.section-rail details[open]{max-height:calc(100dvh - var(--reading-top) - 110px);overflow-y:auto}
.section-rail summary{padding:12px 16px;cursor:pointer;line-height:1.5}
.section-rail summary>span:first-child{font-weight:600;color:var(--ink)}
.outline-current{display:inline-block;max-width:min(48vw,28em);margin-left:14px;vertical-align:bottom;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.outline-list{list-style:none;margin:0;padding:8px 16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px}
.outline-list li{min-width:0}
.section-rail a{display:flex;align-items:center;gap:10px;padding:9px 12px;color:var(--muted);text-decoration:none;border-radius:7px;line-height:1.45;position:relative}
.section-rail a svg{width:17px;height:17px;flex:0 0 17px}
.outline-list a>span{overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
.section-rail a:hover{background:#f2ede7;color:var(--ink)}
.section-rail a[aria-current=location]{color:var(--accent);font-weight:600;background:var(--accent-soft)}
@media(max-width:1279px){
  .outline-list a[aria-current=location] svg{color:transparent;background:url('assets/brand/kiwi-fruit.svg?v=20261002-kiwi4') center/contain no-repeat}
  .outline-current::before{content:'';display:inline-block;width:12px;height:12px;margin-right:6px;vertical-align:-2px;background:url('assets/brand/kiwi-fruit.svg?v=20261002-kiwi4') center/contain no-repeat}
}
.outline-top{margin:0 16px 12px;border-top:1px solid var(--line);border-radius:0!important}
.section-rail summary:focus-visible{outline:3px solid #5a8879;outline-offset:4px}
.section-anchor:focus-visible{outline:3px solid #5a8879;outline-offset:6px}
@media(min-width:1280px){
  html.has-outline{scroll-padding-top:calc(var(--reading-top) + 24px)}
  .section-rail{position:fixed;left:max(12px,calc((100vw - 940px)/2 - 188px));top:calc(var(--reading-top) + 40px);width:160px;max-height:calc(100dvh - var(--reading-top) - 72px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;margin:0;z-index:10;background:none;box-shadow:none}
  .section-rail details{border:0;border-radius:0;background:none}
  .section-rail summary{display:none}
  .outline-list{display:block;padding:0 0 0 11px;border-left:1px solid var(--line);margin-left:12px}
  .outline-list li+li{margin-top:4px}
  .outline-list a{padding:8px 8px;min-height:36px;gap:8px}
  .outline-list a::before{content:'';position:absolute;left:-15px;width:9px;height:1px;background:#cfc5ba}
  .outline-list a[aria-current=location]::before{left:-23px;width:22px;height:22px;background:var(--bg) url('assets/brand/kiwi-fruit.svg?v=20261002-kiwi4') center/contain no-repeat;border-radius:50%}
  .outline-top{margin:14px 0 0 16px;padding:12px 8px!important;font-size:11px}
}
@media(max-width:520px){.outline-list{grid-template-columns:1fr}.outline-current{max-width:42vw;font-size:11px;margin-left:8px}}
@media(max-width:850px){:root{--nav-height:100px}.site-header-inner{padding:10px 18px 0;gap:8px;flex-wrap:wrap;min-height:100px}.site-brand{font-size:13px}.language-slot{margin-left:auto;order:1}.site-nav{order:2;flex-basis:100%;justify-content:center;gap:26px}.site-nav a{padding:8px 0 14px;font-size:12px}.site-nav a[aria-current=page]::after{bottom:5px}.page-navigation{margin:0 -18px;padding:8px 18px}.section-nav{gap:20px}.breadcrumbs{font-size:11px;gap:7px}.breadcrumbs a:last-child:not(:first-child){margin-left:0}.everyday-grid,.project-overview-grid{grid-template-columns:1fr}.small-project{display:grid;grid-template-columns:42% 1fr;grid-template-rows:auto 1fr auto}.project-cover{height:100%;min-height:220px;grid-row:1/4;border-bottom:0;border-right:1px solid var(--line)}.small-project h3{margin:20px 18px 8px}.small-project p{margin:0 18px 14px}.small-project .card-link{margin:0 18px 20px}.project-overview-card{display:grid;grid-template-columns:38% 1fr}.project-overview-card img{height:100%;min-height:220px}.project-overview-card>div{padding:22px}.research-grid{grid-template-columns:1fr}.research-grid .project-overview-card{display:flex}.reading-next a:last-child{margin-left:0}}
@media(max-width:440px){.small-project,.project-overview-card{display:flex}.project-cover{height:180px;min-height:0;border-right:0;border-bottom:1px solid var(--line)}.project-overview-card img{height:180px;min-height:0}.everyday-feature{padding:34px 0 46px}.introduction>p{font-size:19px}.site-nav{gap:22px}.explore{gap:9px}.explore a{font-size:12px;padding:9px 12px}.work-preview{padding:22px}.work-preview .section-heading{font-size:25px}.stat-grid{grid-template-columns:1fr}}
@media print{.site-header,.page-navigation,.reading-next,.section-rail{display:none}}
@media(max-width:360px){.site-nav{gap:0;justify-content:space-between}.site-nav a{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.project-overview-card{transition:none}}

/* Small brand cues on interactive elements; native text and touch behavior stay intact. */
@media(hover:hover) and (pointer:fine){
  a[href],button:not(:disabled):not([aria-disabled=true]),summary{cursor:url('assets/brand/kiwi-pointer.svg?v=20261002-kiwi4') 4 4,pointer}
  .site-logo{transition:transform .18s ease}
  .site-brand:is(:hover,:focus-visible) .site-logo{transform:rotate(-8deg) translateY(-1px)}
  .entry-card:is(:hover,:focus-visible) .entry-arrow{color:transparent;background:var(--accent-soft) url('assets/brand/kiwi-fruit.svg?v=20261002-kiwi4') center/25px no-repeat}
  .primary-link:is(:hover,:focus-visible),.contact-button:is(:hover,:focus-visible){box-shadow:0 0 0 3px #c9ddcf}
  .outline-top::after{content:'';position:absolute;right:4px;top:-14px;width:28px;height:28px;background:url('assets/brand/kiwi-peek.png?v=20261002-kiwi2') center/contain no-repeat;opacity:0;transform:translateY(3px);transition:opacity .18s ease,transform .18s ease;pointer-events:none}
  .outline-top:is(:hover,:focus-visible)::after{opacity:1;transform:none}
}
@media(prefers-reduced-motion:reduce){
  .site-logo,.outline-top::after{transition:none!important;transform:none!important}
  .project-overview-card:hover,.feature-card:hover,.small-project:hover,.earlier-work-card:hover,.links a:hover{transform:none!important}
}
