:root{--bg:#141414;--ink:#f6f4fa;--purple:#a359ee;--brand:#7847ed;--muted:#b9b4c1;--line:#39353f;--display:'Barlow Condensed',Impact,'Arial Narrow',sans-serif;--body:'Space Grotesk',Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:92px}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 var(--body)}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,a,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--purple);outline-offset:6px}::selection{background:var(--purple);color:#141414}.wrap{width:min(1440px,calc(100% - 96px));margin-inline:auto}.nav{position:relative;z-index:10;min-height:102px;display:flex;align-items:center;justify-content:space-between;padding:26px 48px;border-bottom:1px solid var(--line);background:var(--bg)}.nav img{width:148px;height:auto;display:block}.nav nav{display:flex;gap:34px;align-items:center;font-size:14px}.nav nav a{transition:color .2s}.nav nav a:hover{color:var(--purple)}.nav-contact{border:1px solid #7e7788;border-radius:100px;padding:10px 22px}.menu-toggle{display:none}.skip{position:absolute;left:16px;top:-100px;z-index:50;background:#fff;color:#111;padding:10px}.skip:focus{top:10px}.eyebrow{font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin:0 0 26px;font-weight:500}.hero{padding-top:30px}.hero>.eyebrow{display:flex;justify-content:space-between;color:var(--muted);margin-bottom:35px}.hero-title{display:flex;justify-content:space-between;align-items:center;gap:40px;margin-bottom:52px}h1{font:700 clamp(100px,12.8vw,190px)/.83 var(--display);letter-spacing:-.027em;margin:0}h1 span{color:var(--purple)}.hero-aside{width:230px;flex-shrink:0;padding-top:10px}.round-mark{width:90px;height:90px;border-radius:50%;margin-bottom:14px;transform:none}.hero-aside p{font-size:18px;line-height:1.55;color:var(--muted)}.hero-aside strong{color:var(--ink);font-weight:500}.text-link{display:inline-block;font-size:14px;border-bottom:1px solid currentColor;padding-bottom:6px}.text-link:hover{color:var(--purple)}.hero-film{position:relative;overflow:hidden;height:clamp(320px,42vw,590px)}.hero-film>img{width:100%;height:100%;object-fit:cover;object-position:50% 48%}.hero-film:after{content:'';position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#000b)}.film-caption{position:absolute;z-index:1;bottom:30px;left:32px;right:32px;display:flex;justify-content:space-between;align-items:end;font-size:26px;line-height:1.25}.small{font-size:12px;letter-spacing:.1em}.intro{display:grid;grid-template-columns:1fr 2fr;padding-block:110px}.intro>.eyebrow{padding-top:14px;color:var(--purple)}h2{font-size:clamp(35px,4.5vw,64px);line-height:1.08;letter-spacing:-.055em;font-weight:500;margin:0 0 26px}.intro h2 span{color:var(--muted)}.intro>div>p{max-width:630px;font-size:20px;color:var(--muted)}.client-line{border-top:1px solid var(--line);padding-top:28px;margin-top:40px;display:flex;flex-wrap:wrap;gap:22px 38px;font-size:20px;font-weight:600;color:#e1dde8}.work{padding-bottom:110px}.section-head{display:flex;justify-content:space-between;align-items:end;padding-top:40px;border-top:1px solid var(--line);margin-bottom:50px;gap:20px}.section-head .eyebrow{color:var(--purple)}.section-head h2{margin:0}.section-head>p{color:var(--muted);margin:0}.projects{display:grid;grid-template-columns:1fr 1fr;gap:56px 32px}.project{min-width:0}.project:first-child{grid-column:1/-1;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:7%;margin-bottom:22px}.project-image{display:block;padding:0;border:0;background:#251c30;width:100%;aspect-ratio:16/9;overflow:hidden;position:relative;text-align:left}.project-image img{width:100%;height:100%;object-fit:cover;transition:transform .7s}.project-image:hover img{transform:scale(1.035)}.project:first-child .project-image{aspect-ratio:1}.project-image .image-label{position:absolute;bottom:18px;left:18px;color:#fff;background:#141414e8;padding:8px 15px;border:1px solid #ffffff55;border-radius:99px;font-size:12px}.project-copy{padding-top:20px}.project:first-child .project-copy{padding:0}.project-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;gap:16px}.project h3{font-size:32px;line-height:1.1;letter-spacing:-.045em;font-weight:500;margin:15px 0}.project:first-child h3{font-size:clamp(40px,5vw,70px)}.project-description{color:var(--muted);max-width:560px;margin:0 0 22px}.outcome{border-left:2px solid var(--purple);padding-left:16px;font-size:14px;line-height:1.6}.outcome strong{display:block;color:var(--purple);font-size:12px;text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px}.project-copy .text-link{margin-top:15px;background:none;border:0;border-bottom:1px solid #fff;color:var(--ink);padding:0 0 5px}.expertise{background:#291c3e;color:#f6f4fa;padding-block:95px}.expertise-layout{display:grid;grid-template-columns:1fr 1.35fr;gap:7%}.expertise-lead h2{font-size:clamp(50px,5.4vw,80px)}.expertise-lead h2 em{font-style:normal;color:#bca0e1}.expertise-lead>p:last-child{font-size:18px}.services details{border-top:1px solid #ffffff33}.services details:last-child{border-bottom:1px solid #ffffff33}.services summary{display:flex;gap:18px;align-items:center;list-style:none;cursor:pointer;padding:26px 0;font-size:clamp(26px,3vw,40px);line-height:1.15;letter-spacing:-.045em}.services summary::-webkit-details-marker{display:none}.service-number{font-size:12px;letter-spacing:0;align-self:flex-start;margin-top:6px}.plus{width:18px;height:18px;position:relative;margin-left:auto;flex-shrink:0}.plus:before,.plus:after{content:'';position:absolute;background:#f6f4fa;width:18px;height:2px;top:8px}.plus:after{transform:rotate(90deg)}details[open] .plus:after{transform:rotate(0)}.service-copy{padding:0 0 26px 35px}.service-copy p{margin:0 0 20px;max-width:560px}.service-copy ul{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;font-size:14px}.service-copy li{border-top:1px solid #ffffff26;padding-top:10px}.expertise .text-link:hover{color:#fff}.quote{padding-block:110px}.quote>.eyebrow{color:var(--purple)}blockquote{font-size:clamp(30px,4.6vw,66px);line-height:1.18;letter-spacing:-.045em;max-width:1170px;margin:0 0 32px}.quote-credit{display:flex;align-items:center;gap:24px}.quote-rule{width:72px;height:2px;background:var(--purple)}.quote-credit p{font-size:14px;color:var(--muted);line-height:1.65}.quote-credit strong{color:var(--ink);font-weight:500}.quote-credit span{font-size:12px}.about{border-top:1px solid var(--line);padding-top:60px;padding-bottom:110px;display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:center}.about-image{position:relative;height:520px;overflow:hidden}.about-image img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}.about-image>span{position:absolute;bottom:0;left:0;right:0;padding:22px;background:#141414c9;font-size:14px}.about-copy .eyebrow{color:var(--purple)}.about-copy h2{font-size:clamp(35px,4vw,58px)}.about-copy>p:not(.eyebrow){color:var(--muted)}.about-copy .text-link{margin-top:16px}.contact{background:#7847ed;color:white;padding-block:70px}.contact h2{font:700 clamp(80px,11vw,165px)/.85 var(--display);letter-spacing:-.025em;margin-bottom:45px}.contact h2 span{color:#251147}.contact-bottom{display:flex;justify-content:space-between;align-items:end;gap:24px}.contact-bottom p{margin:0}.contact-bottom>a{font-size:clamp(24px,4vw,52px);letter-spacing:-.045em;border-bottom:2px solid #fff}.footer{display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:130px;font-size:12px;color:var(--muted)}.footer img{height:auto}.footer>a:last-child{font-size:14px}dialog{background:#1a171e;color:var(--ink);border:1px solid #64596e;border-radius:3px;width:min(1100px,calc(100% - 32px));max-height:92dvh;padding:28px;overflow:auto}dialog::backdrop{background:#000d;backdrop-filter:blur(8px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:15px}.dialog-top .eyebrow{margin:0;color:var(--purple)}.close{background:transparent;color:white;border:1px solid #756a80;border-radius:99px;padding:8px 16px;min-height:44px}dialog h2{font-size:36px;margin:20px 0}.viewer{position:relative;background:#0c0c0c;display:grid;grid-template-columns:48px 1fr 48px;align-items:center}.viewer>img{width:100%;height:min(55vh,570px);object-fit:contain}.viewer button{background:#28222f;color:#fff;border:0;font-size:36px;height:64px}.viewer button:disabled{opacity:.35}.gallery-bottom{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-block:12px;font-size:14px}#thumbnails{display:flex;gap:8px;flex-wrap:wrap}#thumbnails button{padding:0;border:2px solid transparent;background:none;width:60px;height:40px}#thumbnails button[aria-current=true]{border-color:var(--purple)}#thumbnails img{width:100%;height:100%;object-fit:cover}#dialog-description{color:var(--muted)}
@media(min-width:1800px){.nav{padding-inline:max(48px,calc((100vw - 1440px)/2))}}@media(max-width:1000px){.wrap{width:calc(100% - 56px)}.nav{padding-inline:28px}.hero-aside{width:195px}.hero-aside p{font-size:16px}.round-mark{width:70px;height:70px}.intro{grid-template-columns:1fr 2.5fr}.expertise-layout{gap:5%}.service-copy ul{grid-template-columns:1fr}.about-image{height:430px}}@media(max-width:700px){html{scroll-padding-top:20px}.wrap{width:calc(100% - 36px)}.nav{padding:20px 18px;min-height:80px;flex-wrap:wrap}.nav img{width:125px}.menu-toggle{display:block;border:1px solid #786c85;background:none;color:var(--ink);border-radius:99px;padding:8px 18px;min-height:44px;font-size:14px}.nav nav{display:none;width:100%;flex-direction:column;align-items:stretch;gap:0;padding-top:20px}.nav nav.is-open{display:flex}.nav nav a{padding:12px 0;border-top:1px solid var(--line)}.nav nav .nav-contact{border:0;border-top:1px solid var(--line);border-radius:0}.hero{padding-top:24px}.hero>.eyebrow{font-size:10px;line-height:1.6;margin-bottom:30px}.hero>.eyebrow>span:last-child{display:none}.hero-title{display:block;margin-bottom:28px}h1{font-size:clamp(82px,19vw,132px)}.hero-aside{display:flex;align-items:center;justify-content:space-between;width:100%;gap:20px;margin-top:24px}.round-mark{display:none}.hero-aside p{margin:0;font-size:15px}.hero-aside p br{display:none}.hero-aside p{max-width:245px}.hero-aside .text-link{flex-shrink:0;font-size:12px}.hero-film{height:350px}.hero-film img{object-position:55% 50%}.film-caption{left:18px;right:18px;bottom:20px;font-size:19px}.film-caption .small{display:none}.intro{display:block;padding-block:65px}.intro h2{font-size:39px}.intro>div>p{font-size:17px}.client-line{font-size:16px;gap:18px 25px}.section-head{display:block;padding-top:30px;margin-bottom:30px}.section-head h2{font-size:40px}.section-head>p{font-size:14px;margin-top:20px}.section-head>p br{display:none}.projects{grid-template-columns:1fr;gap:38px}.project:first-child{display:block;grid-column:auto;margin:0}.project:first-child .project-copy{padding-top:20px}.project:first-child h3{font-size:40px}.project h3{font-size:30px}.project-meta{font-size:12px}.work{padding-bottom:65px}.expertise{padding-block:60px}.expertise-layout{display:block}.expertise-lead h2{font-size:56px}.expertise-lead h2 br:nth-of-type(2){display:none}.expertise-lead>p:last-child{font-size:16px;margin-bottom:35px}.services summary{font-size:30px}.service-copy{padding-left:30px}.service-copy ul{grid-template-columns:1fr}.quote{padding-block:65px}blockquote{font-size:35px}.quote-rule{width:30px}.quote-credit{gap:14px}.quote-credit p{font-size:12px}.about{display:flex;flex-direction:column;gap:32px;padding-top:35px;padding-bottom:65px}.about-image{height:350px;width:100%}.about-copy h2{font-size:40px}.contact{padding-block:50px}.contact h2{font-size:clamp(69px,16vw,110px)}.contact-bottom{display:block}.contact-bottom>a{display:inline-block;margin-top:28px;font-size:32px}.footer{flex-wrap:wrap;gap:18px;padding-block:30px}.footer img{width:105px}.footer p{margin:0}.footer>a:last-child{width:100%}dialog{padding:18px}dialog h2{font-size:28px}.viewer{grid-template-columns:32px 1fr 32px}.viewer>img{height:36vh}.viewer button{font-size:28px;height:50px}.gallery-bottom{align-items:start}#thumbnails button{width:44px;height:32px}.gallery-bottom p{min-width:40px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}

.hero>.eyebrow{gap:24px;align-items:flex-start}.hero>.eyebrow>span:last-child{max-width:650px;text-align:right;text-transform:none}.hero>.eyebrow>span:first-child{flex-shrink:0}@media(max-width:1000px) and (min-width:701px){.hero>.eyebrow{flex-direction:column;gap:10px}.hero>.eyebrow>span:last-child{text-align:left;max-width:none}}

/* Complete case-study copy beside the gallery, stacking on small screens. */
dialog{width:min(1380px,calc(100% - 32px))}.dialog-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,1fr);gap:30px;align-items:start}.dialog-media,.dialog-copy{min-width:0}.dialog-copy{font-size:16px;line-height:1.7}.dialog-copy p:first-child{margin-top:0}.dialog-copy p:last-child{margin-bottom:0}.dialog-copy #dialog-description{color:#d8d2df}.dialog-layout .viewer>img{height:min(52vh,560px)}.dialog-layout .gallery-bottom{align-items:flex-start;flex-wrap:wrap}
@media(max-width:900px){.dialog-layout{grid-template-columns:1fr;gap:22px}.dialog-layout .viewer>img{height:40vh}}
@media(max-width:700px){.hero-aside{display:grid;grid-template-columns:64px minmax(0,1fr);gap:16px;align-items:center}.hero-aside .round-mark{display:block;width:64px;height:64px;margin:0;grid-column:1;grid-row:1}.hero-aside p{grid-column:2;max-width:none}.hero-aside .text-link{grid-column:2;justify-self:start}.nav>a:first-child{display:block;flex-shrink:0}.nav img{display:block;visibility:visible}.dialog-copy{font-size:16px}}

/* Gallery photographs use their own proportions, without a letterbox frame. */
#project-dialog .viewer{display:block;background:transparent}
#project-dialog .viewer>img{display:block;width:100%;height:auto;max-height:none;object-fit:initial}
.gallery-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:14px}
.gallery-controls p{margin:0;font-size:14px}
.gallery-arrows{display:flex;gap:10px}
.gallery-arrows button{display:grid;place-items:center;width:48px;height:44px;border:1px solid #756a80;border-radius:4px;background:#28222f;color:#fff;font-size:30px;line-height:1}
.gallery-arrows button:hover{background:#41304f}
.gallery-arrows button:disabled{opacity:.35;cursor:default}
#project-dialog .gallery-bottom{margin-top:16px}

/* Tagline belongs to the main headline, with service information secondary. */
.hero-services{margin:0 0 30px;text-align:right;color:var(--muted);font-size:12px;line-height:1.6}
.hero-heading{min-width:0}
.hero-tagline{margin:0 0 22px;font:600 clamp(22px,2.25vw,34px)/1.15 var(--display);letter-spacing:.055em;text-transform:uppercase;color:var(--ink);max-width:850px}
.about .about-image{height:auto}
.about .about-image img{display:block;width:100%;height:auto;object-fit:contain;filter:none}
@media(max-width:700px){.hero-services{display:none}.hero-tagline{font-size:clamp(20px,5.1vw,28px);line-height:1.2;letter-spacing:.035em;margin-bottom:20px;max-width:100%}.about .about-image{height:auto}}

.about .about-image img{aspect-ratio:4/5;object-fit:cover;object-position:center 58%}

/* Restrained motion: short entrances, tactile controls, no looping distractions. */
.services .plus{isolation:isolate;transition:transform .25s ease}
.services .plus::before,.services .plus::after{transition:transform .25s ease,background-color .25s ease}
.services summary:focus-visible .plus{transform:scale(1.15)}
.services.is-in-view details:not([open]) .plus{animation:service-invitation 4.8s ease-in-out 1}
@keyframes service-invitation{0%,32%,56%,100%{transform:scale(1)}16%,72%{transform:scale(1.2)}}
@keyframes content-arrival{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.services details[open] .service-copy{animation:content-arrival .25s ease-out both}
#project-dialog[open]{animation:content-arrival .22s ease-out both}
.text-link{transition:color .2s ease,border-color .2s ease,transform .25s ease}
.project-image .image-label{transition:transform .3s ease,background-color .3s ease,border-color .3s ease}
.nav-contact,.close{transition:background-color .2s ease,border-color .2s ease}
@media(hover:hover){
 .services summary:hover .plus{transform:scale(1.15);animation:none}
 .services summary:hover .plus::before,.services summary:hover .plus::after{background:#cdb4ee}
 .text-link:hover{transform:translateX(3px)}
 .project-image:hover .image-label{transform:translateY(-3px);background:#291c3ef2;border-color:#bca0e1}
 .nav-contact:hover,.close:hover{background:#291c3e;border-color:#bca0e1}
}
@media(prefers-reduced-motion:reduce){
 .services .plus,.services summary:hover .plus,.services summary:focus-visible .plus,.text-link:hover,.project-image:hover img,.project-image:hover .image-label{transform:none}
 .services .plus::before,.services .plus::after{transition:none!important}
}

/* Start reveals well inside the viewport and leave time to see the movement. */
.motion-reveal{transition:opacity .95s ease,transform 1.05s cubic-bezier(.22,.61,.36,1)}
.motion-pending{opacity:0;transform:translateY(32px)}
@media(prefers-reduced-motion:reduce){.motion-reveal,.motion-pending{opacity:1;transform:none;transition:none!important}}
@media print{.motion-pending{opacity:1;transform:none}}