/* Shared accessibility, feedback and small-screen foundations. */
img{max-width:100%;height:auto}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:2px solid currentColor;outline-offset:4px}main{min-width:0}p,li,figcaption{overflow-wrap:break-word}dialog{max-width:calc(100vw - 24px)}
.site-notice{position:fixed;z-index:150;left:50%;bottom:24px;transform:translateX(-50%);width:max-content;max-width:calc(100% - 32px);padding:14px 20px;background:#111;color:#f5f4f0;border:1px solid #f5f4f0;box-shadow:4px 4px 0 #e3261f;font:13px/1.5 system-ui,sans-serif}.site-notice:empty{display:none}.action-status{min-height:1.5em;font:13px/1.6 var(--mono,monospace);margin:16px 0 0}.action-status[data-error=true]{color:#b0241d}
.site-button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:14px 20px;border:1px solid #111;background:#111;color:#f5f4f0;font:12px/1.5 var(--mono,monospace);text-decoration:none;cursor:pointer;text-align:center}.site-button:hover{background:#e3261f;border-color:#e3261f;color:#fff}.site-button.secondary{background:transparent;color:#111}.site-button.secondary:hover{background:#111;color:#fff}.button-detail{font-size:10px;opacity:.7}.contact-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.contact-page .masthead,.not-found-page .masthead{display:none}.contact-page,.not-found-page{max-width:1400px;width:100%;padding:60px clamp(20px,5vw,72px) 80px}.contact-eyebrow{font:11px/1.6 var(--mono,monospace);letter-spacing:.06em;margin:0 0 24px}.contact-intro h2,.lost-copy h2{font:750 clamp(42px,7.8vw,108px)/.98 var(--disp,system-ui);letter-spacing:-.055em;margin:0 0 28px}.contact-intro em,.lost-copy em{font-style:normal;color:#e3261f}.contact-lead{max-width:560px;font-size:clamp(17px,2vw,22px);line-height:1.5}.contact-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:0;margin-top:48px;border-top:1px solid #111}.contact-card{min-width:0;padding:28px 28px 32px 0;border-bottom:1px solid #111}.contact-card:nth-child(2){border-left:1px solid #111;padding-left:28px}.contact-index{font:10px/1.5 var(--mono,monospace);opacity:.65}.contact-card h3{font:600 28px/1.2 var(--disp,system-ui);letter-spacing:-.025em;margin:22px 0 14px}.contact-card p{max-width:42ch}.email-address{display:inline-block;font:clamp(17px,2.3vw,30px)/1.5 var(--mono,monospace);overflow-wrap:anywhere;color:inherit;text-underline-offset:6px}.contact-links{grid-column:1/-1;display:flex;align-items:center;gap:28px;flex-wrap:wrap;padding-right:0}.contact-links h3{margin:0}.contact-links .contact-index{flex-basis:100%}.contact-links>a{display:flex;justify-content:space-between;gap:28px;min-height:44px;align-items:center;color:inherit;font:13px var(--mono,monospace)}.contact-links>a:last-child{margin-left:auto}
.lost-page{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:30px;min-height:65vh}.lost-copy h2{font-size:clamp(42px,6vw,84px)}.lost-copy>p:not(.contact-eyebrow){max-width:43ch;font-size:17px;line-height:1.7}.otter-island{text-align:center;min-width:0}.otter-button{position:relative;display:block;margin-inline:auto;border:0;padding:0;background:transparent;width:100%;max-width:400px;aspect-ratio:1;cursor:grab;touch-action:pan-y}.otter-button:active{cursor:grabbing}.otter-art{position:relative;z-index:1;display:block;width:100%;height:100%;outline:none}.otter-fallback{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(150px,24vw,270px);filter:drop-shadow(0 12px 8px #60433133)}.otter-button.is-ready .otter-fallback{display:none}.otter-island>p{font:12px/1.6 var(--mono,monospace)}
@media(max-width:760px){.contact-page,.not-found-page{padding-top:36px}.contact-grid,.lost-page{grid-template-columns:1fr}.contact-card:nth-child(2){border-left:0;padding-left:0}.contact-links{gap:16px 24px}.contact-links h3{flex-basis:100%}.contact-links>a:last-child{margin-left:0}.contact-card{padding-right:0}.otter-button{max-width:300px}.contact-actions .site-button{flex-grow:1}.lost-page{gap:20px}}
@media(prefers-reduced-motion:reduce){.otter-button{cursor:pointer}}

.responsive-picture{display:contents}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.clippy-tip{font:13px/1.5 system-ui,sans-serif;max-width:28ch;margin-left:12px}.clippy-slot:not(:empty){display:grid;place-items:center;border:2px outset #fff;background:#eee;color:#000080;padding:12px;cursor:pointer;width:120px;height:90px;text-align:center;font:13px/1.5 monospace}

/* Ambient particles use the same eight-ray mark as the identity. */
.site-stars{opacity:1!important}
.site-stars>span{width:calc(6px + var(--i)*.9px);height:calc(6px + var(--i)*.9px);opacity:.12;animation:brand-float calc(18s + var(--i)*1.7s) ease-in-out infinite alternate!important;animation-delay:calc(var(--i)*-2.3s)!important}
.brand-particle{display:block;width:100%;height:100%;background:#e3261f;clip-path:polygon(46% 0,54% 0,54% 40%,82% 12%,88% 18%,60% 46%,100% 46%,100% 54%,60% 54%,88% 82%,82% 88%,54% 60%,54% 100%,46% 100%,46% 60%,18% 88%,12% 82%,40% 54%,0 54%,0 46%,40% 46%,12% 18%,18% 12%,46% 40%)}
@keyframes brand-float{0%{transform:translate3d(-14px,20px,0) rotate(-15deg);opacity:.08}50%{opacity:.2}100%{transform:translate3d(28px,-48px,0) rotate(65deg);opacity:.12}}
.page.contact-page{max-width:1440px;padding-inline:clamp(20px,6vw,88px);padding-bottom:90px;background:#f5f4f0}
body:has(.contact-page){background:#f5f4f0}
.contact-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,.38fr);align-items:center;gap:clamp(32px,5vw,80px)}
.contact-eyebrow{color:#b0241d;margin-bottom:28px;font-size:10px}
.contact-intro h2{font-size:clamp(48px,7.2vw,104px);line-height:.96;letter-spacing:-.06em;margin-bottom:30px}
.contact-lead{font-size:clamp(17px,1.65vw,22px);max-width:42ch;color:#444}
.contact-disciplines{display:flex;gap:10px 22px;flex-wrap:wrap;margin-top:30px;font:10px/1.5 var(--mono);text-transform:uppercase}
.contact-disciplines span::before{content:'+';color:#e3261f;margin-right:8px}
.contact-portrait{margin:0;transform:rotate(3deg);position:relative}
.portrait-placeholder{aspect-ratio:4/5;background:#e5e2da;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:32px;position:relative;border:1px solid #1112;background-image:linear-gradient(#11108 1px,transparent 1px),linear-gradient(90deg,#11108 1px,transparent 1px);background-size:28px 28px}
.portrait-placeholder svg{width:40%;color:#e3261f;transform:rotate(-12deg)}
.portrait-placeholder span{font:9px var(--mono);letter-spacing:.12em;color:#615d55}
.contact-portrait>img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover}
.contact-portrait figcaption{display:flex;justify-content:space-between;gap:12px;font:9px/1.5 var(--mono);padding:14px 0;color:#555}
.contact-grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);margin-top:64px}
.contact-card{padding:32px 32px 36px 0}.contact-card:nth-child(2){padding-left:36px}
.contact-card h3{font-size:clamp(26px,2.7vw,38px);letter-spacing:-.04em;margin:24px 0 18px}
.contact-cv p{font:15px/1.6 var(--disp);color:#555;margin-bottom:28px;max-width:32ch}
.email-address{font-size:clamp(15px,2.1vw,29px);text-decoration-thickness:1px;text-decoration-color:#e3261f;text-underline-offset:8px}.email-address:hover{color:#e3261f}
.contact-links{display:grid;grid-template-columns:1fr 2fr;align-items:center;gap:32px;padding-right:0}
.contact-links-heading h3{margin:12px 0 0}.contact-socials{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.contact-socials a{display:flex;align-items:center;gap:12px;min-height:84px;padding:16px;color:#111;text-decoration:none;border-left:1px solid #1112;font:11px/1.5 var(--mono)}
.contact-socials svg{width:24px;height:24px;flex-shrink:0}.contact-socials small{display:block;color:#666;font-size:9px;margin-top:4px;overflow-wrap:anywhere}.social-arrow{margin-left:auto;color:#e3261f}
.contact-socials a:hover{background:#e3261f;color:#f5f4f0}.contact-socials a:hover small,.contact-socials a:hover .social-arrow{color:inherit}
@media(max-width:900px){.contact-intro{grid-template-columns:minmax(0,1fr) 220px;gap:28px}.contact-links{grid-template-columns:1fr}.contact-socials a:first-child{border-left:0}}
@media(max-width:600px){.contact-intro{grid-template-columns:1fr}.contact-intro h2{font-size:clamp(44px,11vw,66px)}.contact-portrait{width:60%;max-width:250px;margin:12px 12px 0 auto}.contact-grid{grid-template-columns:1fr;margin-top:42px}.contact-card:nth-child(2){border-left:0;padding-left:0}.contact-card{padding-right:0}.contact-socials{grid-template-columns:1fr}.contact-socials a{border-left:0;border-bottom:1px solid #1112;padding:16px;min-height:76px}.contact-socials a:last-child{border-bottom:0}.email-address{font-size:clamp(14px,4.5vw,22px)}}
@media(prefers-reduced-motion:reduce){.site-stars>span{animation:none!important;opacity:.12}}
.morph-viewer,#lb.morph-viewer{position:fixed;inset:0;margin:0;width:100vw;height:100dvh;max-width:none;max-height:none;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;overflow:hidden;outline:none;opacity:1;cursor:zoom-out;touch-action:none;overscroll-behavior:contain}
.morph-viewer[open],#lb.morph-viewer[open]{display:block}
.morph-viewer::backdrop{background:rgba(8,8,8,.92);backdrop-filter:blur(0px);opacity:0;transition:opacity 440ms ease,backdrop-filter 580ms ease;animation:none!important}
.morph-viewer.morph-active::backdrop{opacity:1;backdrop-filter:blur(7px)}
.morph-viewer>img,#lb.morph-viewer>img{position:fixed;max-width:none;max-height:none;object-fit:contain;border-radius:0;box-shadow:none;margin:0;transform-origin:center;will-change:transform,clip-path}
.morph-close{position:absolute;right:20px;top:18px;z-index:2;border:1px solid #fff5;background:#111;color:#f5f4f0;padding:12px 16px;font:11px var(--mono,monospace);cursor:pointer}
.morph-viewer button{opacity:0;transition:opacity 200ms}.morph-viewer.morph-active button{opacity:1;transition-delay:180ms}
@media(prefers-reduced-motion:reduce){.morph-viewer::backdrop,.morph-viewer button{transition:none!important}.morph-viewer>img{will-change:auto}}

/* Size the headline against its own column, including intermediate widths. */
.contact-intro-copy{container-type:inline-size;min-width:0}
.contact-intro h2{font-size:clamp(36px,11cqi,104px);overflow-wrap:normal;word-break:normal;hyphens:none;line-height:1.02}
.contact-title-line,.contact-intro h2 em{display:block}
.contact-title-line,.contact-intro h2 em span{white-space:nowrap}
.contact-intro h2 em span{display:inline-block}
.site-stars.stars-live{z-index:5!important}
.site-stars.stars-live>span{left:0!important;top:0!important;will-change:translate}

/* Contact: CV preview, full-screen dialog and the portrait frame. */
.contact-cv{display:flex;flex-direction:column;align-items:flex-start}.contact-cv h3{margin-top:0}
.cv-preview{position:relative;display:block;width:min(100%,340px);aspect-ratio:1/1.3;margin:0 0 22px;padding:0;border:1px solid #1114;background:#fff;overflow:hidden;cursor:zoom-in;box-shadow:6px 6px 0 #e3261f;transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s}
.cv-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;background:#fff}
.cv-hint{position:absolute;inset:auto 0 0;display:flex;justify-content:space-between;align-items:center;padding:12px 14px;background:#111;color:#f5f4f0;font:10px/1.5 var(--mono);transform:translateY(101%);transition:transform .3s cubic-bezier(.22,1,.36,1)}
.cv-preview:hover,.cv-preview:focus-visible{transform:translate(-3px,-3px) rotate(-.6deg);box-shadow:9px 9px 0 #e3261f}.cv-preview:hover .cv-hint,.cv-preview:focus-visible .cv-hint{transform:none}
@media(hover:none){.cv-hint{transform:none}}
.cv-dialog{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:56px clamp(8px,4vw,56px) 16px;border:0;background:#111;color:#f5f4f0;overflow:hidden}
.cv-dialog:not([open]){display:none}.cv-dialog::backdrop{background:#000c}
.cv-dialog[open]{animation:cv-in .45s cubic-bezier(.22,1,.36,1)}
@keyframes cv-in{from{opacity:0;transform:scale(.96) translateY(18px)}to{opacity:1;transform:none}}
.cv-dialog{padding:56px 12px 12px}
.cv-stage{height:100%;overflow:auto;display:flex;flex-direction:column;align-items:center;justify-content:safe center;gap:16px;scroll-snap-type:y proximity;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.cv-page{flex:none;display:block;height:auto;width:auto;max-height:100%;max-width:100%;background:#fff;cursor:zoom-in;scroll-snap-align:center;box-shadow:0 20px 60px #000a}
.cv-stage.is-zoomed{align-items:flex-start;justify-content:flex-start}
.cv-stage.is-zoomed .cv-page{height:auto;width:min(1100px,100%);max-width:none;max-height:none;cursor:zoom-out}
@media(max-width:700px){.cv-dialog{padding:48px 0 0}.cv-page{box-shadow:none}.cv-stage{gap:8px}.cv-dialog-download{left:8px;top:6px}.cv-close{right:8px}}
.cv-close{position:absolute;right:clamp(8px,4vw,56px);top:10px;border:1px solid #fff5;background:#111;color:#f5f4f0;padding:10px 14px;font:11px var(--mono);cursor:pointer}.cv-close:hover{background:#e3261f;border-color:#e3261f}
.cv-dialog-download{position:absolute;left:clamp(8px,4vw,56px);top:6px;min-height:36px;padding:8px 14px;background:transparent;border-color:#fff5}
.contact-portrait{transform:none}
.portrait-frame{position:relative;transform:rotate(3deg) perspective(900px) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg));transition:transform .5s cubic-bezier(.22,1,.36,1);transform-style:preserve-3d}
.portrait-frame.is-tilting{transition:transform .08s linear}
.portrait-frame::before{content:"";position:absolute;inset:0;background:#e3261f;transform:translate(14px,14px);z-index:-1}
.portrait-placeholder{overflow:hidden;border:1px solid #111;background:radial-gradient(circle at 50% 38%,#fff 0,#efece4 55%,#e1ddd2 100%);background-size:auto;gap:0;isolation:isolate}
.portrait-placeholder::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(#1111 1px,transparent 1px),linear-gradient(90deg,#1111 1px,transparent 1px);background-size:24px 24px;mask:radial-gradient(circle at 50% 45%,#000,transparent 75%)}
.portrait-label{position:absolute;left:12px;bottom:12px;background:#111;color:#f5f4f0!important;padding:6px 8px;font:9px var(--mono)!important;letter-spacing:.12em}
.contact-portrait figcaption{margin-top:18px}
.contact-card,.contact-intro-copy>*,.contact-portrait{animation:rise-in .8s cubic-bezier(.22,1,.36,1) both}
.contact-intro-copy>:nth-child(2){animation-delay:.08s}.contact-intro-copy>:nth-child(3){animation-delay:.16s}.contact-intro-copy>:nth-child(4){animation-delay:.24s}.contact-portrait{animation-delay:.2s}.contact-card:nth-child(2){animation-delay:.12s}.contact-card:nth-child(3){animation-delay:.2s}
@keyframes rise-in{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.contact-socials a{transition:background .25s,color .25s}.social-arrow{transition:transform .3s cubic-bezier(.22,1,.36,1)}.contact-socials a:hover .social-arrow{transform:translate(4px,-4px)}
.contact-socials svg{transition:transform .35s cubic-bezier(.34,1.56,.64,1)}.contact-socials a:hover svg{transform:rotate(-8deg) scale(1.15)}
.contact-links{grid-template-columns:1fr 2fr}.contact-links-heading h3{margin:0}
@media(prefers-reduced-motion:reduce){.contact-card,.contact-intro-copy>*,.contact-portrait,.cv-dialog[open]{animation:none!important}}
/* Long page titles break cleanly (INTERN/SHIP) instead of overflowing. */
.masthead h1{min-width:0;overflow-wrap:anywhere;hyphens:none}
.masthead .vert{flex:none}
/* Keep the ambient stars calm while a page transition runs. */
html[data-page-moving] .site-stars>span{animation-play-state:paused!important}
::view-transition-old(site-nav),::view-transition-new(site-nav){mix-blend-mode:normal}
.narrow-br{display:none}@media(max-width:620px){.narrow-br{display:inline}}

.contact-intro{grid-template-columns:minmax(0,.85fr) minmax(0,1fr)}
.contact-star{margin:0}.contact-star canvas{display:block;width:100%;aspect-ratio:1;height:auto}
.contact-star figcaption{display:flex;justify-content:space-between;gap:12px;font:9px/1.5 var(--mono);padding:6px 4px;color:#555}
@media(max-width:900px){.contact-intro{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media(max-width:600px){.contact-intro{grid-template-columns:1fr}.contact-star{width:100%;max-width:420px;margin:12px auto 0}}

/* giant contact star: values from docs/design/star-mask-editor.html. Box = navbar to the line, full window width; star centre 94% x, 46% y of the 86% window height. */
.contact-intro{position:relative;min-height:clamp(520px,78vh,860px);display:flex;align-items:center}
.contact-intro-copy{position:relative;z-index:2;flex:none;width:min(600px,54vw)}
.contact-star{position:absolute;z-index:1;margin:0;overflow:hidden;container-type:size;top:calc(-1 * clamp(64px,9vh,110px));bottom:-64px;left:calc(50% - 50vw);right:calc(50% - 50vw);-webkit-mask-image:linear-gradient(to right,transparent 0,#000 27%);mask-image:linear-gradient(to right,transparent 0,#000 27%)}
.contact-star svg{position:absolute;display:block;max-width:none;width:114.9cqh;height:114.9cqh;left:calc(94cqw - 57.45cqh);top:calc(53.5cqh - 57.45cqh);overflow:visible}
@media(max-width:900px){.contact-intro{display:block;min-height:0}.contact-intro-copy{width:auto}.contact-star{position:relative;top:auto;bottom:auto;left:auto;right:auto;width:100vw;max-width:none;height:112vw;margin:8px 0 -20px calc(50% - 50vw);container-type:normal;-webkit-mask-image:none;mask-image:none}.contact-star svg{position:absolute;display:block;max-width:none;width:150vw;height:150vw;left:-25vw;top:-19vw;overflow:visible}}

/* contact: readable copy that stays clear of the star, and the otter under the email card */
.contact-intro-copy{width:min(500px,40vw)}
.contact-lead{color:#111;max-width:30ch;font-size:clamp(17px,1.5vw,21px);line-height:1.5}
@media(max-width:900px){.contact-intro-copy{width:auto}.contact-lead{max-width:none}}
.contact-otter{margin-top:26px;text-align:center}
.contact-otter .otter-button{max-width:340px;margin-inline:auto}
.contact-otter #otter-hint{font:11px/1.6 var(--mono);color:#444;margin:6px 0 0}
.contact-otter .action-status{margin:4px 0 0;min-height:1.2em;font-size:11px;color:#444}
@media(max-width:760px){.contact-otter .otter-button{max-width:260px}}
.contact-card{position:relative}
.contact-email{padding-right:32px}.contact-email .contact-otter{width:calc(100% - 0px)}

@media(max-width:900px){.contact-socials a{padding:16px 18px}.contact-links{padding-inline:0}}

/* Custom scrollbars: square, ink-on-paper, red on hover. Applies to the page and every scrollable element. */
:root{--sb-track:#e9e7e1;--sb-thumb:#111;--sb-hot:#e3261f}
@supports selector(::-webkit-scrollbar){
  ::-webkit-scrollbar{width:12px;height:12px;background:var(--sb-track)}
  ::-webkit-scrollbar-track{background:var(--sb-track);box-shadow:inset 1px 0 0 #111}
  ::-webkit-scrollbar-thumb{background:var(--sb-thumb);border:3px solid var(--sb-track);border-radius:0;min-height:48px;min-width:48px}
  ::-webkit-scrollbar-thumb:hover,::-webkit-scrollbar-thumb:active{background:var(--sb-hot)}
  ::-webkit-scrollbar-corner{background:var(--sb-track)}
  ::-webkit-scrollbar-button{display:none;width:0;height:0}
}
@supports not selector(::-webkit-scrollbar){*{scrollbar-width:thin;scrollbar-color:var(--sb-thumb) var(--sb-track)}}