:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;color:#1d1d1f;background:#fff;font-synthesis:none;scroll-behavior:smooth;--muted:#6e6e73;--blue:#0066cc;--line:#d2d2d7}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}p{line-height:1.5;margin:0 0 1.25rem}h1,h2,h3,h4{margin:0;letter-spacing:-.04em;font-weight:650}em{font-style:normal}img{display:block;width:100%;height:auto}a:focus-visible,summary:focus-visible{outline:3px solid #0071e3;outline-offset:5px}section[id]{scroll-margin-top:80px}.wrap{max-width:1280px;margin-inline:auto;padding-inline:48px}.skip{position:fixed;z-index:30;top:12px;left:12px;background:white;color:#111;padding:14px;transform:translateY(-180%)}.skip:focus{transform:none}
.header{position:sticky;top:0;z-index:20;max-width:none;display:flex;align-items:center;justify-content:space-between;min-height:64px;padding:10px max(32px,calc((100vw - 1184px)/2));background:#ffffffeb;backdrop-filter:blur(20px);border-bottom:1px solid #00000012}.identity{display:flex;gap:10px;align-items:center;font-size:.875rem;font-weight:600;line-height:1.15}.identity br{display:none}.monogram{font-size:1.5rem;letter-spacing:-.1em;font-weight:700;margin-right:4px}.identity>span:last-child{max-width:190px}.header nav{display:flex;gap:32px;align-items:center;font-size:.8125rem}.header nav a:not(.nav-contact):hover{color:var(--blue)}.nav-contact{background:#0071e3;color:#fff;border-radius:30px;padding:9px 17px}.nav-contact:hover{background:#0077ed}.nav-contact span{margin-left:8px}
.hero{text-align:center;padding-top:80px;padding-bottom:0;overflow:hidden}.eyebrow{font-size:.875rem;letter-spacing:.015em;font-weight:600;margin-bottom:22px;color:var(--muted)}h1{font-size:clamp(3.3rem,6.8vw,6.5rem);line-height:1.04;letter-spacing:-.065em}h1 em{color:#707075}.hero-bottom{display:flex;flex-direction:column;align-items:center;gap:25px;margin-top:28px}.hero-bottom p{max-width:600px;font-size:1.3125rem;line-height:1.45;margin:0;color:#515155}.button{display:inline-flex;gap:18px;align-items:center;justify-content:center;border-radius:30px;background:#0071e3;color:#fff;padding:15px 25px;font-size:1rem;transition:background .2s}.button:hover{background:#0077ed}.button span{font-size:1.25rem}.hero-gallery{display:flex;align-items:center;justify-content:center;gap:20px;margin:62px auto 0;max-width:1120px;padding:0 0 35px}.hero-gallery img{width:30%;border:1px solid #d2d2d7;border-radius:12px;box-shadow:0 18px 40px #00000014}.hero-gallery img:nth-child(2){width:38%;position:relative;z-index:1;box-shadow:0 22px 50px #0000001c}.hero-foot{display:flex;justify-content:center;gap:24px;font-size:.8125rem;color:var(--muted);padding:25px 0 35px}.hero-foot span+span{padding-left:24px;border-left:1px solid var(--line)}
.work{max-width:none;background:#f5f5f7;padding:72px 24px 24px}.section-head{max-width:1184px;margin:0 auto 42px;display:flex;justify-content:space-between;gap:24px;align-items:end}.section-head h2{font-size:3rem;line-height:1.1}.count{font-size:1rem;letter-spacing:0;color:var(--muted);vertical-align:middle}.section-head p{color:var(--muted);font-size:1rem;max-width:290px;margin:0}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:1392px;margin:auto;align-items:start}.project{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0;background:#fff;border-radius:24px;overflow:hidden;padding:48px 34px 22px}.project:first-child,.project:last-child{grid-column:1/-1}.project:first-child{background:#101012;color:#f5f5f7}.project-title{order:0;display:flex;align-items:center;gap:10px;justify-content:center}.project-title h3{font-size:2.625rem;line-height:1.1}.project-title>span{font-size:.75rem;color:#86868b;align-self:start}.project-kind{order:1;font-size:1.625rem;line-height:1.2;margin:14px 0}.project>p:not(.project-kind){order:2;color:var(--muted);max-width:480px;font-size:1rem;margin:0 0 16px}.project:first-child>p:not(.project-kind){color:#a1a1a6}.tags{order:3;list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;padding:0;margin:0 0 30px;font-size:.8125rem;color:var(--muted)}.project:first-child .tags{color:#a1a1a6}.project-image{order:4;display:block;max-width:850px;width:100%;margin:0 auto 25px;background:none}.project-image img{border-radius:10px;border:1px solid #0000000a;box-shadow:0 12px 38px #00000010;transition:transform .3s}.project-image:hover img{transform:translateY(-4px)}.project:first-child .project-image{max-width:880px}.project:first-child .project-title h3,.project:last-child .project-title h3{font-size:3.5rem}.project:last-child{background:#eaf0f8}.project:last-child .project-image{max-width:800px}
details{order:5;width:100%;max-width:850px;text-align:left;border-top:1px solid #00000012}summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;min-height:54px;font-size:.9375rem;color:var(--blue);padding:14px 0}summary::-webkit-details-marker{display:none}summary span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#e8e8ed;color:#424245;font-size:1.25rem;flex-shrink:0}details[open] summary span{transform:rotate(45deg)}.project:first-child details{border-color:#ffffff25}.project:first-child summary{color:#2997ff}.project:first-child summary span{background:#333336;color:white}.case{padding:12px 0 20px}.case h4{font-size:1rem;font-weight:600;letter-spacing:-.015em;margin-bottom:7px}.case p{font-size:1rem;line-height:1.55;color:var(--muted);margin-bottom:22px}.project:first-child .case p{color:#a1a1a6}.text-link{color:var(--blue);font-size:.9375rem;text-decoration:underline;text-underline-offset:4px}
.services{padding:110px 0;background:#fff}.services-layout>div:first-child{max-width:650px}.services h2,.about h2{font-size:clamp(2.5rem,4.4vw,3.6rem);line-height:1.08}.services-layout>div>p:last-child{color:var(--muted);font-size:1.25rem;margin:24px 0 0;max-width:570px}.service-list{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:60px}.service-list>div{border-top:1px solid var(--line);padding-top:24px}.service-list>div>span{display:block;color:var(--blue);font-size:.875rem;margin-bottom:20px}.service-list h3{font-size:1.5rem;line-height:1.15;margin-bottom:16px}.service-list p{color:var(--muted);font-size:1rem;margin:0}.about{display:grid;grid-template-columns:1fr 1fr;gap:80px;padding-block:80px 110px;border-top:1px solid #e8e8ed}.about-copy{font-size:1.1875rem;color:var(--muted)}.about-copy p:last-child{margin-bottom:0}.contact{max-width:none;background:#f5f5f7;text-align:center;padding-block:95px}.contact>div{display:flex;align-items:center;flex-direction:column;gap:30px}.contact h2{font-size:clamp(3rem,5.8vw,5rem);line-height:1.06}.contact h2 em{color:#6e6e73}.contact-note{font-size:1rem;color:var(--muted);max-width:480px;margin:26px auto 0}.footer{display:flex;justify-content:space-between;gap:20px;padding-block:24px;color:var(--muted);font-size:.75rem}.footer a:hover{text-decoration:underline}
@media(max-width:850px){.wrap{padding-inline:28px}.header{padding-inline:28px}.hero{padding-top:64px}.hero-gallery{gap:12px;margin-top:48px}.section-head h2{font-size:2.5rem}.work{padding:55px 16px 16px}.project-grid{gap:16px}.project{padding:36px 22px 14px;border-radius:20px}.project-title h3{font-size:2rem}.project-kind{font-size:1.25rem}.project:first-child .project-title h3,.project:last-child .project-title h3{font-size:2.75rem}.services{padding-block:75px}.service-list{gap:25px}.service-list h3{font-size:1.25rem}.about{gap:35px;padding-block:65px}.contact{padding-block:70px}}
@media(max-width:580px){.wrap{padding-inline:22px}.header{padding:10px 18px;min-height:60px}.identity{font-size:.75rem;gap:4px}.identity>span:last-child{max-width:100px}.monogram{font-size:1.25rem;margin-right:7px}.header nav{gap:18px;font-size:.75rem}.header nav a:nth-child(2){display:none}.nav-contact{padding:8px 12px}.nav-contact span{display:none}.hero{padding-top:48px}.eyebrow{font-size:.75rem;margin-bottom:20px}h1{font-size:clamp(2.6rem,9.8vw,3.6rem);letter-spacing:-.055em}.hero-bottom{margin-top:25px;gap:24px}.hero-bottom p{font-size:1.0625rem;max-width:340px}.button{font-size:.9375rem;padding:13px 22px}.hero-gallery{margin-top:38px;gap:8px;padding-bottom:10px}.hero-gallery img{border-radius:5px;box-shadow:0 8px 20px #00000012}.hero-gallery img:nth-child(2){width:42%;box-shadow:0 10px 25px #00000015}.hero-gallery img:first-child,.hero-gallery img:last-child{width:27%}.hero-foot{flex-direction:column;gap:8px;padding:20px 0 30px;font-size:.75rem}.hero-foot span+span{border:0;padding:0}.work{padding:40px 12px 12px}.section-head{padding-inline:10px;flex-direction:column;align-items:start;gap:13px;margin-bottom:28px}.section-head h2{font-size:2rem}.section-head p{font-size:.875rem;max-width:none}.project-grid{grid-template-columns:1fr;gap:12px}.project{padding:32px 20px 12px;border-radius:16px}.project-title h3,.project:first-child .project-title h3,.project:last-child .project-title h3{font-size:2.125rem}.project-kind{font-size:1.375rem;margin:12px 0}.project>p:not(.project-kind){font-size:.9375rem}.project-image{margin-bottom:15px}.project-image img{border-radius:6px}.tags{margin-bottom:22px;font-size:.75rem;gap:8px 12px}.services{padding-block:60px}.services h2,.about h2{font-size:2.4rem}.services-layout>div>p:last-child{font-size:1.0625rem}.service-list{grid-template-columns:1fr;gap:28px;margin-top:35px}.service-list>div{display:flex;gap:22px}.service-list>div>span{padding-top:3px}.service-list h3{font-size:1.3125rem;margin-bottom:10px}.about{grid-template-columns:1fr;gap:25px;padding-block:50px}.about-copy{font-size:1.0625rem}.contact{padding-block:60px}.contact h2{font-size:2.6rem}.contact-note{font-size:.875rem}.footer{font-size:.6875rem;gap:12px}.case p{font-size:.9375rem}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*{transition:none!important}}

/* Theme control and Graphite Blue palette. */
:root{color-scheme:light}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:40px;height:40px;padding:0;border:1px solid #d2d2d7;border-radius:50%;background:transparent;color:#515155;cursor:pointer;transition:background .2s,color .2s}.theme-toggle[hidden]{display:none}.theme-toggle:hover{background:#e8e8ed;color:#1d1d1f}.theme-toggle:focus-visible{outline:3px solid #0071e3;outline-offset:4px}.theme-toggle svg{width:20px;height:20px}.icon-sun{display:none}
html[data-theme="dark"]{color-scheme:dark;background:#101012;color:#f5f5f7;--muted:#a6a6ad;--blue:#2997ff;--line:#38383e}html[data-theme="dark"] body{background:#101012}html[data-theme="dark"] .header{background:#101012eb;border-color:#38383e}html[data-theme="dark"] h1 em,html[data-theme="dark"] .contact h2 em{color:#92929b}html[data-theme="dark"] .hero-bottom p{color:#a6a6ad}html[data-theme="dark"] .nav-contact,html[data-theme="dark"] .button{background:#0071e3;color:#ffffff}html[data-theme="dark"] .nav-contact:hover,html[data-theme="dark"] .button:hover{background:#0071e3;filter:brightness(1.12)}html[data-theme="dark"] .work,html[data-theme="dark"] .contact{background:#19191c}html[data-theme="dark"] .project{background:#222225;color:#f5f5f7}html[data-theme="dark"] .project:first-child,html[data-theme="dark"] .project:last-child{background:#161619;color:#f5f5f7}html[data-theme="dark"] .project:first-child>p:not(.project-kind),html[data-theme="dark"] .project:first-child .tags,html[data-theme="dark"] .project:first-child .case p,html[data-theme="dark"] .project-title>span{color:#a6a6ad}html[data-theme="dark"] .project:first-child summary{color:#2997ff}html[data-theme="dark"] .services{background:#101012}html[data-theme="dark"] .about,html[data-theme="dark"] details,html[data-theme="dark"] .project:first-child details{border-color:#38383e}html[data-theme="dark"] summary span,html[data-theme="dark"] .project:first-child summary span{background:#38383e;color:#f5f5f7}html[data-theme="dark"] .hero-gallery img,html[data-theme="dark"] .project-image img{border-color:#38383e;box-shadow:0 18px 45px #00000040}html[data-theme="dark"] a:focus-visible,html[data-theme="dark"] summary:focus-visible{outline-color:#2997ff}
html[data-theme="dark"] .theme-toggle{border-color:#38383e;color:#a6a6ad}html[data-theme="dark"] .theme-toggle:hover{background:#29292e;color:#f5f5f7}html[data-theme="dark"] .theme-toggle:focus-visible{outline-color:#2997ff}html[data-theme="dark"] .icon-moon{display:none}html[data-theme="dark"] .icon-sun{display:block}
@media(max-width:580px){.header{gap:8px}.header nav{gap:10px}.theme-toggle{width:36px;height:36px}.theme-toggle svg{width:18px;height:18px}}
@media(max-width:360px){.header{padding-inline:14px}.header nav{gap:8px}.identity{font-size:.6875rem}.identity>span:last-child{max-width:85px}.monogram{margin-right:3px}.nav-contact{padding-inline:10px}}

/* Two-part contact button: the joined pill separates into profile links. */
.contact-split{position:relative;flex:none;width:132px;height:44px;isolation:isolate}
.contact-trigger{position:absolute;inset:0;z-index:2;border:0;border-radius:30px;background:transparent;color:#fff;font:inherit;cursor:pointer;transition:opacity .16s,transform .3s}
.contact-trigger>span{display:inline-block;margin-left:8px;transition:transform .35s}
.contact-profiles{position:absolute;inset:0;display:flex}
.header nav .profile-link{position:relative;display:flex;align-items:center;justify-content:center;width:50%;height:44px;background:#0071e3;color:#fff;border-radius:24px 0 0 24px;transform-origin:center;transition:transform .4s cubic-bezier(.2,.8,.2,1),border-radius .3s,background .2s}
.header nav .profile-contra{border-radius:0 24px 24px 0}
.profile-link span{font-size:12px;font-weight:600;opacity:0;transform:translateY(6px) scale(.85);transition:opacity .15s,transform .3s}
.contact-split.is-open .contact-trigger{opacity:0;transform:scale(.8);pointer-events:none}
.contact-split.is-open .profile-upwork{border-radius:24px;transform:translateX(-3px) rotate(-4deg)}
.contact-split.is-open .profile-contra{border-radius:24px;transform:translateX(3px) rotate(4deg)}
.contact-split.is-open .profile-link span{opacity:1;transform:translateY(0) scale(1);transition-delay:.1s}
.header nav .profile-link:hover{background:#005bb8;color:#fff;transform:translateX(-3px) rotate(0) translateY(-2px)}
.header nav .profile-contra:hover{transform:translateX(3px) rotate(0) translateY(-2px)}
.contact-trigger:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
.contact-split.is-open .contact-trigger:focus-visible{outline:0}
.contact-split:has(.contact-trigger:focus-visible){outline:3px solid var(--blue);outline-offset:5px;border-radius:24px}
@media(max-width:580px){.contact-split{width:88px}.profile-link span{font-size:10px}.contact-trigger>span{display:none}.header nav{gap:9px}}
@media(max-width:360px){.header{padding-inline:12px;gap:6px}.header nav{gap:8px}.identity>span:last-child{max-width:70px}}
@media(prefers-reduced-motion:reduce){.contact-split *{transition:none!important}.contact-split.is-open .profile-link{transform:translateX(-3px)}.contact-split.is-open .profile-contra{transform:translateX(3px)}}

@media(max-width:580px){.header nav .contact-profiles .profile-link{display:flex}}

/* Approved contact logos, labels and stable disclosure icons. */
.profile-symbol{display:flex;align-items:center;justify-content:center}.profile-logo{display:block;width:24px;height:24px}.profile-contra .profile-logo{width:22px;height:22px}@media(max-width:580px){.profile-logo{width:22px;height:22px}.profile-contra .profile-logo{width:20px;height:20px}}
.profile-symbol{flex-direction:column;gap:2px;line-height:1}.profile-logo,.profile-contra .profile-logo{width:19px;height:19px}.profile-caption{display:block;font-size:10px;font-weight:600;line-height:12px;letter-spacing:0}@media(max-width:580px){.profile-logo,.profile-contra .profile-logo{width:18px;height:18px}.profile-caption{font-size:9px;line-height:11px}}
.header nav .contact-profiles a.profile-link:hover{color:#fff}

/* Keep disclosure controls non-selectable and the plus/minus geometrically centered. */
summary,summary *{-webkit-user-select:none;user-select:none;caret-color:transparent}
summary .case-toggle-icon,details[open] summary .case-toggle-icon{position:relative;display:block;width:28px;height:28px;flex:0 0 28px;transform:none;line-height:0}
.case-toggle-icon svg{position:absolute;top:50%;left:50%;width:16px;height:16px;transform:translate(-50%,-50%);stroke:currentColor;stroke-width:1.6;stroke-linecap:round;pointer-events:none}
details[open] .case-toggle-vertical{visibility:hidden}


/* Hide the text caret on page content while keeping text selection and focus outlines. */
:root{caret-color:transparent}
input,textarea,[contenteditable]:not([contenteditable="false"]){caret-color:auto}


/* A circular reveal originating at the existing theme button. */
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-image-pair(root){isolation:isolate}
::view-transition-old(root){z-index:1}
::view-transition-new(root){z-index:2}
::view-transition-group(root){animation-duration:0s}



/* Animate one masked disc into the sun, with rays that unfold around it. */
.theme-toggle{view-transition-name:theme-control}
.theme-toggle .theme-morph{display:block;width:22px;height:22px;overflow:visible;transform:rotate(-12deg);transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.celestial-disc{transform-origin:12px 12px;transform:scale(1);transition:transform .48s cubic-bezier(.2,.8,.2,1)}
.moon-cutout{transform:translate(0,0);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.sun-rays{transform-origin:12px 12px;transform:rotate(-45deg) scale(.55);opacity:0;transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .2s}
html[data-theme="dark"] .theme-morph{transform:rotate(0deg)}
html[data-theme="dark"] .celestial-disc{transform:scale(.48)}
html[data-theme="dark"] .moon-cutout{transform:translate(12px,-12px)}
html[data-theme="dark"] .sun-rays{transform:rotate(0deg) scale(1);opacity:1;transition-delay:.08s}
::view-transition-group(theme-control){animation-duration:0s;z-index:3}
::view-transition-old(theme-control){display:none}
::view-transition-new(theme-control){animation:none;mix-blend-mode:normal}
@media(max-width:580px){.theme-toggle .theme-morph{width:20px;height:20px}}
@media(prefers-reduced-motion:reduce){.theme-toggle .theme-morph,.celestial-disc,.moon-cutout,.sun-rays{transition:none!important}}


/* Approved scrollable Forma cover. */

.project .scroll-preview{aspect-ratio:4/3;overflow-y:scroll;overflow-x:hidden;min-height:0;border-radius:10px;border:1px solid var(--line);box-shadow:0 12px 38px #00000020;scrollbar-gutter:stable;scrollbar-color:#85858e #e8e8ed;overscroll-behavior-y:contain;scroll-behavior:auto}
html[data-theme="dark"] .scroll-preview{scrollbar-color:#86868f #29292e}
.scroll-preview::-webkit-scrollbar{width:12px}.scroll-preview::-webkit-scrollbar-track{background:#e8e8ed}.scroll-preview::-webkit-scrollbar-thumb{background:#85858e;border:3px solid #e8e8ed;border-radius:12px}
html[data-theme="dark"] .scroll-preview::-webkit-scrollbar-track{background:#29292e}html[data-theme="dark"] .scroll-preview::-webkit-scrollbar-thumb{border-color:#29292e}
.project .scroll-preview img,.project .scroll-preview:hover img{width:100%;height:auto;max-width:none;border:0;border-radius:0;box-shadow:none;transform:none;transition:none;display:block}
.scroll-preview>a{display:block}.scroll-preview:focus-visible{outline:3px solid var(--blue);outline-offset:5px}
@media(max-width:580px){.project .scroll-preview{border-radius:6px}}