@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Instrument+Serif:ital@0;1&display=swap');
:root{--paper:#050d20;--ink:#f4f2ea;--muted:#a9b5c8;--line:#334057;--accent:#acc5ff;--dark:#0b1730;--white:#050d20;--space:clamp(24px,5.6vw,88px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:32px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid var(--accent);outline-offset:6px}::selection{background:#acc5ff;color:var(--paper)}.wrap{max-width:1440px;margin:0 auto;padding-left:var(--space);padding-right:var(--space)}.header{height:112px;display:flex;align-items:center;justify-content:space-between;gap:24px}.wordmark{font-size:40px;font-weight:700;letter-spacing:-4px;line-height:1}.wordmark span{color:var(--accent)}nav{display:flex;gap:36px;font-size:14px}nav a,.text-link,.footer a{transition:color .2s}nav a:hover,.text-link:hover,.footer a:hover{color:var(--accent)}.nav-contact{font-size:14px;border-bottom:1px solid var(--ink);padding:8px 0}.nav-contact span{margin-left:16px}.hero{padding-top:52px}.hero-meta{display:flex;gap:28px;font-size:14px}.hero-meta span:last-child{margin-left:auto;color:var(--muted)}h1,h2,h3,p{margin:0}h1{font-size:clamp(48px,7.6vw,110px);line-height:1.09;letter-spacing:-.065em;font-weight:500;margin:36px 0 40px}.serif{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.035em}h1 .serif{color:var(--accent)}.hero-bottom{display:flex;justify-content:space-between;align-items:center;gap:40px}.hero-bottom p{max-width:535px;color:var(--muted);font-size:18px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:34px;padding:17px 24px;background:var(--ink);color:var(--white);font-size:14px;transition:background .2s,transform .2s;flex-shrink:0}.button:hover{background:var(--accent);transform:translateY(-2px)}.button span{font-size:21px}.stack-strip{margin-top:70px;padding:26px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:14px}.stack-strip>span{color:var(--muted)}.stack-strip>div{display:flex;gap:36px}.stack-strip strong{font-weight:550;font-size:18px}.stack-note{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-size:24px}.section{padding-top:106px;padding-bottom:106px}.section-heading{display:grid;grid-template-columns:1fr 2fr;gap:30px;margin-bottom:56px}.section-number{font-size:14px;display:block;padding-top:10px;color:var(--muted)}h2{font-weight:500;font-size:clamp(38px,4.4vw,64px);letter-spacing:-.05em;line-height:1.12}.expertise-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:44px}.expertise-grid article{border-top:1px solid var(--line);padding-top:26px}.service-symbol{display:block;color:var(--accent);font-size:30px;margin-bottom:26px}.expertise-grid h3{font-size:23px;font-weight:500;letter-spacing:-.035em;margin-bottom:14px}.expertise-grid p{color:var(--muted);margin-bottom:25px}.tags{display:flex;flex-wrap:wrap;gap:7px}.tags span{font-size:12px;line-height:1.4;padding:6px 10px;border:1px solid var(--line);border-radius:3px}.experience{background:var(--dark);color:var(--ink);padding:86px 0}.experience-layout{display:grid;grid-template-columns:1fr 1fr;gap:100px}.experience .section-number{color:#a9b5c8;margin-bottom:38px}.experience h2{font-size:clamp(42px,4.1vw,60px)}.experience h2 .serif{color:#acc5ff;display:inline-block;margin-top:8px}.pill{display:inline-block;padding:6px 12px;border:1px solid #526078;border-radius:30px;font-size:12px;margin-bottom:26px}.experience-copy>p{color:#bac5d5}.experience-copy .large-copy{font-size:25px;line-height:1.4;color:var(--ink);margin-bottom:20px;letter-spacing:-.025em}.facts{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid #43516a;padding:28px 0;margin-bottom:25px;gap:22px}.facts strong{display:block;font-size:32px;font-weight:500;letter-spacing:-.04em}.facts span{font-size:14px;color:#a9b5c8}.education{font-size:14px}.education span{font-size:12px;color:#a9b5c8}.text-link{font-size:14px;display:inline-flex;gap:20px;align-items:center;border-bottom:1px solid;padding:4px 0}.experience .text-link{margin-top:22px}.projects .section-heading p{color:var(--muted);max-width:430px;margin-top:20px}.project-row{display:grid;grid-template-columns:45px 1fr 245px 35px;gap:30px;align-items:center;padding:36px 0;border-top:1px solid var(--line);transition:background .2s}.project-row:hover{background:#17243a}.project-index{font-size:12px;color:var(--muted);align-self:start;padding-top:6px}.project-row h3{font-weight:500;font-size:27px;letter-spacing:-.035em;margin-bottom:8px}.project-row p{color:var(--muted);max-width:560px;font-size:15px}.project-arrow{font-size:28px;transition:transform .2s}.project-row:hover .project-arrow{transform:translate(3px,-3px)}.project-row:last-of-type{border-bottom:1px solid var(--line)}.github-link{margin-top:28px}.quote-section{display:grid;grid-template-columns:1fr 2fr;gap:30px;padding-bottom:104px}.quote-mark{font-family:Georgia,serif;color:var(--accent);font-size:130px;line-height:1}.quote-section blockquote{margin:0}.quote-section blockquote>p{font-family:'Instrument Serif',Georgia,serif;font-size:clamp(28px,3vw,42px);line-height:1.2;letter-spacing:-.015em}.quote-section footer{margin-top:25px;font-size:14px;display:flex;flex-direction:column}.quote-section footer strong{font-weight:600}.quote-section footer span{color:var(--muted)}.quote-section footer a{font-size:12px;text-decoration:underline;margin-top:8px;color:var(--muted)}.contact{background:#acc5ff;color:#101a2c;padding:54px 0 62px}.contact-top{display:flex;justify-content:space-between;font-size:14px;margin-bottom:35px}.contact h2{font-size:clamp(48px,6.8vw,96px);line-height:1.07}.contact-bottom{display:flex;justify-content:space-between;align-items:center;gap:40px;margin-top:36px}.contact-bottom p{font-size:16px;color:#28364b}.button.light{background:var(--paper);color:var(--ink)}.button.light:hover{background:var(--ink);color:var(--paper)}.footer{padding-top:32px;padding-bottom:32px;display:flex;gap:36px;align-items:center}.footer>span{font-size:12px;color:var(--muted)}.footer>div{margin-left:auto;display:flex;gap:24px;font-size:14px}.skip{position:fixed;top:-100px;left:15px;padding:12px 20px;background:var(--ink);color:white;z-index:20}.skip:focus{top:15px}
@media(min-width:1500px){.hero{padding-top:65px;padding-bottom:15px}}
@media(max-width:1000px){.stack-note{display:none}.experience-layout{gap:50px}.project-row{grid-template-columns:30px 1fr 30px;gap:20px}.project-row>.tags{grid-column:2;grid-row:2}.project-arrow{grid-column:3;grid-row:1}.expertise-grid{gap:25px}.hero-meta{gap:18px}.hero-bottom p{max-width:480px}}
@media(max-width:700px){.header{height:90px}.header nav{gap:20px}.nav-contact{display:none}.wordmark{font-size:34px}.hero{padding-top:25px}.hero-meta{display:flex;flex-wrap:wrap;gap:3px 20px;font-size:12px}.hero-meta span:first-child{width:100%}.hero-meta span:last-child{margin-left:0}h1{font-size:clamp(43px,9.3vw,65px);margin-top:28px;margin-bottom:28px;letter-spacing:-.055em}.hero-bottom{align-items:flex-start;flex-direction:column;gap:25px}.hero-bottom p{font-size:16px}.stack-strip{margin-top:42px;align-items:flex-start;flex-direction:column;gap:14px;padding:20px 0}.stack-strip>div{gap:12px 22px;flex-wrap:wrap}.stack-strip strong{font-size:16px}.section{padding-top:65px;padding-bottom:65px}.section-heading{grid-template-columns:1fr;gap:22px;margin-bottom:35px}.expertise-grid{grid-template-columns:1fr;gap:32px}.expertise-grid article{padding-top:20px}.service-symbol{margin-bottom:12px}.expertise-grid p{margin-bottom:18px}.experience{padding:55px 0}.experience-layout{grid-template-columns:1fr;gap:36px}.experience .section-number{margin-bottom:25px}.experience h2{font-size:48px}.experience-copy .large-copy{font-size:23px}.project-row{padding:26px 0;gap:10px 14px;grid-template-columns:22px 1fr 24px}.project-row h3{font-size:23px}.project-row p{font-size:14px}.project-arrow{font-size:24px}.quote-section{grid-template-columns:1fr;gap:0;padding-bottom:65px}.quote-mark{font-size:80px;height:62px}.contact{padding:35px 0 42px}.contact-top{font-size:12px}.contact h2{font-size:clamp(43px,9.3vw,64px)}.contact-bottom{flex-direction:column;align-items:flex-start;gap:26px}.contact-bottom p br{display:none}.footer{flex-wrap:wrap;gap:20px}.footer>span{max-width:220px}.footer>div{width:100%;margin-left:0}.facts strong{font-size:29px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* Alphard: midnight, starlight and a celestial engraving. Benjamin remains the primary brand. */
.header .wordmark{font-size:21px;letter-spacing:-.045em;font-weight:550;display:flex;align-items:center;gap:12px;white-space:nowrap}.brand-star{font-size:27px;font-weight:400;letter-spacing:0}.hero-composition{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:24px;margin:14px 0 34px}.hero-copy h1{font-size:clamp(54px,5.6vw,80px);margin:22px 0;letter-spacing:-.06em;line-height:1.1}.hero-signature{font-size:14px;color:var(--muted)}.stack-note>span{font-family:Arial,sans-serif;color:var(--accent);font-size:18px;margin-right:8px}.company-note{margin-top:38px;padding-top:22px;border-top:1px solid #ad854f;font-size:14px;color:#28364b}.company-note strong{font-weight:600}.company-footer{display:inline-block;margin-top:3px;color:var(--accent)}.button:hover{color:var(--paper)}.contact .button.light:hover{background:#263955;color:#fff}.contact a:focus-visible{outline-color:#101a2c}.experience a:hover{color:var(--accent)}.hero{padding-top:32px}.stack-strip{margin-top:48px}.contact-top>span>span{margin-right:7px}.footer .wordmark{color:var(--ink)}
@media(max-width:1000px){.header .wordmark{font-size:18px}.header nav{gap:20px}.hero-copy h1{font-size:clamp(45px,5.7vw,65px)}}
@media(max-width:700px){.header{flex-wrap:wrap;height:auto;padding-top:25px;padding-bottom:24px;gap:22px}.header .wordmark{font-size:21px}.header nav{width:100%;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:16px}.hero{padding-top:12px}.hero-composition{grid-template-columns:1fr;gap:16px;margin:12px 0 28px}.hero-copy h1{font-size:clamp(46px,10.8vw,70px);margin:23px 0 16px}.hero-signature{font-size:13px}.stack-strip{margin-top:35px}.company-note{margin-top:30px}.footer>span{max-width:none}}

/* Supplied portrait and Alphard references. Celestial motifs remain purely decorative. */
.hero{position:relative;isolation:isolate}.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('assets/alphard-banner.png') left top / 300% auto no-repeat;opacity:.42;mask-image:linear-gradient(to bottom,transparent,#000 15%,#000 75%,transparent)}.hero-composition{gap:48px;padding:36px 0 26px;grid-template-columns:1.25fr 1fr}.portrait-orbit{position:relative;justify-self:center;width:min(100%,350px);aspect-ratio:1;margin:22px 24px}.portrait{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 44%;border-radius:50%;border:1px solid #acc5ff66}.portrait-orbit::before{content:"";position:absolute;inset:-22px;border:1px solid #acc5ff55;border-left-color:transparent;border-bottom-color:transparent;border-radius:50%;transform:rotate(-18deg);pointer-events:none}.portrait-orbit::after{content:"";position:absolute;width:8px;height:8px;right:0;top:18px;background:#acc5ff;border-radius:50%;box-shadow:0 0 16px #7cafff}.orbit-star{position:absolute;left:6px;bottom:8px;color:#edf4ff;font-size:44px;line-height:1;text-shadow:0 0 18px #6f9bff}.experience{position:relative;isolation:isolate;overflow:hidden}.experience::before{content:"";position:absolute;left:-85px;bottom:-150px;width:570px;height:570px;background:url('assets/alphard-hydra.png') center / contain no-repeat;opacity:.09;filter:url(#hydra-alpha);mix-blend-mode:normal;z-index:-1;pointer-events:none}.contact{background:#eaeef7;color:#07152b}.company-note{display:flex;align-items:center;gap:24px;border-color:#b9c5d9}.company-note img{width:84px;height:84px;object-fit:contain;filter:url(#logo-alpha);mix-blend-mode:normal;flex-shrink:0}.company-note p{font-size:14px}.skip{color:var(--paper)}
@media(max-width:1000px){.hero-composition{gap:30px}.portrait-orbit{width:min(100% - 40px,290px);margin:22px 20px}}
@media(max-width:700px){.hero-composition{grid-template-columns:1fr;gap:32px;padding:0 0 14px}.portrait-orbit{width:230px;margin:20px 24px;justify-self:center}.portrait-orbit::before{inset:-16px}.orbit-star{font-size:34px}.hero::before{background-size:300% auto;opacity:.55}.company-note{gap:16px;align-items:flex-start}.company-note img{width:68px;height:68px}.experience::before{width:440px;height:440px;left:-160px;bottom:-60px}}

.image-filters{position:absolute;overflow:hidden;pointer-events:none}

/* Tilli case study: complete historic screens, with links to full-size images. */
.tilli-case{padding-bottom:0}
.tilli-case>p{max-width:780px;color:var(--muted);margin:0 0 20px;font-size:18px}
.tilli-case strong{color:var(--ink);font-weight:550}
.tilli-case .tilli-role{font-size:15px;margin-bottom:28px}
.tilli-case h3{max-width:780px;font-weight:500;font-size:clamp(25px,3vw,36px);line-height:1.25;letter-spacing:-.035em;margin:60px 0 22px}
.tilli-case figure{margin:32px 0;min-width:0}
.tilli-case figure a{display:block}
.tilli-case img{display:block;max-width:100%;height:auto}
.tilli-case figcaption{font-size:14px;line-height:1.6;color:var(--muted);margin-top:14px;max-width:80ch}
.tilli-case .architecture img{width:100%}
.tilli-case .web-screens{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px;align-items:start;margin:32px 0}
.tilli-case .web-screens figure{margin:0}
.tilli-case .web-screens figure:first-child{grid-column:1/-1}
.tilli-case .web-screens img{width:100%}
.tilli-case .web-screens figure:nth-child(2) img{max-width:588px}
.tilli-case .screens{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;align-items:start;max-width:912px;margin:36px auto}
.tilli-case .screens figure{margin:0}
.tilli-case .screens img{width:100%;height:auto;margin:0}
.tilli-case .screens figcaption{margin:16px 0 0}
.tilli-case .screens-note{font-size:14px;margin-top:-12px}
.tilli-case details{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0;margin-top:36px}
.tilli-case summary{cursor:pointer;color:var(--accent)}
.tilli-case summary:focus-visible{outline:3px solid var(--accent);outline-offset:6px}
.tilli-case .payments{background:#fff;padding:20px;width:100%}
@media(max-width:700px){
  .tilli-case>p{font-size:16px}
  .tilli-case h3{margin-top:42px}
  .tilli-case .web-screens,.tilli-case .screens{grid-template-columns:1fr;gap:32px}
  .tilli-case .web-screens figure:first-child{grid-column:auto}
  .tilli-case .screens figure{width:100%;max-width:300px;margin:0 auto}
}