:root{font-family:'DM Sans',Arial,sans-serif;--cyan:#70d6ee;--gold:#e8bf73;--bg:#080e16;--panel:#111c29;--text:#f1f4f5;--muted:#b0bdca}
.wrap{width:min(1280px,90%)}
.desktop-screen{display:flex;align-items:center;padding:16px;background:#201830}.desktop-screen img{width:100%;height:auto;border-radius:3px}.showcase-project:has(.desktop-screen){grid-column:span 3}.showcase-project:has(.desktop-screen) .project-visual{height:370px;padding:20px}.showcase-project:has(.desktop-screen) .project-copy{max-width:680px}
.header{height:100px}.brand{font-family:'DM Sans',sans-serif;letter-spacing:.035em}.brand-ev{letter-spacing:-.08em}.header nav{font-size:15px}
.button{border-radius:3px;font-size:15px;font-weight:600}.button.small{padding:12px 19px}
.service-bar{background:transparent;padding:20px 0}.service-bar .eyebrow{font-size:12px;letter-spacing:.14em}.quick-links{gap:0}.quick-links>a{background:transparent;border:0;border-right:1px solid var(--line);border-radius:0;padding:10px 18px;font-size:14px}.quick-links>a:first-child{padding-left:0}.quick-links>a:last-child{border:0}.quick-links>a:hover{background:#15232e}
.eyebrow,.kicker{font-size:12px;letter-spacing:.13em;font-weight:500}.hero{padding-block:80px;gap:60px;grid-template-columns:1.15fr 1fr}.hero h1{font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:clamp(54px,5.4vw,80px);letter-spacing:-.035em;line-height:1.03;margin-bottom:28px}.hero h1 span{font-style:italic;color:#b5e4ee}.hero-copy>p:not(.eyebrow){font-size:18px;line-height:1.7;max-width:470px}.hero-copy .call-note{font-size:14px!important}.motion-card{height:390px;border-radius:4px}.motion-title{font-family:'Newsreader',Georgia,serif;font-size:36px;font-weight:400;bottom:55px}.motion-title strong{font-weight:400;font-style:italic}.motion-label,.motion-card figcaption{font-size:12px}
.work-section{padding:72px 0 64px;border-top:1px solid var(--line)}.section-heading{margin-bottom:46px;gap:50px;align-items:end}.section-heading h2{font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:clamp(40px,4.3vw,60px);letter-spacing:-.025em;line-height:1.08}.section-heading h2 em{font-weight:400;color:#b5e4ee}.section-heading>p{font-size:16px;max-width:340px}.section-heading .eyebrow{margin-bottom:22px}
.showcase-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:48px 28px}.showcase-project{grid-column:span 2;min-width:0}.showcase-project.featured{grid-column:span 3}.project-visual{display:block;position:relative;overflow:hidden;background:#14222e;border:1px solid #293c4b;height:370px;border-radius:4px}.project-visual img{display:block;transition:transform .35s ease;max-width:100%}.project-visual:hover img{transform:translateY(-5px)}.phone-screen{display:flex;justify-content:center;padding-top:26px;background:linear-gradient(155deg,#192d3d,#0e1925)}.phone-screen img{width:226px;height:auto;align-self:flex-start;border:1px solid #52616c;border-radius:18px;box-shadow:0 14px 36px #0007;margin-top:-20px}.web-screen{height:370px;padding:20px 20px 0;background:#122733}.web-screen img{width:100%;height:auto;border:1px solid #354855;border-radius:3px}.showcase-project:nth-child(4n) .project-visual{background:#162b27}.showcase-project:nth-child(4n+1) .phone-screen{background:#2c2420}.showcase-project:nth-child(4n+2) .phone-screen{background:#1f2338}.project-copy{padding:24px 0 0}.project-copy .kicker{font-size:12px;margin-bottom:12px;color:#9fbdcd;letter-spacing:.08em}.project-copy h3{font-family:'DM Sans',sans-serif;font-weight:500;font-size:25px;letter-spacing:-.025em;margin:0 0 12px;line-height:1.25}.featured .project-copy h3{font-size:30px}.project-copy>p:not(.kicker){font-size:16px;line-height:1.75;color:var(--muted);margin:0 0 18px;max-width:520px}.project-link{font-size:14px;line-height:1.6;color:var(--cyan);font-weight:500}.project-link span{display:inline-block;margin-left:8px}
.more-projects{margin-top:52px;border-top:1px solid var(--line)}.more-projects>summary{padding:25px 0;justify-content:space-between;font-size:16px;color:var(--text)}.portfolio-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.project-card{border-radius:3px;background:#101b27}.project-card>a{padding:28px}.project-card h3{font-family:'DM Sans',sans-serif;font-size:22px;font-weight:500}.project-card p:not(.kicker){font-size:16px}.project-card .kicker{font-size:12px;line-height:1.7}.project-card .project-link{font-size:14px}
.enquiry-band{padding:65px 0;background:#111e2a}.enquiry-intro h2{font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:clamp(40px,4.2vw,56px);letter-spacing:-.025em}.enquiry-intro p:not(.eyebrow),.email{font-size:16px}label{font-size:14px}.optional,.form-note{font-size:13px}input,textarea,select{border-radius:3px}input,select{min-height:47px}.form-note{line-height:1.7}.information{padding-top:30px}.information summary{font-size:17px;padding:25px 0}.information .detail-body{font-size:16px}.price-grid strong,.process strong{font-size:20px;font-weight:500}.service-detail{border-radius:3px}.detail-body{font-size:16px}.text-link{font-size:15px}footer{font-size:14px;padding-block:30px}footer>div{flex-wrap:wrap}.information h3{font-family:'Newsreader',Georgia,serif;font-size:30px;font-weight:500}
dialog{border-radius:6px;padding:34px;background:#0e1a26}dialog h3{font-family:'Newsreader',Georgia,serif;font-size:42px;font-weight:400;margin-bottom:20px}dialog p{font-size:16px}dialog .case-actions a{font-size:15px}.screenshot-dialog{width:min(950px,94vw)}.case-gallery{display:flex;justify-content:center;align-items:flex-start;gap:20px;background:#07101a;padding:20px;overflow:auto;border:1px solid var(--line);margin-top:25px}.case-gallery img{max-width:100%;width:auto;max-height:680px;border-radius:4px;object-fit:contain}.case-gallery:has(img:nth-child(2)) img{max-width:48%}.close-dialog{width:42px;height:42px;z-index:1}.access-note{font-size:14px;color:var(--muted)}
@media(max-width:1000px){.hero{gap:28px;padding-block:55px}.hero h1{font-size:58px}.motion-card{height:340px}.showcase-project{grid-column:span 3}.quick-links>a:nth-child(3){border-right:0}.quick-links>a:nth-child(4){padding-left:0}.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-heading{gap:24px}.project-visual,.web-screen{height:335px}.phone-screen img{width:215px}}
@media(max-width:650px){.header{height:78px}.header nav{gap:12px}.header .brand{font-size:12px}.hero{grid-template-columns:1fr;padding-block:44px;gap:32px}.hero h1{font-size:clamp(47px,11vw,66px);line-height:1.07}.hero .eyebrow{font-size:12px}.hero-copy>p:not(.eyebrow){font-size:17px}.hero .button{font-size:14px;padding:15px 18px}.motion-card{height:290px}.motion-title{font-size:32px}.service-bar .eyebrow{font-size:12px}.quick-links>a{font-size:14px;padding:10px 12px;min-height:60px}.quick-links>a:nth-child(odd){padding-left:0;border-right:1px solid var(--line)}.quick-links>a:nth-child(even){padding-left:12px;border-right:0}.section-heading h2{font-size:42px}.work-section{padding-top:44px}.section-heading{margin-bottom:28px}.section-heading>p{font-size:16px}.showcase-grid{grid-template-columns:1fr;gap:38px}.showcase-project,.showcase-project.featured{grid-column:auto}.project-visual,.web-screen{height:350px}.phone-screen img{width:225px}.project-copy{padding-top:21px}.project-copy h3,.featured .project-copy h3{font-size:26px}.project-copy .kicker{font-size:12px}.project-copy>p:not(.kicker){font-size:16px}.portfolio-grid{grid-template-columns:1fr}.project-card>a{padding:25px}.project-card h3{font-size:22px}.project-card p:not(.kicker){font-size:16px}.project-card .kicker{font-size:12px}.enquiry-band{padding-block:42px}.enquiry-intro h2{font-size:41px}.information summary{font-size:16px}.information .detail-body{font-size:16px}footer>div{font-size:13px}.case-gallery{padding:8px;gap:10px}.case-gallery img{max-height:none}.case-gallery:has(img:nth-child(2)){flex-direction:column}.case-gallery:has(img:nth-child(2)) img{max-width:100%}dialog{padding:22px}dialog h3{font-size:34px}.field-row{grid-template-columns:1fr;gap:0}.form-note{font-size:13px}}
.project-visual.desktop-screen{display:flex;align-items:center}
@media(max-width:650px){.showcase-project:has(.desktop-screen){grid-column:auto}.showcase-project:has(.desktop-screen) .project-visual{height:auto;min-height:0;padding:12px}}
@media(prefers-reduced-motion:reduce){.project-visual img{transition:none}.project-visual:hover img{transform:none}}