@font-face {
  font-family:Manrope;
  src:url('../fonts/manrope.woff2') format('woff2');
  font-weight:200 800;
  font-style:normal;
  font-display:swap
}
@font-face {
  font-family:Inter;
  src:url('../fonts/inter.woff2') format('woff2');
  font-weight:100 900;
  font-style:normal;
  font-display:swap
}
:root {
  --lime:#e7fe25;
  --hover-lime:#e4ff00;
  --hover-dark:#3a3a3a;
  --hover-light:#a2a2a2;
  --ink:#121212;
  --text:#1a1a1a;
  --muted:#525252;
  --surface:#faf9f6;
  --radius:24px;
  --content-max:1360px;
  --page-gutter:40px;
  --header-height:76.284px;
  --admin-bar-height:0px;
  --frame-width:calc(var(--content-max) + var(--page-gutter) + var(--page-gutter))
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:auto
}
html:has(.video-dialog[open]) {
  overflow:hidden
}
body {
  margin:0;
  background:#fff;
  color:var(--text);
  font-family:Inter,sans-serif;
  font-size:16px;
  line-height:1.5
}
h1,h2,h3,p,figure {
  margin:0
}
h1,h2,h3 {
  font-weight:400
}
a {
  color:inherit;
  text-decoration:none
}
button,input,textarea,select {
  font:inherit
}
button {
  color:inherit;
  cursor:pointer
}
button:disabled {
  cursor:wait
}
button {
  border:0;
  background:none;
  padding:0
}
img {
  display:block;
  max-width:100%;
  height:auto
}
ul {
  list-style:none;
  padding:0;
  margin:0
}
fieldset {
  min-width:0;
  border:0;
  margin:0;
  padding:0
}
legend {
  padding:0
}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible {
  outline:2px solid #456d00;
  outline-offset:4px
}
::selection {
  background:var(--lime);
  color:var(--ink)
}
[hidden] {
  display:none!important
}
.screen-reader-text {
  position:absolute!important;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
.site-shell {
  min-width:var(--frame-width);
  width:100%;
  margin-inline:auto
}
.skip-link {
  position:fixed;
  left:20px;
  top:-100px;
  z-index:9999;
  padding:12px;
  background:var(--lime)
}
.skip-link:focus {
  top:12px
}
.site-header {
  height:var(--header-height);
  background:#fff;
  border-bottom:1px solid #e5e5e5
}
.header-inner {
  height:100%;
  padding-block:24px;
  display:flex;
  align-items:center;
  gap:20px
}
.header-logo {
  width:210px;
  flex-shrink:0
}
.header-logo img {
  width:100px;
  height:22px
}
.text-link {
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-weight:500;
  line-height:24px;
  align-self:flex-start;
  color:var(--text);
  transition:color .25s ease
}
.text-link:not(.primary-button):hover {
  color:var(--hover-dark)
}
.icon {
  display:block;
  flex-shrink:0;
  max-width:none
}
.header-nav {
  display:flex;
  gap:32px;
  margin-left:auto
}
.header-cta {
  margin-left:328px
}
.header-services,.header-cta {
  white-space:nowrap
}
.roll-label {
  display:inline-block;
  vertical-align:top;
  overflow:hidden
}
.roll-label-inner {
  display:block;
  position:relative;
  transition:transform .5s cubic-bezier(.65,0,.25,1)
}
.roll-label-copy {
  position:absolute;
  top:100%;
  left:0;
  width:100%
}
:is(.site-header,.site-footer) a:is(:hover,:focus-visible) .roll-label-inner {
  transform:translateY(-100%)
}
.header-nav a {
  transition:color .25s ease
}
.header-nav a:hover {
  color:var(--hover-dark)
}
.site-main {
  display:flex;
  flex-direction:column;
  gap:150px
}
.section-container {
  width:calc(100% - var(--page-gutter) - var(--page-gutter));
  max-width:var(--content-max);
  margin-inline:auto
}
.section-heading {
  display:flex;
  align-items:flex-start;
  gap:40px
}
.section-label {
  width:190px;
  flex-shrink:0;
  font-size:14px;
  line-height:20px;
  color:var(--muted);
  padding-top:15px
}
.section-heading h2 {
  font-family:Manrope,sans-serif;
  font-size:64px;
  line-height:70px;
  letter-spacing:-1.92px;
  width:999px;
  color:#000
}
.has-heading-motion .site-main :is(h1,h2):not(.heading-reveal-ready) {
  visibility:hidden
}
.heading-word,.heading-word-inner {
  display:inline-block
}
.heading-word {
  clip-path:inset(-.15em -.08em -.15em -.08em)
}
.has-heading-motion .heading-reveal-pending .heading-word-inner {
  transform:translateY(130%);
  opacity:0
}
.is-heading-revealing .heading-word-inner {
  will-change:transform,opacity
}
.is-heading-revealed .heading-word {
  clip-path:none
}
.primary-button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  background:var(--lime);
  border-radius:8px;
  padding:18px 30px;
  color:var(--ink);
  font-size:18px;
  line-height:24px;
  --arrow-cutout:var(--lime);
  transition:background-color .25s ease,color .25s ease
}
.primary-button:not(:disabled):hover {
  background:var(--hover-lime)
}
.arrow-icon {
  overflow:hidden;
  border-radius:50%;
  --arrow-x:100%;
  --arrow-y:0%
}
.arrow-icon--left { --arrow-x:-100% }
.arrow-icon--down { --arrow-x:0%; --arrow-y:100% }
.arrow-icon--diagonal { --arrow-y:-100% }
.arrow-glyph {
  fill:var(--arrow-cutout,#fff);
  transform-box:view-box
}
.text-link:hover .arrow-glyph,.primary-button:not(:disabled):hover .arrow-glyph,.carousel-controls button:not(:disabled):hover .arrow-glyph {
  animation:arrow-cycle .5s cubic-bezier(.4,0,.2,1) 1
}
@keyframes arrow-cycle {
  0% { transform:translate(0,0); opacity:1 }
  45% { transform:translate(var(--arrow-x),var(--arrow-y)); opacity:1 }
  46% { transform:translate(calc(-1 * var(--arrow-x)),calc(-1 * var(--arrow-y))); opacity:0 }
  48% { opacity:1 }
  100% { transform:translate(0,0); opacity:1 }
}
.project-card,.review-card,.article-card {
  --arrow-cutout:var(--surface)
}
.primary-button:disabled {
  opacity:.65
}
.large-link {
  font-size:28px;
  line-height:24px;
  gap:15px;
  min-height:35px
}
.hero {
  position:relative;
  height:calc(100vh - var(--header-height) - var(--admin-bar-height));
  height:calc(100dvh - var(--header-height) - var(--admin-bar-height));
  padding-block:var(--page-gutter);
  overflow:hidden;
  display:flex;
  align-items:center
}
.hero-inner {
  position:relative
}
.hero-backdrop,.footer-backdrop {
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none
}
.hero-background,.footer-background,.halftone-canvas {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  pointer-events:none
}
.halftone-canvas {
  visibility:hidden
}
[data-halftone].is-animated .halftone-canvas {
  visibility:visible
}
[data-halftone].is-animated>img {
  visibility:hidden
}
@media (prefers-reduced-motion:reduce) {
  [data-halftone].is-animated>img { visibility:visible }
  [data-halftone].is-animated .halftone-canvas { visibility:hidden }
}
body.admin-bar {
  --admin-bar-height:32px
}
.clients {
  width:var(--frame-width);
  max-width:var(--frame-width);
  margin-inline:auto
}
.hero-art-wrap {
  position:absolute;
  left:664px;
  top:50%;
  transform:translateY(-50%);
  width:728.584px;
  height:681.705px;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none
}
.hero-art {
  width:620.733px;
  height:558.644px;
  transform:rotate(-12.73deg);
  opacity:.8;
  position:relative;
  overflow:hidden;
  flex-shrink:0
}
.hero-art img {
  position:absolute;
  width:100%;
  max-width:none;
  height:101.54%;
  left:0;
  top:-1.18%
}
.hero-copy {
  position:relative;
  display:flex;
  flex-direction:column;
  gap:clamp(24px, calc(100dvh - var(--header-height) - var(--admin-bar-height) - 516px), 184px);
  align-items:flex-start
}
.hero-top {
  display:flex;
  flex-direction:column;
  gap:12px;
  align-items:flex-start
}
.hero-kicker {
  font-size:12px;
  line-height:16px;
  padding:6px;
  background:#fff;
  border-radius:5px;
  color:var(--muted)
}
.hero h1 {
  font-family:Manrope,sans-serif;
  font-size:100px;
  line-height:92px;
  letter-spacing:-1.5px;
  width:1005px
}
.hero-bottom {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:18px
}
.hero-description {
  width:492px;
  background:#fff;
  border-radius:5px;
  padding:6px;
  color:var(--muted);
  font-size:16px;
  line-height:24px
}
.hero-description strong {
  font-weight:500
}
.hero .primary-button {
  font-weight:500
}
.showreel-player {
  height:560px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:24px;
  overflow:hidden
}
.showreel-poster {
  position:absolute;
  inset:0;
  object-fit:cover;
  width:100%;
  height:100%
}
.play-button {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:56px;
  height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--lime);
  border-radius:50%;
  z-index:2
}
.play-glyph {
  display:block;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#194435;
  clip-path:polygon(0 0,50% 0,100% 0,100% 100%,50% 100%,0 100%);
  transition:width .25s ease,height .25s ease,border-radius .25s ease,clip-path .25s ease
}
:is(.showreel-player,.project-card,.review-video):hover .play-glyph,.play-button:focus-visible .play-glyph {
  width:16px;
  height:16px;
  border-radius:0;
  clip-path:polygon(15% 0,55% 25%,95% 50%,95% 50%,55% 75%,15% 100%)
}
.projects,.reviews,.stack {
  display:flex;
  flex-direction:column;
  gap:50px
}
.project-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px
}
.project-card {
  position:relative;
  border-radius:24px;
  overflow:hidden;
  background:var(--surface)
}
.card-link::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  cursor:pointer;
  border-radius:24px
}
.card-link:focus-visible {
  outline:none
}
.card-link:focus-visible::after {
  outline:2px solid #456d00;
  outline-offset:-4px
}
.project-image {
  height:400px;
  position:relative;
  overflow:hidden
}
.media-cover,.media-underlay {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover
}
.project-image>img,.service-image>img,.article-image>img,.team-photo>img {
  transition:transform .6s cubic-bezier(.2,.65,.3,1)
}
.project-card:hover .project-image>img,.service-row:hover .service-image>img,.article-card:hover .article-image>img,.team-person:hover .team-photo>img {
  transform:scale(1.035)
}
.project-body {
  padding:32px 20px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px
}
.project-copy,.project-summary {
  display:flex;
  flex-direction:column;
  gap:10px;
  width:100%
}
.tags {
  display:flex;
  flex-wrap:wrap;
  gap:8px
}
.tags li {
  font-size:12px;
  line-height:1.3;
  padding:5px 12px;
  background:#fff;
  border-radius:24px;
  white-space:nowrap
}
.project-body h3 {
  font-size:32px;
  font-weight:500;
  line-height:1.3;
  width:100%
}
.project-description {
  font-weight:300;
  font-size:16px;
  line-height:1.3;
  color:var(--muted);
  width:100%
}
.clients {
  height:96px;
  overflow:hidden
}
.client-marquee {
  display:flex;
  width:max-content;
  height:96px;
  background:#fff
}
.clients.is-marquee-ready .client-marquee {
  animation:client-marquee var(--marquee-duration) linear infinite;
  will-change:transform
}
.clients:hover .client-marquee,.clients:focus-within .client-marquee {
  animation-play-state:paused
}
@keyframes client-marquee {
  to { transform:translateX(-50%) }
}
@media (prefers-reduced-motion:reduce) {
  .clients.is-marquee-ready .client-marquee { animation:none; will-change:auto }
}
.client-track {
  display:flex;
  align-items:center;
  gap:150px;
  height:96px;
  width:max-content;
  padding-right:150px;
  flex-shrink:0
}
.client-track li {
  position:relative;
  flex-shrink:0
}
.client-track li::after {
  content:"";
  position:absolute;
  width:1px;
  height:60px;
  background:#c4c4c4;
  right:-76px;
  top:50%;
  transform:translateY(-50%)
}
.client-track a {
  width:var(--logo-width);
  height:var(--logo-height);
  display:block
}
.client-track img {
  mix-blend-mode:luminosity;
  width:var(--logo-width);
  height:var(--logo-height);
  object-fit:contain;
  max-width:none
}
.services {
  display:flex;
  flex-direction:column;
  gap:50px
}
.service-list {
  margin-left:230px
}
.service-row {
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:40px 0;
  position:relative;
  min-height:380px
}
.service-row::after {
  content:"";
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:1px;
  background:#d3d3d3
}
.service-row:last-child::after {
  display:none
}
.service-copy {
  width:540px;
  flex-shrink:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start
}
.service-copy h3 {
  font-family:Manrope,sans-serif;
  font-size:32px;
  line-height:1.3;
  font-weight:500;
  width:100%;
  margin-bottom:12px
}
.service-copy>p {
  font-weight:300;
  font-size:16px;
  line-height:1.3;
  width:100%;
  color:var(--muted);
  margin-bottom:12px
}
.service-copy .tags {
  margin-bottom:24px
}
.service-copy>.text-link {
  font-size:20px
}
.service-copy .tags li {
  background:var(--surface);
  padding:6px 12px
}
.service-image {
  width:470px;
  height:300px;
  border-radius:24px;
  overflow:hidden;
  position:relative;
  flex-shrink:0
}
.service-number {
  position:absolute;
  right:20px;
  top:20px;
  font-size:12px;
  line-height:16px;
  color:#ffffff80
}
.service-all {
  margin-top:-50px;
  height:50px;
  margin-left:230px;
  display:flex;
  align-items:flex-start
}
.team {
  width:100%;
  background:var(--lime);
  padding:100px max(var(--page-gutter),calc((100% - var(--content-max)) / 2));
  border-radius:24px;
  display:flex;
  flex-direction:column;
  gap:80px
}
.team-top {
  display:flex;
  gap:40px
}
.team-members {
  width:1130px;
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  align-items:flex-start
}
.team-person {
  width:190px
}
.team-founder {
  width:440px;
  margin-right:72px
}
.team-photo {
  width:190px;
  height:230px;
  border-radius:8px;
  overflow:hidden;
  position:relative;
  background:#fefbf6
}
.team-photo img {
  width:100%;
  height:100%;
  object-fit:cover
}
.team-founder .team-photo {
  width:440px;
  height:540px;
  border-radius:24px
}
.team-person figcaption {
  margin-top:16px;
  font-size:14px;
  line-height:20px
}
.team-person figcaption span {
  display:block;
  font-size:11px;
  line-height:normal;
  letter-spacing:.33px;
  margin-top:4px
}
.team-founder figcaption {
  margin-top:20px;
  font-size:24px;
  line-height:25px
}
.team-founder figcaption span {
  font-size:14px;
  line-height:20px;
  letter-spacing:0;
  color:#194435
}
.team-photo.crop-bottom img {
  position:absolute;
  height:121.1%;
  width:100%;
  max-width:none;
  left:-.03%;
  top:-21.25%
}
.team-manifesto h2 {
  margin-left:230px;
  font-family:Manrope,sans-serif;
  font-size:64px;
  line-height:77px;
  color:var(--ink)
}
.team-manifesto>p {
  font-family:Manrope,sans-serif;
  font-size:32px;
  line-height:1.4;
  color:var(--ink)
}
.team-stats {
  display:flex;
  justify-content:flex-end;
  gap:20px
}
.stat {
  height:380px;
  width:250px;
  padding:24px;
  border-radius:24px;
  background:#fff;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  position:relative;
  overflow:hidden;
  color:#000
}
.stat-featured {
  width:670px;
  margin-right:77px
}
.stat:last-child:not(.stat-featured) {
  width:323px
}
.stat-value {
  font-family:Manrope,sans-serif;
  font-weight:600;
  font-size:80px;
  line-height:92px;
  letter-spacing:-1.2px
}
.stat-label {
  font-size:16px;
  line-height:24px;
  color:var(--muted);
  white-space:nowrap
}
.stat-art {
  position:absolute;
  width:243px;
  height:358px;
  left:316px;
  top:-2.107px;
  object-fit:cover
}
.carousel-controls {
  margin-left:auto;
  align-self:stretch;
  display:flex;
  gap:15px;
  align-items:flex-end
}
.carousel-controls button {
  width:50px;
  height:50px
}
.reviews .section-heading h2 {
  width:787px
}
.carousel-window {
  overflow:hidden;
  width:100%
}
.carousel-track {
  display:flex;
  gap:20px;
  align-items:flex-start;
  transform:translateX(0);
  will-change:transform
}
.carousel-track>* {
  flex:0 0 440px
}
.carousel-controls button[aria-disabled=true] {
  cursor:default
}
.review-card {
  height:480px;
  background:var(--surface);
  border-radius:24px;
  padding:24px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  position:relative;
  overflow:hidden
}
.review-content {
  display:flex;
  flex-direction:column;
  gap:30px;
  width:100%
}
.review-card>.text-link {
  font-size:20px
}
.review-author {
  display:flex;
  gap:12px;
  align-items:center
}
.review-author>div {
  flex:1;
  min-width:0
}
.review-avatar {
  width:50px;
  height:50px;
  border-radius:50%;
  object-fit:cover
}
.review-author h3 {
  font-size:24px;
  line-height:1.3;
  color:var(--ink)
}
.review-author p {
  font-size:14px;
  line-height:1.3;
  color:var(--muted);
  margin-top:2px
}
.review-text {
  font-weight:300;
  font-size:16px;
  line-height:1.3;
  color:var(--ink);
  width:100%
}
.review-image {
  height:200px;
  width:100%;
  position:relative;
  border-radius:8px;
  overflow:hidden
}
.review-video {
  background:#393939;
  justify-content:flex-end
}
.review-video-poster {
  position:absolute;
  inset:0;
  overflow:hidden
}
.review-video-poster>img {
  height:100%;
  width:100%;
  object-fit:cover
}
.review-video-poster::after {
  content:"";
  position:absolute;
  inset:0;
  background:#0000004a
}
.review-video-poster.crop-bottom>img {
  position:absolute;
  height:121.1%;
  width:100%;
  max-width:none;
  left:-.03%;
  top:-21.05%;
  object-fit:fill
}
.review-video-caption {
  position:relative;
  color:#fff
}
.review-video-caption h3 {
  font-size:24px;
  line-height:1.3
}
.review-video-caption p {
  margin-top:2px;
  font-size:14px;
  line-height:1.3
}
.stack-grid {
  display:grid;
  grid-template-columns:300px repeat(4,minmax(0,1fr));
  grid-auto-rows:140px;
  gap:16px;
  grid-auto-flow:dense
}
.stack-cell {
  position:relative;
  overflow:hidden;
  border-radius:24px;
  background:var(--surface);
  color:var(--text)
}
.stack-cell--hero {
  grid-row:span 3
}
.stack-cell--wide {
  grid-column:span 2
}
.stack-cell--tall {
  grid-row:span 2
}
.stack-cell h3 {
  position:absolute;
  left:20px;
  bottom:12px;
  font-size:20px;
  line-height:28px
}
.stack-icon {
  position:absolute;
  width:62px;
  height:62px;
  left:50%;
  transform:translateX(-50%);
  top:31px;
  display:flex;
  justify-content:center;
  align-items:center
}
.stack-icon img {
  max-width:none
}
.stack-cell--hero .stack-icon {
  width:130px;
  height:130px;
  top:131px
}
.stack-cell--hero h3 {
  left:28px;
  bottom:20px
}
.stack-foundation {
  position:absolute;
  left:28px;
  top:28px;
  font-size:12px;
  line-height:16px
}
.stack-note {
  position:absolute;
  left:28px;
  bottom:49px;
  font-size:12px;
  line-height:16px;
  color:var(--muted)
}
.stack-cell--wide .stack-icon {
  width:72px;
  height:72px;
  top:26px
}
.stack-cell--tall .stack-icon {
  width:84px;
  height:84px;
  top:72px
}
.stack-cell--tall h3 {
  bottom:12px
}
.stack-kind--php .stack-icon img {
  width:62px;
  height:32.615px
}
.php-label {
  position:absolute;
  left:13.5px;
  top:15px;
  font-size:20px;
  line-height:28px;
  font-weight:600;
  color:#fff
}
.stack-kind--api .stack-icon img {
  width:55.8px;
  height:55.49px
}
.stack-kind--git .stack-icon {
  width:auto;
  gap:16px;
  height:58px;
  top:33px
}
.stack-kind--git .stack-icon img {
  width:58px;
  height:58px
}
.articles {
  width:100%;
  background:var(--ink);
  border-radius:24px;
  padding:80px max(var(--page-gutter),calc((100% - var(--content-max)) / 2));
  display:flex;
  flex-direction:column;
  gap:50px
}
.articles .section-heading h2 {
  width:743px;
  color:#fff
}
.articles .section-label,.articles>.text-link {
  color:#fff
}
.articles>.text-link {
  --arrow-cutout:var(--ink)
}
.articles>.text-link:hover {
  color:var(--hover-light)
}
.article-card {
  position:relative;
  border-radius:24px;
  overflow:hidden;
  background:var(--surface);
  color:var(--ink)
}
.article-image {
  height:300px;
  position:relative;
  overflow:hidden;
  background:linear-gradient(145.71deg,#293029 14.286%,#5c695c 85.714%)
}
.article-body {
  padding:24px 24px 30px;
  display:flex;
  flex-direction:column
}
.article-copy {
  display:flex;
  flex-direction:column;
  gap:20px;
  width:100%
}
.article-copy>div {
  width:100%
}
.article-date {
  font-size:12px;
  line-height:1.3;
  color:var(--muted)
}
.article-copy h3 {
  font-size:24px;
  line-height:1.3;
  width:100%
}
.article-description {
  font-weight:300;
  font-size:16px;
  line-height:1.3;
  width:100%;
  color:var(--muted);
  margin-top:10px
}
.contact {
  display:flex;
  flex-direction:column;
  gap:50px
}
.contact-layout {
  display:flex;
  gap:20px;
  padding-left:230px;
  align-items:flex-start
}
.enquiry-form {
  width:785px;
  flex-shrink:0;
  display:flex;
  flex-direction:column;
  gap:40px;
  position:relative
}
.enquiry-form legend {
  font-size:28px;
  line-height:20px;
  margin-bottom:30px;
  color:var(--ink)
}
.project-type-options {
  display:flex;
  flex-wrap:wrap;
  gap:8px
}
.project-type-option {
  position:relative;
  cursor:pointer
}
.project-type-option input {
  position:absolute;
  opacity:0;
  width:1px;
  height:1px
}
.project-type-option>span {
  display:flex;
  align-items:center;
  gap:0;
  padding:15px 20px;
  border-radius:24px;
  background:var(--surface);
  font-size:18px;
  line-height:16px;
  color:var(--muted);
  white-space:nowrap;
  font-weight:400;
  transition:background-color .3s ease,color .3s ease,font-weight .3s ease
}
.project-type-check {
  display:block;
  width:0;
  height:16px;
  flex-shrink:0;
  margin-right:0;
  overflow:hidden;
  opacity:0;
  transform:scale(.7);
  transition:width .3s ease,margin-right .3s ease,opacity .25s ease,transform .3s ease
}
.project-type-check .icon {
  width:16px;
  height:16px;
  max-width:none
}
.project-type-option input:checked+span {
  background:var(--lime);
  font-weight:500;
  color:var(--text)
}
.project-type-option input:checked+span .project-type-check {
  width:16px;
  margin-right:10px;
  opacity:1;
  transform:scale(1)
}
.project-type-option input:focus-visible+span {
  outline:2px solid #456d00;
  outline-offset:4px
}
.project-type-option:hover input:not(:checked)+span {
  color:var(--hover-dark)
}
.contact-inputs {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:15px 20px
}
.input-field>input,.input-field>textarea {
  display:block;
  width:100%;
  border:0;
  border-radius:8px;
  background:var(--surface);
  padding:16px;
  font-size:18px;
  line-height:20px;
  color:var(--ink)
}
.input-field>input {
  height:55px
}
.input-field input::placeholder,.input-field textarea::placeholder {
  color:var(--ink);
  opacity:1
}
.input-message {
  grid-column:1/-1
}
.input-message textarea {
  height:140px;
  resize:vertical
}
.attachment-field {
  display:flex;
  gap:10px;
  align-items:center;
  margin-top:15px;
  min-height:46px
}
.attachment-label {
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:15px 20px;
  border-radius:24px;
  background:var(--surface);
  font-size:18px;
  line-height:16px;
  cursor:pointer;
  white-space:nowrap;
  transition:color .25s ease
}
.attachment-label:hover,.attachment-remove:hover {
  color:var(--hover-dark)
}
.visually-hidden-file {
  position:absolute;
  opacity:0;
  width:1px;
  height:1px;
  left:10px;
  bottom:10px
}
.attachment-label:focus-within {
  outline:2px solid #456d00;
  outline-offset:4px
}
.attachment-name {
  font-size:12px;
  max-width:240px;
  overflow-wrap:anywhere
}
.attachment-remove {
  font-size:12px;
  text-decoration:underline;
  transition:color .25s ease
}
.consent-row {
  display:flex;
  gap:9px;
  align-items:flex-start
}
.consent-row>input {
  appearance:none;
  width:20px;
  height:20px;
  flex-shrink:0;
  border:1px solid var(--muted);
  border-radius:3px;
  margin:4px 0;
  background:#fff;
  cursor:pointer
}
.consent-row>input:checked {
  background:var(--lime) url('../images/144-3099-imgFluentMdl2CheckMark.svg') center/14px no-repeat;
  border-color:var(--ink)
}
.consent-row>div {
  width:646px;
  font-size:14px;
  line-height:16px;
  color:var(--muted)
}
.consent-row a {
  font-weight:600
}
.form-submit {
  display:flex;
  flex-direction:column;
  gap:20px
}
.form-submit .primary-button {
  width:100%;
  padding:20px 26px
}
.contact-direct {
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:24px;
  min-width:0
}
.contact-direct>p {
  font-size:14px;
  line-height:20px;
  text-align:right;
  width:340px
}
.contact-direct>div {
  display:flex;
  gap:10px
}
.contact-direct a {
  padding:15px 20px;
  border-radius:24px;
  background:var(--surface);
  font-size:18px;
  line-height:16px;
  transition:background-color .25s ease,color .25s ease
}
.contact-direct a:is(:hover,:focus-visible) {
  background:var(--hover-lime);
  color:var(--hover-dark)
}
.honeypot {
  position:absolute;
  left:-10000px;
  width:1px;
  height:1px;
  overflow:hidden
}
.form-status {
  font-size:14px;
  line-height:20px;
  padding:12px 16px;
  border:1px solid var(--muted);
  border-radius:8px
}
.form-status.is-error {
  border-color:#9d2424;
  color:#9d2424
}
.form-status.is-success {
  background:var(--surface)
}
[aria-invalid=true] {
  outline:2px solid #9d2424!important;
  outline-offset:2px
}
.site-footer {
  position:relative;
  overflow:hidden;
  border-radius:24px 24px 0 0;
  background:var(--ink);
  padding:80px 0 50px;
  color:#fefbf6;
  margin-top:150px
}
.footer-inner {
  display:flex;
  flex-direction:column;
  gap:70px
}
.footer-top,.footer-wordmark,.footer-bottom {
  position:relative
}
.footer-top {
  display:flex;
  gap:40px;
  min-height:175px
}
.footer-top .section-label {
  padding-top:0;
  color:#fff
}
.footer-nav {
  display:flex;
  flex-direction:column;
  gap:17px;
  width:572px;
  font-family:Manrope,sans-serif;
  font-size:28px;
  line-height:30.8px;
  letter-spacing:-.84px
}
.footer-contacts {
  flex:1;
  display:flex;
  flex-direction:column;
  gap:20px;
  align-items:flex-end
}
.footer-social {
  display:flex;
  gap:24px;
  font-size:15px;
  line-height:24px;
  font-weight:500
}
.footer-nav a,.footer-social a,.footer-bottom nav a,.footer-address a {
  transition:color .25s ease
}
.footer-nav a:hover,.footer-social a:hover,.footer-bottom nav a:hover,.footer-address a:hover {
  color:var(--hover-light)
}
.footer-address {
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  font-family:Manrope,sans-serif;
  font-size:35px;
  line-height:56px
}
.footer-wordmark {
  width:100%;
  aspect-ratio:99/22
}
.footer-wordmark img {
  width:100%;
  height:auto;
  max-width:none
}
.footer-bottom {
  display:flex;
  gap:100px;
  padding-top:24px;
  font-size:12px;
  line-height:16px;
  align-items:center
}
.footer-bottom>p:first-child {
  width:130px;
  flex-shrink:0
}
.footer-bottom>p:nth-child(2) {
  width:295px;
  flex-shrink:0
}
.footer-bottom>nav {
  display:flex;
  gap:30px;
  justify-content:flex-end;
  width:730px;
  white-space:nowrap;
  color:#bebebe
}
.video-dialog {
  border:0;
  border-radius:16px;
  padding:52px 20px 20px;
  background:#121212;
  color:#fff;
  width:min(1100px,90vw);
  max-height:90vh
}
.video-dialog::backdrop {
  background:#000b
}
.dialog-close {
  position:absolute;
  right:20px;
  top:14px;
  font-size:14px;
  padding:4px;
  color:#fff;
  transition:color .25s ease
}
.dialog-close:hover {
  color:var(--hover-light)
}
.video-dialog video {
  display:block;
  width:100%;
  max-height:76vh;
  object-fit:contain
}
.site-notice {
  position:fixed;
  z-index:1000;
  bottom:24px;
  left:50%;
  transform:translateX(-50%);
  padding:14px 22px;
  background:var(--ink);
  color:#fff;
  border-radius:8px;
  font-size:14px;
  box-shadow:0 4px 24px #0002
}
.content-page {
  max-width:1000px;
  margin:80px auto
}
.content-page h1 {
  font-family:Manrope,sans-serif;
  font-size:48px;
  margin-bottom:30px
}
.cursor-follower {
  position:fixed;
  top:0;
  left:0;
  z-index:10000;
  width:0;
  height:0;
  pointer-events:none;
  user-select:none;
  visibility:hidden
}
.cursor-follower * {
  pointer-events:none
}
.cursor-follower.is-visible {
  visibility:visible
}
.cursor-follower-bubble {
  display:grid;
  place-items:center;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--lime);
  color:var(--ink);
  transform:translate(-50%,-50%);
  transition:width .38s cubic-bezier(.22,1,.36,1),height .38s cubic-bezier(.22,1,.36,1)
}
.cursor-follower.is-card .cursor-follower-bubble {
  width:112px;
  height:112px
}
.cursor-follower-label {
  font-family:Inter,sans-serif;
  font-size:14px;
  font-weight:500;
  line-height:1.3;
  white-space:nowrap;
  opacity:0;
  transform:translateY(4px);
  transition:opacity .16s ease,transform .25s cubic-bezier(.22,1,.36,1)
}
.cursor-follower.is-card .cursor-follower-label {
  opacity:1;
  transform:translateY(0);
  transition-delay:.1s
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .has-card-cursor,.has-card-cursor *,.has-card-cursor .card-link::after {
    cursor:none
  }
}
@media(hover:none),(pointer:coarse),(prefers-reduced-motion:reduce) {
  .cursor-follower {
    display:none
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    animation-duration:.01ms!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important
  }
  .arrow-glyph {
    animation:none!important
  }
  .has-heading-motion .site-main :is(h1,h2) {
    visibility:visible
  }
  .heading-word-inner {
    transform:none!important;
    opacity:1!important;
    transition:none!important
  }
  .project-card:hover .project-image>img,.service-row:hover .service-image>img,.article-card:hover .article-image>img,.team-person:hover .team-photo>img {
    transform:none
  }
}
