/* razrabotka.org - premium static experience */
:root {
  --beige: #eeddd5;
  --beige-soft: #f8f1ec;
  --beige-deep: #dfc8bd;
  --navy: #162f59;
  --navy-deep: #0d1e39;
  --navy-ink: #09172d;
  --blue: #b8cce4;
  --blue-soft: #dee8f3;
  --white: #fffaf7;
  --text: #132849;
  --muted: #52627c;
  --line: rgba(22, 47, 89, 0.19);
  --line-light: rgba(238, 221, 213, 0.22);
  --sans: "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --display: "Unbounded", "Manrope", sans-serif;
  --container: 1480px;
  --gutter: clamp(18px, 3vw, 48px);
  --radius: clamp(22px, 2.3vw, 36px);
  --ease: cubic-bezier(.2, .75, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }

html {
  background: var(--beige);
  color: var(--text);
  font-family: var(--sans);
  scroll-behavior: smooth;
  scrollbar-color: var(--navy) var(--beige);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

body {
  min-width: 320px;
  width: 100%;
  max-width: 100%;
  margin: 0;
  overflow-x: hidden;
  background: var(--beige);
}

@supports (overflow: clip) {
  html,
  body { overflow-x: clip; }
}

body.is-loading,
body.menu-open,
body.dialog-open { overflow: hidden; }

::selection {
  color: var(--selection-text, var(--beige));
  background-color: var(--selection-bg, var(--navy));
  text-shadow: none;
}

::-moz-selection {
  color: var(--selection-text, var(--beige));
  background-color: var(--selection-bg, var(--navy));
  text-shadow: none;
}

.preloader,
.mobile-menu,
.services,
.process,
.contact-dialog,
.approach-card--one,
.approach-card--two,
.contact,
.skip-link,
.brand__mark,
.header__cta:hover,
.header__cta i,
.language-switch--header .language-switch__option:hover,
.language-switch--header .language-switch__option:focus-visible,
.language-switch--header .language-switch__option[aria-current="page"],
.pill-button i,
.contact-link--primary,
.contact-link:hover {
  --selection-text: var(--navy);
  --selection-bg: var(--beige);
}

.contact-link--primary i,
.contact-link:hover i {
  --selection-text: var(--beige);
  --selection-bg: var(--navy);
}

a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button { color: inherit; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }

:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 4px;
}

.skip-link {
  position: fixed;
  z-index: 10000;
  top: 12px;
  left: 12px;
  padding: 12px 16px;
  transform: translateY(-160%);
  border-radius: 999px;
  color: var(--beige);
  background: var(--navy);
  transition: transform .25s ease;
}

.skip-link:focus { transform: translateY(0); }

.container {
  width: min(100% - (var(--gutter) * 2), var(--container));
  margin-inline: auto;
}

.section {
  position: relative;
  padding-block: clamp(104px, 13vw, 210px);
}

#services,
#approach,
#process,
#contact { scroll-margin-top: 78px; }

.noise {
  position: fixed;
  z-index: 9000;
  inset: 0;
  pointer-events: none;
  opacity: .035;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.84' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}

.scroll-progress {
  position: fixed;
  z-index: 9100;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  pointer-events: none;
}

.scroll-progress span {
  display: block;
  width: 100%;
  height: 100%;
  transform: scaleX(0);
  transform-origin: left center;
  background: var(--blue);
  will-change: transform;
}

/* preloader */
.preloader {
  position: fixed;
  z-index: 9999;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 24px;
  color: var(--beige);
  background: var(--navy);
  clip-path: inset(0 0 0 0);
  transition: clip-path .85s var(--ease), visibility 0s linear .85s;
}

.preloader::before,
.preloader::after {
  position: absolute;
  width: min(55vw, 780px);
  aspect-ratio: 1;
  border: 1px solid rgba(238, 221, 213, .15);
  border-radius: 50%;
  content: "";
}

.preloader::before { transform: translate(-38%, -34%); }
.preloader::after { transform: translate(38%, 34%); }

.preloader.is-done {
  visibility: hidden;
  clip-path: inset(0 0 100% 0);
}

.preloader__top,
.preloader__bottom {
  position: absolute;
  right: 24px;
  left: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.preloader__top { top: 22px; }
.preloader__bottom { bottom: 22px; }
.preloader__mark {
  position: relative;
  z-index: 1;
  font-family: var(--display);
  font-size: clamp(72px, 12vw, 190px);
  font-weight: 700;
  letter-spacing: -.12em;
}
.preloader__mark span { color: var(--blue); }
.preloader__line { position: absolute; right: 0; bottom: 0; left: 0; height: 3px; background: rgba(255,255,255,.12); }
.preloader__line span { display: block; width: 100%; height: 100%; transform: scaleX(0); transform-origin: left; background: var(--blue); }

/* fixed header */
.header {
  position: fixed;
  z-index: 800;
  top: 0;
  right: 0;
  left: 0;
  display: grid;
  grid-template-columns: 1fr auto auto 1fr;
  column-gap: clamp(14px, 2vw, 30px);
  align-items: center;
  min-height: 82px;
  padding: 14px var(--gutter);
  opacity: var(--header-opacity, 0);
  transform: translateY(var(--header-y, -14px));
  transition: background-color .35s ease, color .35s ease, box-shadow .35s ease, opacity .25s ease;
  pointer-events: var(--header-events, none);
}

.header.is-scrolled {
  color: var(--navy);
  background: rgba(238, 221, 213, .76);
  box-shadow: 0 1px 0 rgba(22, 47, 89, .1);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

.brand { display: inline-flex; align-items: center; width: max-content; gap: 10px; }
.brand__mark {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  color: var(--beige);
  background: var(--navy);
  font-family: var(--display);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -.08em;
}
.brand__name { font-family: var(--display); font-size: 14px; font-weight: 700; letter-spacing: -.05em; }
.brand__name sup { margin-left: 2px; color: var(--muted); font-family: var(--sans); font-size: 8px; letter-spacing: 0; }
.header__nav { display: flex; align-items: center; gap: clamp(20px, 3vw, 46px); }
.header__nav a { position: relative; font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.header__nav a::after { position: absolute; right: 0; bottom: -7px; left: 0; height: 1px; transform: scaleX(0); transform-origin: right; background: currentColor; content: ""; transition: transform .35s var(--ease); }
.header__nav a:hover::after { transform: scaleX(1); transform-origin: left; }
.header__cta {
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: 22px;
  min-height: 48px;
  padding: 7px 8px 7px 20px;
  border: 1px solid rgba(22,47,89,.34);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  transition: color .3s ease, background .3s ease;
}
.header__cta i { display: grid; place-items: center; width: 33px; height: 33px; border-radius: 50%; color: var(--beige); background: var(--navy); font-style: normal; transition: transform .3s var(--ease); }
.header__cta:hover { color: var(--beige); background: var(--navy); }
.header__cta:hover i { color: var(--navy); background: var(--blue); transform: rotate(45deg); }
.menu-toggle { display: none; }

/* language selector */
.language-switch {
  --language-option: #6486b1;
  --language-glow: rgba(184, 204, 228, .72);
  position: relative;
  z-index: 80;
  display: inline-flex;
  align-items: center;
  gap: 22px;
  width: max-content;
  padding: 0;
  border: 0;
  color: var(--language-option);
  background: transparent;
  box-shadow: none;
}
.language-switch__option {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  min-width: 0;
  min-height: 0;
  padding: 8px 2px;
  color: var(--language-option);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .055em;
  opacity: .48;
  text-shadow: 0 0 0 transparent;
  transition: color .28s ease, opacity .28s ease, transform .28s var(--ease), text-shadow .28s ease;
}
.language-switch__option::before {
  position: absolute;
  z-index: -1;
  inset: -7px -13px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, var(--language-glow) 0%, rgba(184, 204, 228, .24) 40%, transparent 72%);
  content: "";
  filter: blur(7px);
  opacity: 0;
  transform: scale(.72);
  transition: opacity .32s ease, transform .38s var(--ease);
  pointer-events: none;
}
.language-switch__option:hover,
.language-switch__option:focus-visible { opacity: 1; transform: translateY(-1px); text-shadow: 0 0 12px rgba(184, 204, 228, .75); outline: 0; }
.language-switch__option:hover::before,
.language-switch__option:focus-visible::before { opacity: .92; transform: scale(1); }
.language-switch__option[aria-current="page"] { opacity: .9; text-shadow: 0 0 10px rgba(184, 204, 228, .42); }
.language-switch--intro {
  position: absolute;
  top: max(14px, env(safe-area-inset-top));
  left: 50%;
  opacity: var(--language-intro-opacity, 1);
  transform: translateX(-50%);
  transition: opacity .3s ease, transform .3s var(--ease), visibility 0s linear 0s;
}
.language-switch--intro.is-hidden { visibility: hidden; opacity: 0; transform: translate(-50%, -8px); transition-delay: 0s, 0s, .3s; pointer-events: none; }
.language-switch--header {
  justify-self: end;
  gap: 2px;
  padding: 4px;
  border: 1px solid rgba(22, 47, 89, .18);
  border-radius: 999px;
  background: rgba(238, 221, 213, .56);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .62), 0 8px 22px rgba(22, 47, 89, .07);
  -webkit-backdrop-filter: blur(14px) saturate(1.12);
  backdrop-filter: blur(14px) saturate(1.12);
}
.language-switch--header .language-switch__option {
  min-width: 58px;
  min-height: 28px;
  justify-content: center;
  padding: 7px 11px;
  border-radius: 999px;
  color: var(--navy);
  font-size: 9px;
  opacity: .58;
  text-shadow: none;
  transition: color .28s ease, background-color .28s ease, box-shadow .28s ease, opacity .28s ease, transform .28s var(--ease);
}
.language-switch--header .language-switch__option::before { display: none; }
.language-switch--header .language-switch__option:hover,
.language-switch--header .language-switch__option:focus-visible {
  color: var(--navy);
  background: rgba(184, 204, 228, .42);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .36);
  opacity: 1;
  text-shadow: none;
  transform: translateY(-1px);
}
.language-switch--header .language-switch__option[aria-current="page"] {
  color: var(--beige);
  background: var(--navy);
  box-shadow: 0 4px 12px rgba(22, 47, 89, .18), inset 0 1px 0 rgba(255, 255, 255, .14);
  opacity: 1;
  text-shadow: none;
}
.language-switch--mobile { display: none; }

/* mobile menu */
.mobile-menu {
  position: fixed;
  z-index: 700;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 118px var(--gutter) 30px;
  visibility: hidden;
  opacity: 0;
  color: var(--beige);
  background: var(--navy);
  clip-path: inset(0 0 100% 0);
  transition: clip-path .65s var(--ease), opacity .4s ease, visibility 0s linear .65s;
}
.mobile-menu.is-open { visibility: visible; opacity: 1; clip-path: inset(0); transition-delay: 0s; }
.mobile-menu > nav:not(.language-switch) { display: grid; }
.mobile-menu > nav:not(.language-switch) a { display: grid; grid-template-columns: 44px 1fr; align-items: baseline; padding: 16px 0; border-bottom: 1px solid var(--line-light); }
.mobile-menu > nav:not(.language-switch) small { font-size: 10px; letter-spacing: .08em; }
.mobile-menu > nav:not(.language-switch) span { font-family: var(--display); font-size: clamp(31px, 9vw, 58px); letter-spacing: -.06em; text-transform: uppercase; }
.mobile-menu__cta { display:flex;align-items:center;justify-content:space-between;gap:22px;margin-top:22px;padding:12px 12px 12px 20px;border:1px solid var(--line-light);border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase }
.mobile-menu__cta i { display:grid;place-items:center;width:42px;height:42px;border-radius:50%;color:var(--navy);background:var(--blue);font-size:17px;font-style:normal }
.mobile-menu__meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; font-size: 14px; }

/* intro transformation */
.intro {
  position: relative;
  height: 235svh;
  background: radial-gradient(circle at 52% 46%, #f0dfd7 0%, #eedcd4 58%, #ecdbd3 100%);
}

.intro__sticky {
  position: sticky;
  top: 0;
  display: grid;
  place-items: center;
  width: 100%;
  height: 100svh;
  min-height: 620px;
  overflow: hidden;
}

.intro__ambient { position: absolute; inset: 0; width: 100%; overflow: hidden; contain: paint; pointer-events: none; }
.intro__ambient span { position: absolute; border: 1px solid rgba(22,47,89,.1); border-radius: 50%; }
.intro__ambient span:nth-child(1) { width: 58vw; aspect-ratio: 1; top: -34vw; left: -15vw; }
.intro__ambient span:nth-child(2) { width: 44vw; aspect-ratio: 1; right: -19vw; bottom: -19vw; }
.intro__ambient span:nth-child(3) { width: 16px; height: 16px; top: 19%; right: 11%; background: var(--navy); box-shadow: -13vw 54vh 0 var(--blue), -72vw 18vh 0 var(--navy); }

.site-frame {
  position: relative;
  width: var(--frame-width, min(90vw, 1240px));
  height: var(--frame-height, min(72svh, 720px));
  min-height: 470px;
  overflow: hidden;
  border: 1px solid rgba(22,47,89,var(--frame-border-alpha, .3));
  border-radius: var(--frame-radius, 30px);
  background: var(--beige-soft);
  box-shadow: 0 var(--frame-shadow-y, 34px) var(--frame-shadow-blur, 90px) rgba(13,30,57,var(--frame-shadow-alpha, .17));
  transform: translateZ(0) rotate(var(--frame-rotate, -.6deg));
  will-change: width, height, border-radius, transform;
}

.site-frame__chrome {
  position: absolute;
  z-index: 30;
  top: 0;
  right: 0;
  left: 0;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  min-height: 45px;
  padding: 0 16px;
  border-bottom: 1px solid rgba(22,47,89,.13);
  opacity: var(--chrome-opacity, 1);
  background: rgba(248,241,236,.94);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: opacity .1s linear;
  pointer-events: none;
}
.site-frame__dots { display: flex; gap: 6px; }
.site-frame__dots i { width: 7px; height: 7px; border: 1px solid var(--navy); border-radius: 50%; }
.site-frame__status { justify-self: end; display: flex; align-items: center; gap: 6px; }
.site-frame__status i { width: 6px; height: 6px; border-radius: 50%; background: #4e8f75; box-shadow: 0 0 0 3px rgba(78,143,117,.15); }
.site-frame__screen { position: absolute; inset: 0; overflow: hidden; background: var(--beige-soft); }

.template-site {
  position: absolute;
  z-index: 1;
  inset: 45px 0 0;
  padding: clamp(18px, 2.5vw, 38px);
  opacity: var(--template-opacity, 1);
  filter: grayscale(var(--template-gray, .15)) blur(var(--template-blur, 0px));
  transform: scale(var(--template-scale, 1));
  transform-origin: center;
  background: #f7f3ef;
  transition: filter .08s linear;
  will-change: opacity, filter, transform;
}
.template-site__nav { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 38px; border-bottom: 1px solid #d8d1cc; }
.template-site__logo { font-size: 10px; font-weight: 800; letter-spacing: .08em; }
.template-site__nav div { display: flex; gap: 22px; }
.template-site__nav div i { display: block; width: 45px; height: 5px; border-radius: 10px; background: #d6d1cd; }
.template-site__nav b { justify-self: end; padding: 8px 16px; border-radius: 5px; color: white; background: #8d9297; font-size: 8px; text-transform: uppercase; }
.template-site__hero { display: grid; justify-items: center; padding: clamp(32px, 6vh, 74px) 20px clamp(22px, 4vh, 50px); text-align: center; }
.template-site__hero > span { margin-bottom: 14px; color: #8c8d8f; font-size: 8px; font-weight: 800; letter-spacing: .14em; }
.template-site__hero h2 { color: #494e54; font-size: clamp(31px, 4vw, 64px); line-height: .97; letter-spacing: -.055em; }
.template-site__hero p { margin-top: 16px; color: #8b8d90; font-size: clamp(10px, 1vw, 14px); }
.template-site__button { margin-top: 22px; padding: 12px 24px; border-radius: 5px; color: #fff; background: #7c8288; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.template-site__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; max-width: 840px; margin: 0 auto; }
.template-site__cards article { min-height: 100px; padding: 14px; border: 1px solid #ddd6d1; border-radius: 7px; background: #efebe7; }
.template-site__cards i { display: block; width: 22px; height: 22px; margin-bottom: 12px; border-radius: 50%; background: #c7c6c5; }
.template-site__cards b { display: block; margin-bottom: 9px; color: #66696c; font-size: 10px; }
.template-site__cards span { display: block; width: 90%; height: 4px; margin-top: 5px; border-radius: 4px; background: #d3cfcc; }
.template-site__cards span:last-child { width: 67%; }
.template-site__label { position: absolute; right: 16px; bottom: 12px; color: #96918d; font-size: 8px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }

.premium-site {
  position: absolute;
  z-index: 5;
  inset: 0;
  overflow: hidden;
  contain: paint;
  clip-path: inset(var(--premium-inset, 100%) 0 0 0);
  color: var(--navy-deep);
  background: var(--beige);
  will-change: clip-path;
}
.premium-site__art { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 53% 52%; transform: translate3d(var(--art-x, 0px), var(--art-y, 0px), 0) scale(var(--art-scale, 1.06)); will-change: transform; }
.premium-site__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(238,221,213,.95) 0%, rgba(238,221,213,.76) 36%, rgba(238,221,213,.12) 68%, rgba(238,221,213,.04) 100%); }
.premium-site__shade::after { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(238,221,213,.3), transparent 28%, transparent 70%, rgba(238,221,213,.35)); content: ""; }
.premium-site__meta { position: absolute; z-index: 2; top: clamp(94px, 12vh, 122px); right: clamp(18px, 3vw, 48px); left: clamp(18px, 3vw, 48px); display: flex; justify-content: flex-end; font-size: clamp(8px, .7vw, 11px); font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.premium-site__content { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; width: min(72%, 1040px); height: 100%; padding: clamp(80px, 9vw, 150px) clamp(22px, 4.5vw, 72px) clamp(30px, 4.5vw, 72px); }
.premium-site__eyebrow { margin-bottom: clamp(20px, 3vh, 38px); font-size: clamp(9px, .8vw, 12px); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.premium-site h1 { font-family: var(--display); font-size: clamp(42px, 6.45vw, 110px); font-weight: 600; line-height: .9; letter-spacing: -.075em; }
.premium-site h1 > span { display: block; white-space: nowrap; }
.premium-site__title-long { font-size: .68em; letter-spacing: -.085em; }
.premium-site__title-accent { color: var(--navy); }
.premium-site__title-accent > span { color: var(--blue); }
.premium-site__bottom { display: grid; grid-template-columns: minmax(220px, 460px) auto; align-items: end; gap: 30px; margin-top: clamp(28px, 5vh, 66px); }
.premium-site__bottom p { max-width: 450px; font-size: clamp(12px, 1.05vw, 16px); line-height: 1.55; }

.pill-button {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  min-width: 230px;
  min-height: 64px;
  overflow: hidden;
  padding: 10px 10px 10px 24px;
  border: 1px solid rgba(255, 255, 255, .62);
  border-radius: 999px;
  color: var(--navy-deep);
  background: linear-gradient(135deg, rgba(255, 250, 247, .97), rgba(238, 221, 213, .96) 58%, rgba(184, 204, 228, .9));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 10px 24px rgba(13,30,57,.12);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  transition: transform .35s var(--ease), box-shadow .35s ease, background .35s ease, border-color .35s ease;
}
.pill-button::before {
  position: absolute;
  z-index: 0;
  inset: -70% -35%;
  background: radial-gradient(circle at 30% 42%, rgba(255,255,255,.72), transparent 28%);
  content: "";
  transform: translateX(-28%) rotate(-9deg);
  transition: transform .55s var(--ease), opacity .35s ease;
  pointer-events: none;
}
.pill-button > span,
.pill-button i { position: relative; z-index: 1; }
.pill-button i { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--beige); background: var(--navy); box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 5px 14px rgba(13,30,57,.2); font-size: 17px; font-style: normal; transition: transform .35s var(--ease), background-color .3s ease; }
.pill-button:hover { transform: translateY(-4px); border-color: rgba(255,255,255,.88); box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 14px 30px rgba(13,30,57,.15); }
.pill-button:hover::before { transform: translateX(28%) rotate(-9deg); }
.pill-button:hover i { transform: rotate(45deg); }
.pill-button:active { transform: translateY(-1px) scale(.985); transition-duration: .12s; }
.pill-button:focus-visible { outline: 3px solid var(--navy); outline-offset: 4px; }
.transform-line { position: absolute; z-index: 20; top: var(--wipe-y, 100%); right: 0; left: 0; height: 1px; opacity: var(--wipe-opacity, 0); background: var(--blue); box-shadow: 0 0 24px rgba(184,204,228,.85); pointer-events: none; }
.transform-line i { position: absolute; left: 0; width: 20%; height: 2px; background: white; animation: scan 1.4s linear infinite; }
@keyframes scan { to { transform: translateX(500%); } }

.intro__caption { position: absolute; z-index: 50; right: var(--gutter); bottom: 22px; left: var(--gutter); display: grid; grid-template-columns: auto minmax(100px, 260px) auto; align-items: center; justify-content: center; gap: 14px; opacity: var(--caption-opacity, 1); color: var(--navy); font-size: 8px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.intro__caption div { width: min(18vw, 260px); height: 1px; overflow: hidden; background: rgba(22,47,89,.2); }
.intro__caption i { display: block; width: 100%; height: 100%; transform: scaleX(var(--intro-progress, 0)); transform-origin: left; background: var(--navy); }
.intro__scroll { position: absolute; z-index: 40; bottom: 22px; left: var(--gutter); display: flex; align-items: center; gap: 10px; opacity: var(--scroll-hint-opacity, 1); color: var(--navy); font-size: 8px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.intro__scroll span { position: relative; width: 28px; height: 28px; border: 1px solid rgba(22,47,89,.3); border-radius: 50%; }
.intro__scroll span::after { position: absolute; top: 7px; left: 50%; width: 2px; height: 7px; transform: translateX(-50%); border-radius: 4px; background: var(--navy); content: ""; animation: scrollHint 1.5s ease-in-out infinite; }
@keyframes scrollHint { 50% { transform: translate(-50%, 6px); opacity: .25; } }

/* shared headings */
.section-kicker { display: flex; align-items: center; gap: 16px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.section-kicker span { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid currentColor; border-radius: 50%; font-size: 9px; }
.section-kicker--light { color: var(--blue); }
.section-heading { display: grid; grid-template-columns: 2fr 8fr 2fr; align-items: start; gap: 24px; margin-bottom: clamp(64px, 9vw, 140px); }
.section-heading h2 { grid-column: 2; color: var(--beige); font-family: var(--display); font-size: clamp(42px, 6vw, 98px); font-weight: 600; line-height: .94; letter-spacing: -.07em; text-transform: uppercase; }
.section-heading h2 em { color: var(--blue); font-family: var(--sans); font-weight: 500; font-style: normal; letter-spacing: -.06em; text-transform: none; }
.section-heading--wide h2 { grid-column: 2 / -1; max-width: 1120px; }

/* manifesto */
.manifesto { overflow: hidden; color: var(--navy); background: var(--beige); }
.manifesto::before { position: absolute; top: -28vw; right: -24vw; width: 62vw; aspect-ratio: 1; border: 1px solid var(--line); border-radius: 50%; content: ""; }
.manifesto__grid { display: grid; grid-template-columns: 2fr 10fr; gap: 24px; }
.manifesto__body { display: grid; grid-template-columns: 8fr 2fr; gap: 24px; }
.manifesto__lead { grid-column: 1 / -1; max-width: 780px; margin-bottom: clamp(38px, 7vw, 110px); color: var(--muted); font-size: clamp(17px, 1.7vw, 26px); line-height: 1.4; }
.manifesto__statement { max-width: 1150px; font-family: var(--display); font-size: clamp(41px, 6.6vw, 108px); font-weight: 600; line-height: .99; letter-spacing: -.075em; text-transform: uppercase; }
.manifesto__statement em { color: var(--navy); font-family: var(--sans); font-weight: 500; font-style: normal; text-transform: none; }
.manifesto__aside { align-self: end; padding-left: 18px; border-left: 1px solid var(--line); }
.manifesto__aside span { display: block; margin-bottom: 18px; font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.manifesto__aside p { color: var(--muted); font-size: 13px; line-height: 1.65; }

/* services */
.services { color: var(--beige); background: var(--navy); }
.services::before { position: absolute; inset: 0; opacity: .32; background-image: linear-gradient(var(--line-light) 1px, transparent 1px), linear-gradient(90deg, var(--line-light) 1px, transparent 1px); background-size: 8.33vw 8.33vw; mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 82%, transparent); content: ""; pointer-events: none; }
.services .container { position: relative; }
.service-card { position: relative; border-top: 1px solid var(--line-light); }
.service-card:last-child { border-bottom: 1px solid var(--line-light); }
.service-card__head { display: grid; grid-template-columns: 72px 3fr 2fr 56px; align-items: center; width: 100%; min-height: clamp(108px, 11vw, 164px); padding: 0; border: 0; background: transparent; text-align: left; cursor: pointer; }
.service-card__num { align-self: start; padding-top: 35px; color: var(--blue); font-size: 10px; font-weight: 800; }
.service-card__name { font-family: var(--display); font-size: clamp(28px, 4vw, 66px); font-weight: 600; letter-spacing: -.065em; text-transform: uppercase; transition: transform .45s var(--ease), color .3s ease; }
.service-card__short { justify-self: start; color: rgba(238,221,213,.56); font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.service-card__toggle { --toggle-rotation: 0deg; position: relative; justify-self: end; width: 44px; height: 44px; border: 1px solid var(--line-light); border-radius: 50%; transform: rotate(var(--toggle-rotation)); transition: color .3s ease, background .3s ease, transform .45s var(--ease); }
.service-card__toggle::before, .service-card__toggle::after { position: absolute; top: 50%; left: 50%; width: 13px; height: 1px; transform: translate(-50%,-50%); background: currentColor; content: ""; }
.service-card__toggle::after { transform: translate(-50%,-50%) rotate(90deg); transition: transform .35s ease; }
.service-card__head:hover .service-card__name { transform: translateX(12px); color: var(--blue); }
.service-card__head:hover .service-card__toggle { color: var(--navy); background: var(--blue); transform: rotate(var(--toggle-rotation)) scale(1.06); }
.service-card.is-open .service-card__toggle { --toggle-rotation: 45deg; color: var(--navy); background: var(--blue); }
.service-card__body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .65s var(--ease); }
.service-card.is-open .service-card__body { grid-template-rows: 1fr; }
.service-card__body-inner { display: grid; grid-template-columns: 72px 3fr 2fr 56px; min-height: 0; overflow: hidden; }
.service-card__body-inner > p { grid-column: 2; max-width: 660px; padding: 0 42px clamp(54px, 6vw, 90px) 0; color: rgba(238,221,213,.84); font-size: clamp(17px, 1.7vw, 26px); line-height: 1.5; }
.service-card__body-inner > ul { grid-column: 3; padding-bottom: clamp(54px, 6vw, 90px); }
.service-card__body-inner > ul li { display: flex; gap: 9px; align-items: center; margin-bottom: 10px; color: var(--blue); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.service-card__body-inner > ul li::before { width: 5px; height: 5px; border-radius: 50%; background: currentColor; content: ""; }
/* approach cards */
.approach { overflow: clip; background: var(--beige-soft); }
.section-heading--dark h2 { color: var(--navy); }
.section-heading--dark h2 em { color: #7893b5; }
.approach__stack { padding-top: 3vh; }
.approach-card { position: sticky; top: 104px; display: grid; grid-template-columns: 5fr 7fr; min-height: min(68svh, 760px); margin-bottom: 11vh; overflow: hidden; border: 1px solid rgba(22,47,89,.18); border-radius: var(--radius); box-shadow: 0 24px 80px rgba(13,30,57,.14); }
.approach-card:nth-child(2) { top: 124px; }
.approach-card:nth-child(3) { top: 144px; margin-bottom: 0; }
.approach-card--one { color: var(--beige); background: var(--navy); }
.approach-card--two { color: var(--navy-deep); background: var(--blue); }
.approach-card--three { color: var(--navy); background: var(--beige); }
.approach-card__top { position: absolute; z-index: 2; top: 26px; right: 28px; left: 28px; display: flex; justify-content: space-between; border-bottom: 1px solid currentColor; padding-bottom: 13px; opacity: .65; font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.approach-card__top i { font-size: 17px; font-style: normal; }
.approach-card__content { position: relative; z-index: 2; align-self: end; padding: clamp(70px, 8vw, 130px) clamp(24px, 4vw, 66px) clamp(28px, 4vw, 64px); }
.approach-card__content h3 { font-family: var(--display); font-size: clamp(38px, 5vw, 82px); font-weight: 600; line-height: .92; letter-spacing: -.07em; text-transform: uppercase; }
.approach-card__content p { max-width: 520px; margin-top: 28px; font-size: clamp(14px, 1.2vw, 18px); line-height: 1.65; opacity: .76; }
.approach-card__art { position: relative; min-height: 100%; overflow: hidden; }
.approach-card__art--map { background-image: linear-gradient(rgba(238,221,213,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(238,221,213,.12) 1px, transparent 1px); background-size: 54px 54px; }
.approach-card__art--map svg { display: block; width: 100%; height: 100%; min-height: inherit; overflow: visible; shape-rendering: geometricPrecision; }
.approach-card__art--map path { fill: none; stroke: var(--blue); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.approach-card__art--map circle { stroke: var(--blue); stroke-width: 1.25; vector-effect: non-scaling-stroke; }
.approach-card__art--orbit span { position:absolute;top:50%;left:50%;border:1px solid var(--navy);border-radius:50%;transform:translate(-50%,-50%) rotate(-18deg)}.approach-card__art--orbit span:nth-child(1){width:68%;aspect-ratio:1}.approach-card__art--orbit span:nth-child(2){width:48%;aspect-ratio:1;transform:translate(-50%,-50%) rotate(22deg)}.approach-card__art--orbit span:nth-child(3){width:18%;aspect-ratio:1;background:var(--navy);box-shadow:0 0 0 22px rgba(22,47,89,.12)}
.approach-card__art--grid { background: linear-gradient(135deg, rgba(22,47,89,.06), transparent); }.approach-card__art--grid span{position:absolute;border:1px solid var(--navy);border-radius:16px}.approach-card__art--grid span:nth-child(1){width:39%;height:26%;top:17%;left:12%;background:var(--navy)}.approach-card__art--grid span:nth-child(2){width:25%;height:26%;top:17%;right:16%;background:var(--blue)}.approach-card__art--grid span:nth-child(3){width:28%;height:35%;bottom:13%;left:20%}.approach-card__art--grid span:nth-child(4){width:36%;height:35%;bottom:13%;right:9%;background:rgba(184,204,228,.45)}.approach-card__art--grid i{position:absolute;top:48%;left:10%;width:80%;height:1px;background:var(--navy)}

/* outcomes */
.outcomes { background: var(--beige); }
.outcomes__grid { display: grid; grid-template-columns: 5fr 7fr; gap: clamp(40px, 8vw, 150px); }
.outcomes__intro { position: sticky; top: 120px; align-self: start; }
.outcomes__intro h2 { margin-top: clamp(38px, 6vw, 84px); font-family: var(--display); font-size: clamp(44px, 5.7vw, 92px); font-weight: 600; line-height: .95; letter-spacing: -.075em; text-transform: uppercase; }
.outcomes__intro h2 em { color: #7893b5; font-family: var(--sans); font-weight: 500; font-style: normal; text-transform: none; }
.outcomes__items { border-top: 1px solid var(--line); }
.outcome { display: grid; grid-template-columns: 54px 1fr; padding: clamp(34px, 5vw, 72px) 0; border-bottom: 1px solid var(--line); }
.outcome > span { color: var(--muted); font-size: 10px; font-weight: 800; }
.outcome h3 { font-family: var(--display); font-size: clamp(25px, 3vw, 48px); font-weight: 600; letter-spacing: -.055em; text-transform: uppercase; }
.outcome p { grid-column: 2; max-width: 520px; margin-top: 18px; color: var(--muted); font-size: 15px; line-height: 1.7; }

/* process */
.process { color: var(--beige); background: var(--navy-deep); }
.process::after { position:absolute;right:-15vw;bottom:-24vw;width:54vw;aspect-ratio:1;border:1px solid var(--line-light);border-radius:50%;content:"";pointer-events:none }
.process .container { position:relative;z-index:1 }
.process__list { border-top: 1px solid var(--line-light); }
.process-step { display: grid; grid-template-columns: 80px 1fr auto; gap: 28px; align-items: start; padding: clamp(32px, 5vw, 72px) 0; border-bottom: 1px solid var(--line-light); }
.process-step > span { color: var(--blue); font-size: 10px; font-weight: 800; }
.process-step div { display: grid; grid-template-columns: minmax(220px, .65fr) 1fr; align-items: start; gap: clamp(28px, 6vw, 110px); }
.process-step h3 { font-family: var(--display); font-size: clamp(27px, 3.7vw, 58px); font-weight: 600; line-height: 1; letter-spacing: -.06em; text-transform: uppercase; }
.process-step p { max-width: 580px; color: rgba(238,221,213,.68); font-size: 15px; line-height: 1.7; }
.process-step__action { display:grid;place-items:center;width:48px;height:48px;padding:0;border:1px solid var(--line-light);border-radius:50%;background:transparent;font-size:19px;transition:color .3s ease,background .3s ease,transform .35s var(--ease),border-color .3s ease;cursor:pointer }
.process-step__action span { display:block;line-height:1;transition:transform .35s var(--ease) }
.process-step:hover > .process-step__action,
.process-step__action:hover,
.process-step__action:focus-visible { color:var(--navy);border-color:var(--blue);background:var(--blue);transform:scale(1.04) }
.process-step:hover > .process-step__action span,
.process-step__action:hover span,
.process-step__action:focus-visible span { transform:rotate(45deg) }

/* quick contact dialog */
.contact-dialog { width:min(92vw,460px);max-width:none;margin:auto;padding:0;border:0;color:var(--navy);background:transparent;overflow:visible }
.contact-dialog::backdrop { background:rgba(4,14,31,.58);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px) }
.contact-dialog__panel { position:relative;padding:clamp(28px,4vw,42px);border:1px solid rgba(255,255,255,.66);border-radius:28px;background:linear-gradient(145deg,var(--beige-soft),var(--beige));box-shadow:0 28px 80px rgba(4,14,31,.28);animation:contactDialogIn .42s var(--ease) both }
.contact-dialog__close { position:absolute;top:14px;right:14px;display:grid;place-items:center;width:42px;height:42px;padding:0;border:1px solid rgba(22,47,89,.18);border-radius:50%;background:rgba(255,255,255,.32);font-size:25px;line-height:1;cursor:pointer;transition:color .25s ease,background .25s ease,transform .3s var(--ease) }
.contact-dialog__close:hover,.contact-dialog__close:focus-visible { color:var(--beige);background:var(--navy);transform:rotate(6deg) }
.contact-dialog__eyebrow { padding-right:54px;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase }
.contact-dialog h2 { max-width:390px;margin-top:30px;font-family:var(--display);font-size:clamp(30px,4vw,43px);font-weight:600;line-height:1.02;letter-spacing:-.065em;text-transform:uppercase }
.contact-dialog h2:focus { outline:0 }
.contact-dialog__copy { max-width:360px;margin-top:18px;color:var(--muted);font-size:14px;line-height:1.6 }
.contact-dialog__actions { display:grid;gap:10px;margin-top:30px }
.contact-dialog__option { position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 18px;min-height:78px;padding:15px 16px 15px 19px;border:1px solid rgba(22,47,89,.22);border-radius:18px;transition:color .3s ease,background .3s ease,border-color .3s ease,transform .35s var(--ease) }
.contact-dialog__option > span { color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;transition:color .3s ease }
.contact-dialog__option strong { min-width:0;overflow-wrap:anywhere;font-size:14px }
.contact-dialog__option i { grid-column:2;grid-row:1/3;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;color:var(--beige);background:var(--navy);font-size:16px;font-style:normal;transition:color .3s ease,background .3s ease,transform .35s var(--ease) }
.contact-dialog__option:hover,.contact-dialog__option:focus-visible { color:var(--beige);border-color:var(--navy);background:var(--navy);transform:translateY(-2px) }
.contact-dialog__option:hover > span,.contact-dialog__option:focus-visible > span { color:rgba(238,221,213,.68) }
.contact-dialog__option:hover i,.contact-dialog__option:focus-visible i { color:var(--navy);background:var(--blue);transform:rotate(45deg) }
.contact-dialog__option--primary { color:var(--beige);border-color:var(--navy);background:var(--navy) }
.contact-dialog__option--primary > span { color:rgba(238,221,213,.68) }
.contact-dialog__option--primary i { color:var(--navy);background:var(--blue) }
@keyframes contactDialogIn { from{opacity:0;transform:translateY(18px) scale(.97)} to{opacity:1;transform:translateY(0) scale(1)} }

/* contact */
.contact { min-height: 100svh; display:grid;align-items:center;overflow:hidden;color:var(--navy);background:var(--blue) }
.contact__rings { position:absolute;inset:0;pointer-events:none }.contact__rings span{position:absolute;top:50%;left:50%;aspect-ratio:1;border:1px solid rgba(22,47,89,.17);border-radius:50%;transform:translate(-50%,-50%)}.contact__rings span:nth-child(1){width:36vw}.contact__rings span:nth-child(2){width:62vw}.contact__rings span:nth-child(3){width:92vw}
.contact__inner { position:relative;z-index:1 }
.contact__pretitle { margin-top: clamp(60px, 8vw, 120px); font-size: clamp(15px, 1.4vw, 21px); }
.contact h2 { max-width: 1320px; margin-top: 24px; font-family: var(--display); font-size: clamp(48px, 8.1vw, 132px); font-weight: 600; line-height: .9; letter-spacing: -.08em; text-transform: uppercase; }
.contact h2 em { color: var(--beige); font-family: var(--sans); font-weight: 500; font-style: normal; text-transform: none; }
.contact__copy { max-width: 600px; margin-top: clamp(30px, 4vw, 56px); font-size: clamp(15px, 1.35vw, 20px); line-height: 1.65; }
.contact__actions { display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(30px,4vw,58px) }
.contact-link { display:inline-flex;align-items:center;justify-content:space-between;gap:30px;min-height:62px;padding:9px 9px 9px 24px;border:1px solid rgba(22,47,89,.34);border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;transition:transform .35s var(--ease),color .3s ease,background .3s ease }.contact-link i{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;color:var(--beige);background:var(--navy);font-size:17px;font-style:normal;transition:transform .35s var(--ease)}.contact-link:hover{transform:translateY(-4px);color:var(--beige);background:var(--navy)}.contact-link:hover i{color:var(--navy);background:var(--beige);transform:rotate(45deg)}.contact-link--primary{color:var(--beige);background:var(--navy)}.contact-link--primary i{color:var(--navy);background:var(--beige)}

/* footer */
.footer { overflow:hidden;contain:paint;color:var(--navy);background:var(--beige-soft);padding-top:clamp(70px,8vw,120px) }
.footer__top { display:grid;grid-template-columns:3fr 3fr 2fr 2fr;gap:32px;padding-bottom:clamp(70px,8vw,120px) }
.brand--footer .brand__mark { width:52px;height:52px;border-radius:16px }.brand--footer .brand__name{font-size:17px}
.footer__top > p { color:var(--muted);font-size:15px;line-height:1.65 }
.footer nav,.footer__contacts { display:grid;align-content:start;gap:10px;font-size:13px;font-weight:700 }.footer nav a,.footer__contacts a{width:max-content}.footer nav a:hover,.footer__contacts a:hover{text-decoration:underline;text-underline-offset:4px}
.footer__word { width:100%;overflow:hidden;margin-left:-.025em;font-family:var(--display);font-size:clamp(64px,12.45vw,205px);font-weight:700;line-height:.72;letter-spacing:-.095em;color:var(--navy);white-space:nowrap }
.footer__bottom { display:flex;justify-content:space-between;gap:24px;padding-block:25px;border-top:1px solid var(--line);font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase }

/* standalone contact choice page */
.contact-choice-page { position:relative;display:grid;grid-template-rows:auto 1fr auto;min-height:100svh;overflow:hidden;color:var(--navy);background:var(--beige) }
.contact-choice-page::before,.contact-choice-page::after { position:absolute;border:1px solid rgba(22,47,89,.11);border-radius:50%;content:"";pointer-events:none }
.contact-choice-page::before { top:-38vw;right:-16vw;width:min(76vw,1080px);aspect-ratio:1 }
.contact-choice-page::after { bottom:-30vw;left:-22vw;width:min(62vw,900px);aspect-ratio:1 }
.contact-choice-page__header,.contact-choice-page__main,.contact-choice-page__footer { position:relative;z-index:1;width:min(100% - (var(--gutter) * 2),var(--container));margin-inline:auto }
.contact-choice-page__header { display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:clamp(18px,2vw,26px);border-bottom:1px solid var(--line) }
.contact-choice-page__brand { display:inline-flex;align-items:center;gap:12px;font-size:13px;font-weight:800;letter-spacing:-.02em }
.contact-choice-page__brand-mark { display:grid;place-items:center;width:42px;height:42px;border-radius:13px;color:var(--beige);background:var(--navy);font-size:13px }
.contact-choice-page__language { display:flex;align-items:center;gap:18px;font-size:10px;font-weight:800;letter-spacing:.06em }
.contact-choice-page__language a { padding:8px 2px;opacity:.46;transition:opacity .25s ease,transform .3s var(--ease) }
.contact-choice-page__language a:hover,.contact-choice-page__language a:focus-visible,.contact-choice-page__language a[aria-current="page"] { opacity:1;transform:translateY(-1px) }
.contact-choice-page__main { display:grid;align-content:center;min-height:0;padding-block:clamp(36px,3.5vw,52px) }
.contact-choice-page__eyebrow { color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase }
.contact-choice-page h1 { max-width:1260px;margin-top:clamp(20px,2vw,28px);font-family:var(--display);font-size:clamp(44px,6.4vw,102px);font-weight:600;line-height:.91;letter-spacing:-.08em;text-transform:uppercase }
.contact-choice-page__copy { max-width:620px;margin-top:clamp(22px,2.4vw,32px);color:var(--muted);font-size:clamp(15px,1.35vw,20px);line-height:1.65 }
.contact-choice-page__options { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:1260px;margin-top:clamp(28px,3vw,42px) }
.contact-choice-page__option { position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 24px;min-height:clamp(118px,10vw,148px);padding:clamp(22px,3vw,38px);border:1px solid rgba(22,47,89,.24);border-radius:var(--radius);background:rgba(248,241,236,.28);transition:color .35s ease,background .35s ease,border-color .35s ease,transform .4s var(--ease) }
.contact-choice-page__option > span { color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;transition:color .35s ease }
.contact-choice-page__option strong { min-width:0;overflow-wrap:anywhere;font-size:clamp(16px,1.7vw,24px) }
.contact-choice-page__option i { grid-column:2;grid-row:1/3;display:grid;place-items:center;width:54px;height:54px;border-radius:50%;color:var(--beige);background:var(--navy);font-size:21px;font-style:normal;transition:color .35s ease,background .35s ease,transform .4s var(--ease) }
.contact-choice-page__option:hover,.contact-choice-page__option:focus-visible { color:var(--beige);border-color:var(--navy);background:var(--navy);transform:translateY(-5px) }
.contact-choice-page__option:hover > span,.contact-choice-page__option:focus-visible > span { color:rgba(238,221,213,.65) }
.contact-choice-page__option:hover i,.contact-choice-page__option:focus-visible i { color:var(--navy);background:var(--blue);transform:rotate(45deg) }
.contact-choice-page__option--primary { color:var(--beige);border-color:var(--navy);background:var(--navy) }
.contact-choice-page__option--primary > span { color:rgba(238,221,213,.65) }
.contact-choice-page__option--primary i { color:var(--navy);background:var(--blue) }
.contact-choice-page__back { width:max-content;margin-top:clamp(24px,2.3vw,30px);padding-bottom:5px;border-bottom:1px solid rgba(22,47,89,.42);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;transition:opacity .25s ease }
.contact-choice-page__back:hover { opacity:.58 }
.contact-choice-page__footer { display:flex;justify-content:space-between;gap:20px;padding-block:22px;border-top:1px solid var(--line);font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase }

/* reveal system */
.js .reveal { opacity:0;transform:translateY(30px);transition:opacity .8s var(--ease),transform .8s var(--ease) }
.js .reveal.is-visible { opacity:1;transform:translateY(0) }

/* custom cursor */
.cursor { display:none }
@media (pointer:fine) and (hover:hover) {
  .has-custom-cursor, .has-custom-cursor a, .has-custom-cursor button { cursor:none }
  .has-custom-cursor .cursor { --hover-scale:1;--press-scale:1;position:fixed;z-index:10001;top:0;left:0;display:grid;place-items:center;width:64px;height:64px;border:0;background:transparent;transform:translate3d(-100px,-100px,0);mix-blend-mode:difference;pointer-events:none;will-change:transform }
  .has-custom-cursor .cursor::before { position:absolute;inset:13px;border:1.5px solid #fff;border-radius:50%;content:"";transform:scale(var(--hover-scale)) scale(var(--press-scale));transition:transform 240ms var(--ease);will-change:transform }
  .has-custom-cursor .cursor span { width:4px;height:4px;border-radius:50%;background:#fff;transform:scale(var(--press-scale));transition:transform 240ms var(--ease) }
  .has-custom-cursor .cursor.is-active { --hover-scale:1.5 }
  .has-custom-cursor .cursor.is-pressed { --press-scale:1.12 }
}

/* interactive test lab: composed motion scenes and restrained control feedback */
.interaction-lab .footer__word {
  transform: translate3d(var(--footer-drift-x, 0px), 0, 0);
  will-change: transform;
}

@keyframes labMapFlow {
  to { stroke-dashoffset: -96; }
}

@keyframes labNodeBreathe {
  0%, 100% { stroke-opacity: 1; }
  50% { stroke-opacity: .45; }
}

@keyframes labOrbitOuter {
  to { transform: translate(-50%, -50%) rotate(342deg); }
}

@keyframes labOrbitMiddle {
  to { transform: translate(-50%, -50%) rotate(-338deg); }
}

@keyframes labOrbitCore {
  50% { box-shadow: 0 0 0 34px rgba(22,47,89,.07); }
}

@keyframes labGridFloat {
  50% { transform: translate3d(0, -7px, 0); }
}

/* motion-graphics choreography: masked type, drawn rules and staged scenes */
@media (prefers-reduced-motion:no-preference) {
  .interaction-lab .premium-site__meta,
  .interaction-lab .premium-site__eyebrow,
  .interaction-lab .premium-site h1 > span,
  .interaction-lab .premium-site__bottom {
    will-change: opacity, transform, clip-path;
  }

  .interaction-lab .premium-site__meta {
    clip-path: inset(0 0 var(--hero-meta-clip, -5%) 0);
    opacity: var(--hero-meta-opacity, 1);
    transform: translateY(var(--hero-meta-y, 0px));
  }

  .interaction-lab .premium-site__eyebrow {
    clip-path: inset(0 0 var(--hero-eyebrow-clip, -5%) 0);
    opacity: var(--hero-eyebrow-opacity, 1);
    transform: translateY(var(--hero-eyebrow-y, 0px));
  }

  .interaction-lab .premium-site h1 > span:nth-child(1) {
    clip-path: inset(-18% -2% var(--hero-line-1-clip, -5%) -2%);
    opacity: var(--hero-line-1-opacity, 1);
    transform: translateY(var(--hero-line-1-y, 0px));
  }
  .interaction-lab .premium-site h1 > span:nth-child(2) {
    clip-path: inset(-18% -2% var(--hero-line-2-clip, -5%) -2%);
    opacity: var(--hero-line-2-opacity, 1);
    transform: translateY(var(--hero-line-2-y, 0px));
  }
  .interaction-lab .premium-site h1 > span:nth-child(3) {
    clip-path: inset(-18% -2% var(--hero-line-3-clip, -5%) -2%);
    opacity: var(--hero-line-3-opacity, 1);
    transform: translateY(var(--hero-line-3-y, 0px));
  }
  .interaction-lab .premium-site h1 > span:nth-child(4) {
    clip-path: inset(-18% -2% var(--hero-line-4-clip, -5%) -2%);
    opacity: var(--hero-line-4-opacity, 1);
    transform: translateY(var(--hero-line-4-y, 0px));
  }

  .interaction-lab .premium-site__bottom {
    clip-path: inset(0 0 var(--hero-bottom-clip, -5%) 0);
    opacity: var(--hero-bottom-opacity, 1);
    transform: translateY(var(--hero-bottom-y, 0px));
  }

  .js .interaction-lab :where(
    .section-heading h2.reveal,
    .outcomes__intro h2.reveal,
    .contact h2.reveal,
    .manifesto__statement.reveal
  ) {
    clip-path: inset(0 0 88% 0);
    opacity: .01;
    transform: translate3d(0, 46px, 0) skewY(1.4deg);
    transform-origin: left bottom;
    transition:
      clip-path 1.05s cubic-bezier(.2,.8,.2,1),
      transform 1.05s cubic-bezier(.2,.8,.2,1),
      opacity .26s ease;
  }

  .js .interaction-lab :where(
    .section-heading h2.reveal.is-visible,
    .outcomes__intro h2.reveal.is-visible,
    .contact h2.reveal.is-visible,
    .manifesto__statement.reveal.is-visible
  ) {
    clip-path: inset(-5% 0 -5% 0);
    opacity: 1;
    transform: translate3d(0, 0, 0) skewY(0);
  }

  .js .interaction-lab .manifesto__statement.reveal em {
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    background-image: linear-gradient(transparent 72%, rgba(184,204,228,.62) 72%);
    background-repeat: no-repeat;
    background-size: 0 100%;
    transition: background-size .85s var(--ease) .48s, color .45s ease, text-shadow .45s ease;
  }

  .js .interaction-lab .manifesto__statement.reveal.is-visible em { background-size: 100% 100%; }

  .js .interaction-lab :where(.section-kicker.reveal) span,
  .js .interaction-lab :where(.section-kicker.reveal) p {
    opacity: 0;
    transition: opacity .55s ease, transform .75s var(--ease);
  }

  .js .interaction-lab :where(.section-kicker.reveal) span { transform: scale(.35) rotate(-90deg); }
  .js .interaction-lab :where(.section-kicker.reveal) p { transform: translateX(-18px); }
  .js .interaction-lab :where(.section-kicker.reveal.is-visible) span { opacity: 1; transform: scale(1) rotate(0); }
  .js .interaction-lab :where(.section-kicker.reveal.is-visible) p { opacity: 1; transform: translateX(0); transition-delay: .1s; }

  .js .interaction-lab :where(.service-card.reveal) {
    opacity: 1;
    transform: none;
  }

  .js .interaction-lab :where(.service-card.reveal) .service-card__num,
  .js .interaction-lab :where(.service-card.reveal) .service-card__name,
  .js .interaction-lab :where(.service-card.reveal) .service-card__short,
  .js .interaction-lab :where(.service-card.reveal) .service-card__toggle {
    opacity: 0;
  }

  .js .interaction-lab :where(.service-card.reveal) .service-card__num { transform: translateY(-16px); transition: opacity .55s ease, transform .7s var(--ease); }
  .js .interaction-lab :where(.service-card.reveal) .service-card__name { transform: translateY(28px); transition: opacity .7s ease, transform .85s var(--ease), color .3s ease; }
  .js .interaction-lab :where(.service-card.reveal) .service-card__short { transform: translateX(24px); transition: opacity .65s ease, transform .8s var(--ease); }
  .js .interaction-lab :where(.service-card.reveal) .service-card__toggle { clip-path: circle(0 at 50% 50%); transition: opacity .55s ease, clip-path .75s var(--ease), color .3s ease, background .3s ease, transform .45s var(--ease); }

  .js .interaction-lab :where(.service-card.reveal.is-visible) .service-card__num,
  .js .interaction-lab :where(.service-card.reveal.is-visible) .service-card__name,
  .js .interaction-lab :where(.service-card.reveal.is-visible) .service-card__short {
    opacity: 1;
    transform: translate(0, 0);
  }

  .js .interaction-lab :where(.service-card.reveal.is-visible) .service-card__name { transition-delay: .08s; }
  .js .interaction-lab :where(.service-card.reveal.is-visible) .service-card__short { transition-delay: .16s; }
  .js .interaction-lab :where(.service-card.reveal.is-visible) .service-card__toggle { clip-path: circle(75% at 50% 50%); opacity: 1; transition-delay: .22s; }

  .interaction-lab .service-card { border-top-color: transparent; }
  .interaction-lab .service-card::after {
    position: absolute;
    z-index: 2;
    top: 0;
    right: 0;
    left: 0;
    height: 1px;
    background: var(--line-light);
    content: "";
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 1.05s var(--ease);
    pointer-events: none;
  }
  .interaction-lab .service-card.is-visible::after { transform: scaleX(1); }

  .interaction-lab .service-card__body-inner > p,
  .interaction-lab .service-card__body-inner > ul li {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .28s ease, transform .35s var(--ease);
  }

  .interaction-lab .service-card.is-open .service-card__body-inner > p,
  .interaction-lab .service-card.is-open .service-card__body-inner > ul li {
    opacity: 1;
    transform: translateY(0);
  }

  .interaction-lab .service-card.is-open .service-card__body-inner > p {
    transition-duration: .46s, .46s;
    transition-delay: .12s;
  }
  .interaction-lab .service-card.is-open .service-card__body-inner > ul li { transition-duration: .36s, .42s; }
  .interaction-lab .service-card.is-open .service-card__body-inner > ul li:nth-child(1) { transition-delay: .2s; }
  .interaction-lab .service-card.is-open .service-card__body-inner > ul li:nth-child(2) { transition-delay: .25s; }
  .interaction-lab .service-card.is-open .service-card__body-inner > ul li:nth-child(3) { transition-delay: .3s; }
  .interaction-lab .service-card.is-open .service-card__body-inner > ul li:nth-child(4) { transition-delay: .35s; }

  .interaction-lab .service-card.reveal.is-visible.is-open .service-card__name {
    color: var(--blue);
    transform: translateX(12px);
  }

  .js .interaction-lab :where(.outcome.reveal, .process-step.reveal) {
    opacity: 1;
    transform: none;
  }

  .js .interaction-lab :where(.outcome.reveal, .process-step.reveal) > span,
  .js .interaction-lab :where(.outcome.reveal, .process-step.reveal) h3,
  .js .interaction-lab :where(.outcome.reveal, .process-step.reveal) p,
  .js .interaction-lab :where(.process-step.reveal) > .process-step__action {
    opacity: 0;
  }

  .js .interaction-lab :where(.outcome.reveal, .process-step.reveal) > span { transform: translateY(-15px); transition: opacity .5s ease, transform .65s var(--ease); }
  .js .interaction-lab :where(.outcome.reveal, .process-step.reveal) h3 { clip-path: inset(0 0 100% 0); transform: translateY(26px); transition: opacity .7s ease, clip-path .9s var(--ease), transform .9s var(--ease), color .35s ease; }
  .js .interaction-lab :where(.outcome.reveal, .process-step.reveal) p { transform: translateY(20px); transition: opacity .65s ease, transform .85s var(--ease), color .35s ease; }
  .js .interaction-lab :where(.process-step.reveal) > .process-step__action { clip-path: circle(0 at 50% 50%); transition: opacity .5s ease, clip-path .7s var(--ease), color .3s ease, background .3s ease, transform .35s var(--ease); }

  .js .interaction-lab :where(.outcome.reveal.is-visible, .process-step.reveal.is-visible) > span,
  .js .interaction-lab :where(.outcome.reveal.is-visible, .process-step.reveal.is-visible) h3,
  .js .interaction-lab :where(.outcome.reveal.is-visible, .process-step.reveal.is-visible) p {
    opacity: 1;
    transform: translate(0, 0);
  }

  .js .interaction-lab :where(.outcome.reveal.is-visible, .process-step.reveal.is-visible) h3 { clip-path: inset(-4% 0 -4% 0); transition-delay: .08s; }
  .js .interaction-lab :where(.outcome.reveal.is-visible, .process-step.reveal.is-visible) p { transition-delay: .18s; }
  .js .interaction-lab :where(.process-step.reveal.is-visible) > .process-step__action { clip-path: circle(75% at 50% 50%); opacity: 1; transition-delay: .22s; }

  .interaction-lab .process__list {
    position: relative;
    --process-progress: 0;
  }

  .interaction-lab .process__list::before,
  .interaction-lab .process__list::after {
    position: absolute;
    z-index: 0;
    top: 0;
    bottom: 0;
    left: 52px;
    width: 1px;
    content: "";
    transform-origin: top center;
    pointer-events: none;
  }
  .interaction-lab .process__list::before { background: rgba(238,221,213,.12); }
  .interaction-lab .process__list::after { background: var(--blue); box-shadow: 0 0 18px rgba(184,204,228,.48); transform: scaleY(var(--process-progress)); }

  .interaction-lab .process-step > span {
    position: relative;
    transition: opacity .5s ease, transform .65s var(--ease), color .35s ease;
  }
  .interaction-lab .process-step > span::after {
    position: absolute;
    z-index: 3;
    top: 1px;
    right: 23px;
    width: 9px;
    height: 9px;
    border: 1px solid var(--blue);
    border-radius: 50%;
    background: var(--navy-deep);
    content: "";
    transform: scale(.65);
    transition: transform .45s var(--ease), background .35s ease, box-shadow .35s ease;
  }
  .interaction-lab .process-step.is-process-past > span { color: var(--beige); }
  .interaction-lab .process-step.is-process-past > span::after { background: var(--blue); }
  .interaction-lab .process-step.is-process-active > span { color: var(--beige); }
  .interaction-lab .process-step.is-process-active > span::after {
    background: var(--blue);
    box-shadow: 0 0 0 6px rgba(184,204,228,.13), 0 0 18px rgba(184,204,228,.54);
    transform: scale(1);
  }
  .interaction-lab .process-step.is-process-active h3 { color: var(--blue); }
  .interaction-lab .process-step.is-process-active > .process-step__action { color:var(--navy);border-color:var(--blue);background:var(--blue);transform:scale(1.04) }
  .interaction-lab .process-step.is-process-active > .process-step__action span { transform:rotate(45deg) }

  .interaction-lab .approach-card[data-motion-scene] .approach-card__top { border-bottom-color: transparent; }
  .interaction-lab .approach-card[data-motion-scene] .approach-card__top::after {
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 1px;
    background: currentColor;
    content: "";
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 1s var(--ease) .12s;
  }

  .interaction-lab .approach-card[data-motion-scene] .approach-card__content h3 {
    clip-path: inset(0 0 100% 0);
    opacity: .01;
    transform: translateY(35px);
    transition: clip-path .95s var(--ease) .08s, opacity .25s ease .08s, transform .95s var(--ease) .08s;
  }

  .interaction-lab .approach-card[data-motion-scene] .approach-card__content p {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .7s ease .32s, transform .85s var(--ease) .32s;
  }

  .interaction-lab .approach-card[data-motion-scene] .approach-card__art {
    clip-path: inset(0 100% 0 0);
    opacity: .25;
    transition: transform .8s var(--ease), clip-path 1.15s var(--ease) .16s, opacity .5s ease .16s;
  }

  .interaction-lab .approach-card[data-motion-scene].is-motion-visible .approach-card__top::after { transform: scaleX(1); }
  .interaction-lab .approach-card[data-motion-scene].is-motion-visible .approach-card__content h3 { clip-path: inset(-4% 0 -4% 0); opacity: 1; transform: translateY(0); }
  .interaction-lab .approach-card[data-motion-scene].is-motion-visible .approach-card__content p { opacity: .76; transform: translateY(0); }
  .interaction-lab .approach-card[data-motion-scene].is-motion-visible .approach-card__art { clip-path: inset(0); opacity: 1; }

  .interaction-lab .manifesto::before,
  .interaction-lab .process::after {
    opacity: 0;
    transform: scale(.78);
    transition: opacity 1s ease .2s, transform 1.4s var(--ease) .2s;
  }
  .interaction-lab .manifesto::before { transform-origin: top right; }
  .interaction-lab .process::after { transform-origin: bottom right; }
  .interaction-lab .manifesto.is-motion-visible::before,
  .interaction-lab .process.is-motion-visible::after { opacity: 1; transform: scale(1); }

  .interaction-lab .services::before { opacity: 0; transition: opacity 1.3s ease .16s; }
  .interaction-lab .services.is-motion-visible::before { opacity: .32; }

  .interaction-lab .contact__rings span {
    --ring-enter-scale: .74;
    --ring-delay: 0s;
    opacity: 0;
    transform: translate(-50%,-50%) scale(var(--ring-enter-scale));
    transition: opacity .8s ease var(--ring-delay), transform 1.15s var(--ease) var(--ring-delay);
  }
  .interaction-lab .contact__rings span:nth-child(2) { --ring-delay: .1s; }
  .interaction-lab .contact__rings span:nth-child(3) { --ring-delay: .2s; }
  .interaction-lab .contact.is-motion-visible .contact__rings span { --ring-enter-scale: 1; opacity: 1; }

  .interaction-lab .footer[data-motion-scene] .footer__top > *,
  .interaction-lab .footer[data-motion-scene] .footer__bottom {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s ease, transform .85s var(--ease);
  }
  .interaction-lab .footer[data-motion-scene] .footer__top > :nth-child(2) { transition-delay: .08s; }
  .interaction-lab .footer[data-motion-scene] .footer__top > :nth-child(3) { transition-delay: .16s; }
  .interaction-lab .footer[data-motion-scene] .footer__top > :nth-child(4) { transition-delay: .24s; }
  .interaction-lab .footer[data-motion-scene] .footer__word {
    clip-path: inset(0 0 100% 0);
    opacity: .08;
    letter-spacing: -.02em;
    transition: clip-path 1.15s var(--ease) .2s, opacity .5s ease .2s, letter-spacing 1.15s var(--ease) .2s;
  }
  .interaction-lab .footer[data-motion-scene].is-motion-visible .footer__top > *,
  .interaction-lab .footer[data-motion-scene].is-motion-visible .footer__bottom { opacity: 1; transform: translateY(0); }
  .interaction-lab .footer[data-motion-scene].is-motion-visible .footer__bottom { transition-delay: .32s; }
  .interaction-lab .footer[data-motion-scene].is-motion-visible .footer__word { clip-path: inset(-5% 0 -5% 0); opacity: 1; letter-spacing: -.095em; }
}

@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .interaction-lab .header__cta,
  .interaction-lab .contact-link {
    --control-lift: 0px;
    --control-scale: 1;
    transform: translate3d(
      var(--magnetic-x, 0px),
      calc(var(--magnetic-y, 0px) + var(--control-lift)),
      0
    ) scale(var(--control-scale));
    will-change: transform;
  }

  .interaction-lab .pill-button {
    --control-lift: 0px;
    --control-scale: 1;
    transform: translate3d(0, var(--control-lift), 0) scale(var(--control-scale));
    will-change: transform;
    transition: transform .35s var(--ease), box-shadow .35s ease, background .35s ease, border-color .35s ease;
  }

  .interaction-lab .header__cta,
  .interaction-lab .contact-link {
    transition: transform .35s var(--ease), color .3s ease, background .3s ease, box-shadow .35s ease;
  }

  .interaction-lab .pill-button:is(:hover, :focus-visible) {
    --control-lift: -4px;
    --control-scale: 1;
  }

  .interaction-lab .pill-button:active {
    --control-lift: -1px;
    --control-scale: .985;
  }

  .interaction-lab .header__cta:is(:hover, :focus-visible) {
    --control-lift: -2px;
    color: var(--beige);
    background: var(--navy);
    box-shadow: 0 13px 30px rgba(13,30,57,.17);
  }

  .interaction-lab .header__cta:is(:hover, :focus-visible) i {
    color: var(--navy);
    background: var(--blue);
    transform: rotate(45deg);
  }

  .interaction-lab .contact-link:is(:hover, :focus-visible) {
    --control-lift: -4px;
    color: var(--beige);
    background: var(--navy);
    box-shadow: 0 18px 40px rgba(13,30,57,.17);
  }

  .interaction-lab .contact-link:is(:hover, :focus-visible) i {
    color: var(--navy);
    background: var(--beige);
    transform: rotate(45deg);
  }

  .interaction-lab .brand__mark {
    transition: transform .45s var(--ease), border-radius .45s var(--ease), box-shadow .35s ease;
  }

  .interaction-lab .brand:is(:hover, :focus-visible) .brand__mark {
    transform: rotate(-7deg) scale(1.06);
    border-radius: 50%;
    box-shadow: 0 10px 24px rgba(13,30,57,.17);
  }

  .interaction-lab .service-card.reveal.is-visible .service-card__head:is(:hover, :focus-visible) .service-card__name {
    transform: translateX(12px);
    color: var(--blue);
  }

  .interaction-lab .service-card__head:focus-visible .service-card__toggle {
    color: var(--navy);
    background: var(--blue);
    transform: rotate(var(--toggle-rotation)) scale(1.06);
  }

  .interaction-lab .outcome:hover h3,
  .interaction-lab .outcome:hover p,
  .interaction-lab .process-step:hover h3,
  .interaction-lab .process-step:hover p {
    transform: translateX(8px);
  }

  .interaction-lab .outcome:hover h3 { color: #31547e; }
  .interaction-lab .process-step:hover h3 { color: var(--blue); }
  .interaction-lab .process-step:hover > .process-step__action { color:var(--navy);border-color:var(--blue);background:var(--blue);transform:scale(1.05) }

  .interaction-lab .approach-card:hover .approach-card__top i { transform: rotate(45deg); }
  .interaction-lab .approach-card__top i { transition: transform .45s var(--ease); }

  .interaction-lab .approach-map__edges path {
    stroke-dasharray: 18 14;
    animation: labMapFlow 8s linear infinite;
  }

  .interaction-lab .approach-map__edges path:nth-child(2) { animation-delay: -2.6s; }
  .interaction-lab .approach-map__edges path:nth-child(3) { animation-delay: -5.2s; }
  .interaction-lab .approach-map__nodes circle { fill-opacity: 1; animation: labNodeBreathe 3.8s ease-in-out infinite; }
  .interaction-lab .approach-map__nodes circle:nth-child(2) { animation-delay: -1.25s; }
  .interaction-lab .approach-map__nodes circle:nth-child(3) { animation-delay: -2.5s; }

  .interaction-lab .approach-card__art--orbit span:nth-child(1) { animation: labOrbitOuter 24s linear infinite; }
  .interaction-lab .approach-card__art--orbit span:nth-child(2) { animation: labOrbitMiddle 19s linear infinite; }
  .interaction-lab .approach-card__art--orbit span:nth-child(3) { animation: labOrbitCore 4.8s ease-in-out infinite; }

  .interaction-lab .approach-card__art--grid span { animation: labGridFloat 5.8s var(--ease) infinite; }
  .interaction-lab .approach-card__art--grid span:nth-child(2) { animation-delay: -1.4s; animation-direction: reverse; }
  .interaction-lab .approach-card__art--grid span:nth-child(3) { animation-delay: -2.8s; }
  .interaction-lab .approach-card__art--grid span:nth-child(4) { animation-delay: -4.2s; animation-direction: reverse; }

  .interaction-lab .contact:hover .contact__rings span { border-color: rgba(22,47,89,.26); }

  .interaction-lab .manifesto__statement em {
    transition: color .45s ease, text-shadow .45s ease;
  }

  .interaction-lab .manifesto__statement:hover em {
    color: #345d8d;
    text-shadow: 0 12px 36px rgba(22,47,89,.12);
  }
}

@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .interaction-lab .approach-card[data-motion-scene] .approach-map__edges path,
  .interaction-lab .approach-card[data-motion-scene] .approach-map__nodes circle,
  .interaction-lab .approach-card[data-motion-scene] .approach-card__art--orbit span,
  .interaction-lab .approach-card[data-motion-scene] .approach-card__art--grid span {
    animation-play-state: paused;
  }

  .interaction-lab .approach-card[data-motion-scene].is-motion-visible .approach-map__edges path,
  .interaction-lab .approach-card[data-motion-scene].is-motion-visible .approach-map__nodes circle,
  .interaction-lab .approach-card[data-motion-scene].is-motion-visible .approach-card__art--orbit span,
  .interaction-lab .approach-card[data-motion-scene].is-motion-visible .approach-card__art--grid span {
    animation-play-state: running;
  }
}

@media (max-width: 1100px) {
  .section-heading { grid-template-columns: 2fr 8fr; }
  .premium-site__content { width: 84%; }
  .premium-site h1 { font-size: clamp(40px, 7vw, 78px); }
  .service-card__head { grid-template-columns: 60px 3fr 2fr 50px; }
  .service-card__body-inner { grid-template-columns: 60px 3fr 2fr 50px; }
  .approach-card { grid-template-columns: 1fr 1fr; }
  .outcomes__grid { gap: 55px; }
}

@media (max-width: 820px) {
  :root { --gutter: 20px; }
  .section { padding-block: 104px; }
  .header { grid-template-columns: 1fr auto; min-height: 70px; }
  .header__nav,.header__cta,.language-switch--header { display:none }
  .menu-toggle { position:relative;display:grid;place-items:center;width:46px;height:46px;padding:0;border:1px solid rgba(22,47,89,.28);border-radius:14px;background:rgba(238,221,213,.74) }
  .menu-toggle span { position:absolute;width:18px;height:1.5px;background:var(--navy);transition:transform .35s var(--ease),top .35s var(--ease) }.menu-toggle span:first-child{top:19px}.menu-toggle span:last-child{top:25px}.menu-toggle[aria-expanded="true"] span:first-child{top:23px;transform:rotate(45deg)}.menu-toggle[aria-expanded="true"] span:last-child{top:23px;transform:rotate(-45deg)}
  .mobile-menu .language-switch--mobile { --language-option:var(--blue);--language-glow:rgba(184,204,228,.28);display:inline-flex;align-self:center;width:auto;margin-top:24px;gap:28px }
  .language-switch--mobile .language-switch__option { padding-block:8px }
  .intro { height: 205svh; }
  .intro__sticky { min-height: 540px; }
  .site-frame { min-height: 430px; }
  .site-frame__chrome { min-height: 40px; padding: 0 12px; }
  .template-site { inset:40px 0 0;padding:16px }
  .template-site__nav { grid-template-columns:1fr auto }.template-site__nav div{display:none}
  .template-site__hero { padding:50px 10px 28px }.template-site__hero h2{font-size:clamp(31px,8vw,50px)}
  .template-site__cards article { min-height:84px }.template-site__cards article:nth-child(3){display:none}.template-site__cards{grid-template-columns:1fr 1fr}
  .premium-site__art { object-position:62% center }
  .premium-site__shade { background:linear-gradient(90deg,rgba(238,221,213,.96),rgba(238,221,213,.77) 60%,rgba(238,221,213,.25)) }
  .premium-site__meta { top:84px }
  .premium-site__content { width:100%;padding:92px 24px 32px }
  .premium-site h1 { font-size:clamp(37px,8.7vw,67px) }
  .premium-site__bottom { grid-template-columns:1fr;align-items:start;margin-top:28px }.premium-site__bottom p{max-width:390px}.pill-button{min-width:196px;min-height:52px;width:max-content}
  .intro__caption { right:20px;bottom:16px;left:20px }.intro__caption div{width:18vw}.intro__scroll{display:none}
  .manifesto__grid { grid-template-columns:1fr }.manifesto__body{grid-template-columns:1fr}.manifesto__statement{grid-column:1}.manifesto__aside{max-width:390px;margin-top:42px}
  .section-heading { grid-template-columns:1fr;gap:32px }.section-heading h2{grid-column:1;font-size:clamp(38px,9vw,67px)}
  .service-card__head { grid-template-columns:43px 1fr 46px;min-height:116px }.service-card__num{padding-top:28px}.service-card__short{grid-column:2;grid-row:2;margin-top:-24px;margin-bottom:21px}.service-card__toggle{grid-column:3;grid-row:1/3}.service-card__body-inner{grid-template-columns:43px 1fr}.service-card__body-inner>p{grid-column:2;padding-right:0}.service-card__body-inner>ul{grid-column:2}
  .approach-card { position:relative!important;top:auto!important;grid-template-columns:1fr;min-height:650px;margin-bottom:20px }.approach-card__content{align-self:start;padding-top:100px}.approach-card__art{min-height:270px;order:2}
  .interaction-lab .approach-card__art { transform:none;transition:clip-path 1.15s var(--ease) .16s,opacity .5s ease .16s;will-change:auto }
  .outcomes__grid { grid-template-columns:1fr }.outcomes__intro{position:static}.outcome{grid-template-columns:43px 1fr}
  .process-step { grid-template-columns:48px 1fr auto;gap:14px }.process-step div{grid-template-columns:1fr;gap:18px}.process-step__action{width:44px;height:44px}
  .interaction-lab .process__list::before,.interaction-lab .process__list::after,.interaction-lab .process-step>span::after{display:none}
  .contact__rings span:nth-child(1){width:70vw}.contact__rings span:nth-child(2){width:120vw}.contact__rings span:nth-child(3){width:180vw}
  .footer__top { grid-template-columns:1fr 1fr }.footer__top>p{grid-column:2}.footer__word{font-size:15vw}
  .contact-choice-page__options{grid-template-columns:1fr;max-width:720px}.contact-choice-page__option{min-height:126px}.contact-choice-page h1{font-size:clamp(46px,10vw,78px)}
}

@media (max-width: 540px) {
  :root { --gutter: 16px; }
  .brand__name { font-size:12px }.brand__mark{width:37px;height:37px;border-radius:11px}
  .preloader__top,.preloader__bottom{right:16px;left:16px}.preloader__bottom span:last-child{display:none}
  .language-switch--intro{top:max(10px,env(safe-area-inset-top));gap:20px}.language-switch__option{padding:7px 2px;font-size:9px}
  .intro { height: 190svh; }
  .site-frame { min-height: 390px; }
  .site-frame__chrome { font-size:8px }
  .template-site__hero { padding-top:58px }.template-site__hero>span{max-width:220px;line-height:1.4}.template-site__hero p{max-width:230px;line-height:1.5}.template-site__cards{display:none}
  .premium-site__art { inset:0;width:100%;height:100%;object-position:67% center;opacity:.92 }
  .premium-site__shade { background:linear-gradient(90deg,rgba(238,221,213,.98) 0%,rgba(238,221,213,.87) 58%,rgba(238,221,213,.27) 100%) }
  .premium-site__meta { top:82px }.premium-site__content{width:100%;padding:80px 16px 24px}.premium-site__eyebrow{max-width:230px;line-height:1.4;margin-bottom:17px}.premium-site h1{font-size:clamp(31px,9.7vw,47px);line-height:.94}html[lang="ru"] .premium-site__title-long{font-size:.6em}.premium-site__title-accent{max-width:none;white-space:nowrap!important}.premium-site__bottom{margin-top:17px;gap:16px}.premium-site__bottom p{max-width:280px;font-size:11px;line-height:1.5}.pill-button{min-width:185px;min-height:48px;font-size:9px}.pill-button i{width:35px;height:35px}
  .intro__caption { grid-template-columns:auto 1fr auto;gap:8px;font-size:7px }.intro__caption div{width:auto}
  .manifesto__statement { font-size:clamp(35px,11vw,52px) }
  .section-heading h2 { font-size:clamp(34px,10.6vw,50px) }
  .service-card__name { font-size:clamp(25px,8vw,38px) }.service-card__short{font-size:8px;line-height:1.4}.service-card__body-inner>p{font-size:16px}
  .approach-card { min-height:610px }.approach-card__top{top:20px;right:20px;left:20px}.approach-card__content{padding:88px 20px 28px}.approach-card__content h3{font-size:clamp(33px,9.8vw,48px)}.approach-card__art{min-height:260px}
  .outcomes__intro h2 { font-size:clamp(37px,11vw,53px) }.outcome{grid-template-columns:36px 1fr}.outcome p{font-size:14px}
  .process-step { grid-template-columns:35px minmax(0,1fr) 44px;gap:10px}.process-step__action{width:44px;height:44px}.process-step h3{font-size:27px}.process-step p{font-size:14px}
  .contact { min-height:860px }.contact h2{font-size:clamp(43px,13vw,62px)}.contact__actions{display:grid}.contact-link{width:100%;font-size:9px}
  .footer__top { grid-template-columns:1fr;gap:34px }.footer__top>p{grid-column:1}.footer__word{font-size:15.5vw}.footer__bottom{display:grid;grid-template-columns:1fr auto}.footer__bottom span:nth-child(2){display:none}
  .mobile-menu{padding-top:94px}.mobile-menu__cta{margin-top:12px;min-height:52px}.mobile-menu__meta{font-size:12px}
  .contact-dialog{width:calc(100% - 20px);max-height:calc(100svh - 20px);margin:auto 10px max(10px,env(safe-area-inset-bottom));overflow:auto}.contact-dialog__panel{padding:27px 18px calc(22px + env(safe-area-inset-bottom));border-radius:24px}.contact-dialog h2{padding-right:18px;font-size:clamp(28px,9vw,38px)}.contact-dialog__option{min-height:72px;padding:13px 12px 13px 15px}.contact-dialog__option strong{font-size:12px}.contact-dialog__option i{width:38px;height:38px}
  .contact-choice-page::before{top:-25vw;right:-52vw;width:150vw}.contact-choice-page::after{bottom:-20vw;left:-75vw;width:150vw}.contact-choice-page__header{padding-block:16px}.contact-choice-page__brand-mark{width:38px;height:38px;border-radius:11px}.contact-choice-page__language{gap:13px;font-size:9px}.contact-choice-page__main{padding-block:64px}.contact-choice-page h1{font-size:clamp(39px,11.6vw,53px);line-height:.94}.contact-choice-page__copy{font-size:15px}.contact-choice-page__option{min-height:108px;padding:18px;border-radius:22px}.contact-choice-page__option strong{font-size:14px}.contact-choice-page__option i{width:44px;height:44px;font-size:18px}.contact-choice-page__footer{display:grid;grid-template-columns:1fr auto}.contact-choice-page__footer span:last-child{display:none}
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto }
  *,*::before,*::after { animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important }
  .preloader { display:none }
  body.is-loading { overflow:auto }
  .intro { height:100svh }
  .site-frame { width:100%!important;height:100svh!important;min-height:0;border:0;border-radius:0!important;transform:none!important;box-shadow:none }
  .site-frame__chrome,.template-site,.transform-line,.intro__caption,.intro__scroll { display:none }
  .premium-site { clip-path:inset(0)!important }
  .premium-site__art { transform:none!important }
  .interaction-lab .premium-site__content,.interaction-lab .approach-card__content,.interaction-lab .approach-card__art,.interaction-lab .footer__word { transform:none!important;will-change:auto }
  .header { opacity:1!important;transform:none!important;pointer-events:auto!important }
  .language-switch--intro { display:none }
  .has-custom-cursor,.has-custom-cursor a,.has-custom-cursor button { cursor:auto }
  .has-custom-cursor .cursor { display:none }
  .reveal { opacity:1!important;transform:none!important }
}

html:not(.js) .preloader { display:none }
html:not(.js) body { overflow:auto }
html:not(.js) .intro { height:100svh }
html:not(.js) .site-frame { width:100%;height:100svh;min-height:0;border:0;border-radius:0;transform:none;box-shadow:none }
html:not(.js) .site-frame__chrome,html:not(.js) .template-site,html:not(.js) .transform-line,html:not(.js) .intro__caption,html:not(.js) .intro__scroll { display:none }
html:not(.js) .premium-site { clip-path:inset(0) }
html:not(.js) .header { opacity:1;transform:none;pointer-events:auto }
html:not(.js) .language-switch--intro { display:none }