:root{color:#262b2b;font-synthesis:none;--paper:#fff9e0;--nav-height:52px;--ink:#262b2b;--muted:#5d625d;--line:#262b2b26;--accent:#087c94;background:#fff9e0;font-family:Courier New,Courier,monospace}*{box-sizing:border-box}body{margin:0}button,a,summary{-webkit-tap-highlight-color:transparent}button,input{font:inherit}a{color:inherit;text-underline-offset:.25em}a:hover{color:var(--accent)}button{cursor:pointer}button,summary,a{touch-action:manipulation}:focus-visible{outline:3px solid var(--accent);outline-offset:5px}img{max-width:100%;display:block}h1,h2,p{margin:0}p{line-height:1.5}.skip-link{z-index:100;background:var(--paper);padding:12px;position:fixed;top:-80px;left:16px}.skip-link:focus{top:10px}.navbar{height:var(--nav-height);border-bottom:1px solid var(--line);z-index:10;background:#fff9e0f5;justify-content:space-between;align-items:center;padding:0 max(24px,50vw - 600px) 0 16px;display:flex;position:sticky;top:0}.nav-logo a{display:block}.nav-logo img{object-fit:contain;width:40px;height:40px}.nav{height:100%}.nav-links,.show-nav{grid-template-columns:repeat(4,1fr);width:440px;height:100%;margin:0;padding:0;list-style:none;display:grid;position:relative}.nav-links a{text-align:center;justify-content:center;align-items:center;height:100%;padding:0 10px;display:flex}.nav-links:after{content:"";background:var(--accent);width:25%;height:1px;transform:translateX(calc(var(--nav-position,0) * 100%));pointer-events:none;transition:transform .3s ease-in-out;position:absolute;bottom:-1px;left:0}.nav-links:has(li:first-child .active-link){--nav-position:0}.nav-links:has(li:nth-child(2) .active-link){--nav-position:1}.nav-links:has(li:nth-child(3) .active-link){--nav-position:2}.nav-links:has(li:nth-child(4) .active-link){--nav-position:3}.nav-links:has(li:first-child:is(:hover,:focus-within)){--nav-position:0}.nav-links:has(li:nth-child(2):is(:hover,:focus-within)){--nav-position:1}.nav-links:has(li:nth-child(3):is(:hover,:focus-within)){--nav-position:2}.nav-links:has(li:nth-child(4):is(:hover,:focus-within)){--nav-position:3}.nav a{font-size:.95rem;font-weight:700;text-decoration:none}.nav a.active-link{color:var(--accent)}.nav-btn{background:0 0;border:0;width:44px;height:44px;padding:10px;display:none}.nav-btn img{width:24px;height:24px}.hide-icon{display:none}main{min-height:calc(100svh - var(--nav-height))}.page-shell{width:min(1200px,100%);margin:0 auto;padding:32px 32px 64px}.page-heading{max-width:720px;margin-bottom:26px}.eyebrow{text-transform:uppercase;letter-spacing:.14em;color:var(--muted);font-size:.7rem;font-weight:700}.page-heading h1{letter-spacing:-.065em;margin:6px 0 10px;font-size:clamp(2.5rem,6vw,4.5rem)}.page-heading>p:last-child{color:var(--muted);font-size:.95rem}.home-hero{min-height:calc(100svh - var(--nav-height));isolation:isolate;place-items:center;padding:80px 24px;display:grid;position:relative;overflow:hidden}.logo-container{z-index:-1;pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.logo-container img{grid-area:1/1;width:min(490px,82vw)}.logo-art{opacity:.19;filter:grayscale(65%);animation:1.8s cubic-bezier(.2,.7,.2,1) both logo-rise}.logo-underline{opacity:.16;animation:1.8s cubic-bezier(.2,.7,.2,1) .12s both logo-rise}.about-me-text-div{text-align:center;width:min(650px,100%);animation:1.2s .55s both intro-reveal;position:relative}.about-me-text-div h1{letter-spacing:-.07em;margin:12px 0 16px;font-size:clamp(2.7rem,6.5vw,4.4rem);line-height:1.1}.about-me-text-div>p:not(.eyebrow){text-wrap:pretty;max-width:550px;margin:auto;font-size:1.05rem}.home-links{flex-wrap:wrap;justify-content:center;gap:14px 26px;margin-top:24px;font-size:.85rem;font-weight:700;display:flex}@keyframes logo-rise{0%{opacity:0;transform:translateY(140px)}}@keyframes intro-reveal{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.project-list-content{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:26px;display:grid}.project-tile{scroll-margin-top:calc(var(--nav-height) + 16px);border:1px solid var(--line);background:#ffffff45;border-radius:8px;min-width:0;overflow:hidden}.project-tile[open]{order:-1;grid-column:1/-1}.project-tile:not([open]) .project-summary{grid-template-rows:270px minmax(250px,auto);display:grid}.project-tile:not([open]) .project-intro{flex-direction:column;display:flex}.project-tile:not([open]) .project-toggle{margin-top:auto;padding-top:18px}.project-summary{cursor:pointer;list-style:none}.project-summary::-webkit-details-marker{display:none}.project-summary:focus-visible{outline-offset:-5px}.project-cover{border-bottom:1px solid var(--line);background:#ece7d5;place-items:center;height:270px;padding:20px;display:grid}.project-cover img{object-fit:contain;filter:none;opacity:1;width:100%;height:100%;min-height:0}.project-intro{padding:24px}.project-intro h2{letter-spacing:-.045em;margin:6px 0 8px;font-size:1.7rem}.project-intro>p:not(.eyebrow){color:var(--muted);font-size:.85rem}.project-toggle{color:var(--accent);justify-content:space-between;align-items:center;margin-top:18px;font-size:.8rem;font-weight:700;display:flex}.toggle-symbol{font-size:1.5rem}.when-open{display:none}.project-tile[open] .when-open{display:inline}.project-tile[open] .when-closed{display:none}.project-tile[open] .toggle-symbol{transform:rotate(45deg)}.project-tile[open] .project-summary{grid-template-columns:1fr 1fr;display:grid;position:relative}.project-tile[open] .project-toggle{background:var(--paper);border-radius:50%;justify-content:center;width:44px;height:44px;margin:0;padding:0;position:absolute;top:8px;right:8px}.project-tile[open] .project-toggle:hover{background:#eae5d5}.project-tile[open] .project-intro{padding-top:52px}.project-tile[open] .project-cover{border-bottom:none;border-right:1px solid var(--line);height:300px}.project-tile[open] .project-intro{align-self:center}.project-details{border-top:1px solid var(--line);padding:24px;font-size:.9rem}.project-details>p{max-width:800px}.project-details>ul{max-width:800px;color:var(--muted);margin:14px 0;padding-left:22px;line-height:1.55}.project-details li+li{margin-top:4px}.project-links{flex-wrap:wrap;gap:12px;margin:18px 0;display:flex}.project-links a{border:1px solid var(--ink);border-radius:4px;padding:12px 16px;font-size:.8rem;font-weight:700;text-decoration:none}.project-links a:hover{background:var(--ink);color:var(--paper)}.image-collection{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:24px;display:grid}.image-collection figure{min-width:0;margin:0}.image-collection button{border:1px solid var(--line);background:#eae5d5;border-radius:4px;width:100%;padding:16px;display:block;position:relative}.image-collection img{object-fit:contain;width:100%;height:280px}.image-enlarge{text-align:right;color:var(--muted);margin-top:16px;font-size:.7rem;display:block}.image-collection figcaption{color:var(--muted);margin-top:12px;font-size:.75rem;line-height:1.6}.image-collection figcaption h2{color:var(--ink);margin-bottom:4px;font-size:1rem}.gallery-empty{border-top:1px solid var(--line);border-bottom:1px solid var(--line);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:18px;min-height:340px;display:flex}.gallery-empty h2{letter-spacing:-.04em;font-size:1.4rem}.gallery-empty p{color:var(--muted);font-size:.85rem}.gallery-mark{color:var(--accent);font-size:3rem}.image-dialog{color:var(--paper);background:0 0;border:none;width:min(1100px,96vw);max-width:96vw;max-height:94svh;padding:0}.image-dialog::backdrop{background:#141818ef}.image-dialog-content{padding:16px}.image-dialog img{object-fit:contain;width:100%;height:min(68svh,800px)}.image-dialog p{text-align:center;margin-top:12px;font-size:.85rem}.dialog-close,.image-navigation button{color:inherit;background:#262b2b;border:1px solid #fff5;border-radius:4px;padding:10px 16px}.dialog-close{margin:0 0 16px auto;display:block}.image-navigation{justify-content:space-between;align-items:center;gap:12px;margin-top:16px;font-size:.75rem;display:flex}.contact-list{flex-wrap:wrap;gap:24px;display:flex}.contact-item{border:1px solid var(--line);border-radius:5px;align-items:center;gap:18px;padding:24px;font-weight:700;text-decoration:none;display:flex}.contact-item img{width:36px;height:36px}@media (width<=700px){.navbar{padding:0 12px}.nav-btn{display:block}.nav{height:auto;top:var(--nav-height);background:var(--paper);border-bottom:1px solid var(--line);position:absolute;left:0;right:0}.nav-close,.nav-links:after{display:none}.nav a.active-link{text-decoration:underline}.nav-links,.show-nav{flex-direction:column;gap:0;width:auto;padding:10px 20px 18px;display:flex}.nav li a{padding:14px 0;display:block}.page-shell{padding:24px 20px 44px}.page-heading{margin-bottom:22px}.project-list-content{grid-template-columns:1fr;gap:20px}.project-cover{height:240px}.project-tile[open] .project-summary{display:block}.project-tile[open] .project-cover{border-right:none;border-bottom:1px solid var(--line);height:240px}.project-intro,.project-details{padding:24px}.image-collection{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.image-collection img{height:220px}.contact-list{flex-direction:column}}@media (width<=400px){.image-collection{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.project-image-group{margin-top:28px}.project-image-group h3{margin:0 0 16px;font-size:1rem}.project-image-group .image-collection{margin-top:0}.project-details .image-collection img{aspect-ratio:16/10;object-fit:contain;height:auto}.image-note{color:var(--muted);margin-top:20px;font-size:.75rem}@media (width<=700px){.project-tile:not([open]) .project-summary{grid-template-rows:240px minmax(250px,auto)}}.image-group-description{color:var(--muted);margin-bottom:16px;font-size:.75rem}.gallery-page .image-collection{columns:3;column-gap:24px;display:block}.gallery-page .image-collection figure{break-inside:avoid;margin-bottom:24px}.gallery-page .image-collection button{padding:10px}.gallery-page .image-collection img{width:100%;height:auto}.gallery-page .image-enlarge{margin-top:10px}@media (width<=900px){.gallery-page .image-collection{columns:2}}@media (width<=550px){.gallery-page .image-collection{columns:1}}
