:root {
  color-scheme: light;
  --paper: #fff;
  --gallery: #fafaf7;
  --ink: #090909;
  --muted: #656565;
  --line: #dedede;
  --page-x: 42px;
  --header-height: 58px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--header-height); overflow-x: hidden; }
body { margin: 0; min-width: 320px; overflow-x: hidden; background: var(--paper); }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid var(--ink); outline-offset: 6px; }
::selection { background: #d6d6d6; color: #111; }
.page { position: relative; width: 100%; min-height: 100vh; overflow: hidden; }
.page-video { position: fixed; inset: 0; z-index: 0; width: 100%; height: 100svh; object-fit: cover; object-position: center center; background: #fff; filter: saturate(1.2) contrast(1.16) brightness(1.07); transform: translateZ(0); pointer-events: none; }
.page-video::-webkit-media-controls { display: none !important; }
main, footer { position: relative; z-index: 1; }
.header { position: fixed; inset: 0 0 auto; z-index: 20; height: var(--header-height); display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 var(--page-x); background: rgba(250,250,247,.92); border-bottom: 1px solid rgba(9,9,9,.12); }
.wordmark { font-size: 13px; font-weight: 860; text-transform: uppercase; }
.header-links { display: flex; align-items: center; gap: 18px; font-size: 12px; font-weight: 820; text-transform: uppercase; }
.header-links a, .language { opacity: .72; transition: opacity .16s ease; }
.header-links a:hover, .language:hover { opacity: 1; }
.language { min-width: 54px; min-height: 32px; padding: 0 22px 0 8px; border: 1px solid rgba(9,9,9,.16); border-radius: 0; background-color: rgba(255,255,255,.58); color: var(--ink); font-size: 11px; font-weight: 860; text-transform: uppercase; }
.hero { position: relative; min-height: 900px; height: 100svh; display: grid; grid-template-columns: minmax(0,760px) minmax(240px,1fr); grid-template-rows: auto auto auto 1fr; align-items: start; row-gap: 18px; column-gap: 56px; padding: 86px var(--page-x) 22px; overflow: hidden; border-bottom: 1px solid rgba(9,9,9,.2); background: transparent; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg,rgba(250,250,247,.62),rgba(250,250,247,.3),rgba(250,250,247,.06) 64%,rgba(250,250,247,0) 86%),linear-gradient(180deg,rgba(250,250,247,.05),rgba(250,250,247,0) 48%,rgba(250,250,247,.08)); pointer-events: none; }
.hero > :not(.art-labels) { position: relative; z-index: 3; }
.hero-spacer { grid-column: 1; grid-row: 1; height: 58px; pointer-events: none; }
.art-labels { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.art-label { position: absolute; display: inline-flex; width: fit-content; max-width: 260px; padding: 4px 7px 5px; border: 1px solid rgba(9,9,9,.12); background: rgba(255,255,255,.86); color: var(--ink); box-shadow: 0 12px 30px rgba(9,9,9,.08); font-size: 17px; font-weight: 900; line-height: 1; text-transform: uppercase; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.label-consulting { right: 72px; top: 216px; }
.label-systems { right: 28%; top: 378px; }
.label-apps { right: 12%; bottom: 252px; }
.label-platforms { right: 34%; bottom: 162px; }
.label-automation { right: 6%; bottom: 108px; }
.hero h1 { grid-column: 1; grid-row: 2; align-self: start; max-width: 760px; margin: 58px 0 0; color: var(--ink); font-size: 56px; line-height: 1; letter-spacing: 0; font-weight: 900; text-transform: uppercase; overflow-wrap: anywhere; text-wrap: balance; }
.hero-copy { grid-column: 1; grid-row: 3; align-self: start; width: 100%; max-width: 520px; }
.hero-copy p { margin: 0; max-width: 520px; color: var(--muted); font-size: 16px; line-height: 1.45; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.hero-button { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 0 16px; border: 1px solid rgba(9,9,9,.2); border-radius: 2px; font-size: 12px; font-weight: 860; text-transform: uppercase; }
.hero-button.primary { color: #fff; background: var(--ink); }
.hero-button.ghost { color: var(--ink); background: rgba(250,250,247,.5); }
.info-row, footer { width: min(1400px,87.5%); margin-inline: auto; }
.info-row { display: grid; grid-template-columns: 1fr 2fr; gap: 28px; border-top: 1px solid rgba(9,9,9,.2); padding: 38px 0 42px; background: rgba(250,250,247,.78); }
h2 { margin: 2px 0 0; color: var(--muted); font-size: 14px; font-weight: 400; line-height: 1.6; }
.row-content { min-width: 0; }
.contact { width: 100%; padding: 52px var(--page-x) 64px; }
.contact-heading { margin: 0; font-size: 30px; font-weight: 500; letter-spacing: -.035em; line-height: 1.25; }
.contact-intro { max-width: 620px; margin: 10px 0 0; color: var(--muted); font-size: 16px; line-height: 1.5; }
.contact-form { padding-top: 30px; display: grid; gap: 24px; }
.field-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.contact-form label { display: grid; align-content: start; gap: 10px; font-size: 14px; line-height: 1.5; }
.contact-form input, .contact-form select, .contact-form textarea { width: 100%; min-height: 52px; border: 1px solid rgba(9,9,9,.24); border-radius: 0; padding: 12px; background: rgba(255,255,255,.92); color: #202020; font-size: 16px; line-height: 1.5; }
.contact-form select { cursor: pointer; }
.contact-form textarea { min-height: 152px; resize: vertical; }
.contact-form input:hover, .contact-form select:hover, .contact-form textarea:hover { border-color: #888; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { border-color: #202020; }
.submit { justify-self: start; min-height: 52px; display: inline-flex; align-items: center; justify-content: center; padding: 12px 22px; border: 1px solid #202020; background: #202020; color: #fff; font-size: 15px; font-weight: 700; }
.submit:hover { background: #444; }
.form-note { margin: -8px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
footer { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid rgba(9,9,9,.18); padding: 24px var(--page-x) 32px; color: var(--muted); font-size: 12px; line-height: 1.5; background: rgba(250,250,247,.78); }
footer a:hover { color: var(--ink); }
@media (max-width:980px) {
  :root { --page-x: 24px; --header-height: 56px; }
  .hero { min-height: 840px; grid-template-columns: 1fr; align-content: space-between; padding-top: 86px; }
  .hero h1 { max-width: 680px; margin-top: 44px; font-size: 48px; }
  .hero-copy { max-width: 620px; }
  .info-row { grid-template-columns: 1fr 2.5fr; }
}
@media (max-width:640px) {
  :root { --page-x: 16px; --header-height: 44px; }
  .header { height: var(--header-height); padding: 0 var(--page-x); }
  .wordmark { font-size: 12px; }
  .header-links { gap: 10px; }
  .language { height: 30px; min-height: 30px; padding: 0 20px 0 6px; font-size: 10px; }
  .hero { height: auto; min-height: 100svh; display: flex; flex-direction: column; gap: 12px; padding-top: calc(var(--header-height) + 118px + env(safe-area-inset-top)); padding-bottom: calc(28px + env(safe-area-inset-bottom)); }
  .hero::before { background: linear-gradient(180deg,rgba(250,250,247,.48),rgba(250,250,247,.18),rgba(250,250,247,.03) 68%,rgba(250,250,247,0)),linear-gradient(90deg,rgba(250,250,247,.5),rgba(250,250,247,.1) 54%,rgba(250,250,247,0) 88%); }
  .page-video { object-position: 54% 58%; filter: saturate(1.36) contrast(1.22) brightness(1.08); }
  .hero-spacer { height: 58px; }
  .art-labels { display: none; }
  .hero h1 { max-width: 330px; margin-top: 60px; font-size: clamp(27px,7.4vw,31px); line-height: .98; }
  .hero-copy { width: 100%; max-width: 340px; margin-top: 0; }
  .hero-copy p { display: inline-block; max-width: 328px; padding: 10px 12px; border: 1px solid rgba(9,9,9,.14); background: rgba(255,255,255,.78); color: rgba(58,58,53,.72); font-size: 16px; line-height: 1.34; }
  .hero-actions { width: 100%; max-width: 340px; margin-top: 28px; }
  .hero-button { flex: 1 1 150px; }
  .info-row { width: 100%; grid-template-columns: 1fr; gap: 24px; padding: 28px var(--page-x) 40px; }
  .contact-heading { font-size: 28px; }
}
@media (max-width:480px) {
  .field-pair { grid-template-columns: 1fr; gap: 24px; }
  .contact-heading { font-size: 26px; }
  footer { align-items: flex-start; flex-direction: column; padding: 22px 0 26px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
}