:root {
  --paper: #f5f2eb;
  --ink: #15221f;
  --muted: #727b72;
  --line: #d5d1c7;
  --lime: #d3ef64;
  --pink: #f15c91;
  --blue: #5476ec;
  --turquoise: #45c9be;
  --orange: #ff8a4c;
  --mono: 'DM Mono', 'Courier New', monospace;
  --sans: Manrope, 'Helvetica Neue', Arial, sans-serif;
  --wrap: 1600px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: clip; background: var(--paper); color: var(--ink); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
button, a { color: inherit; font: inherit; }
a { text-decoration: none; }
button { cursor: pointer; }
.section-wrap { width: min(var(--wrap), calc(100% - 112px)); margin-inline: auto; }

.site-header { height: 78px; padding: 0 4vw; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(21,34,31,.13); position: relative; z-index: 10; background: var(--paper); }
.brand-lockup { display: inline-flex; align-items: center; gap: 11px; min-width: 154px; position: relative; }
.brand-mark { width: 48px; height: 42px; display: grid; place-items: center; position: relative; z-index: 0; font-size: 22px; line-height: 1; font-weight: 800; letter-spacing: .015em; }
.brand-mark::before { content: ""; position: absolute; inset: 3px -2px 1px; z-index: -1; background: linear-gradient(125deg,var(--pink),#ffc447 48%,var(--turquoise)); border-radius: 46% 54% 56% 44% / 60% 42% 58% 40%; transform: rotate(-8deg); transition: border-radius .55s,transform .55s; }
.brand-lockup:hover .brand-mark::before { border-radius: 57% 43% 38% 62% / 44% 60% 40% 56%; transform: rotate(7deg) scale(1.08); }
.brand-copy { display: flex; flex-direction: column; gap: 2px; line-height: 1; }
.brand-copy b { font-size: 10px; letter-spacing: .12em; }
.main-nav { display: flex; align-items: center; gap: 36px; font-size: 12px; }
.main-nav a { position: relative; padding: 10px 0; }
.main-nav a::after { content: ""; position: absolute; left: 0; bottom: 4px; width: 100%; height: 1px; background: var(--pink); transform: scaleX(0); transform-origin: left; transition: transform .25s; }
.main-nav a:hover::after { transform: scaleX(1); }
.header-cta { font-size: 11px; border-bottom: 1px solid; padding-bottom: 7px; }
.header-cta span { margin-left: 18px; }
.menu-toggle { display: none; }

.hero { min-height: 500px; height: min(650px, calc(100svh - 150px)); max-height: 700px; padding-top: 22px; position: relative; display: grid; grid-template-columns: 1fr 1fr; align-items: center; }
.hero-copy { position: relative; z-index: 2; padding-bottom: 12px; }
.eyebrow, .section-no, .project-count, .hero-note, .hero-scroll, .stage-caption, .stage-coordinate, .game-caption, .game-stamp, .services-kicker, .logo-note, .site-footer>a:last-child { font: 10px var(--mono); letter-spacing: .08em; }
.eyebrow { display: flex; align-items: center; gap: 9px; color: #56625a; margin: 0 0 24px; }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: #68ad78; box-shadow: 0 0 0 4px rgba(104,173,120,.14); }
h1, h2, p { margin-top: 0; }
h1 { max-width: 760px; margin: 0 0 34px; font-size: clamp(58px, 6.25vw, 112px); line-height: .99; letter-spacing: 0; font-weight: 650; }
.hero-bottom { display: grid; grid-template-columns: 1fr; align-items: start; max-width: 600px; }
.hero-bottom p { font-size: 15px; line-height: 1.7; margin: 0; color: #4d5b53; }
.round-link { position: static; justify-self: end; margin-top: 50px; width: 46px; height: 46px; border: 1px solid var(--ink); border-radius: 50%; display: grid; place-items: center; font-size: 21px; transition: background .25s,color .25s,transform .25s; }
.round-link svg { display:none; }
.round-link:hover { background: var(--ink); color: var(--paper); transform: translateY(4px); }
.hero-note { position: absolute; left: 0; bottom: -35px; color: #7f857b; }

.paint-world { width: min(100%, 675px); height: auto; overflow: visible; transform: rotate(-4deg); filter: drop-shadow(0 26px 17px rgba(36,37,44,.12)); }
.paint-shadow { fill: rgba(30,45,55,.1); filter: blur(24px); }
.paint-stroke { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.paint-highlight { fill: none; stroke-linecap: round; stroke-linejoin: round; opacity: .37; filter: blur(2px); }
.ribbon-back { transform-origin: 370px 355px; animation: drift-back 9s ease-in-out infinite; }
.ribbon-front { transform-origin: 360px 380px; animation: drift-front 8s ease-in-out infinite; }
.ribbon-loop { transform-origin: 370px 285px; animation: drift-loop 11s ease-in-out infinite; }
.paint-bead { filter: url(#paintGloss); animation: bead-float 5s ease-in-out infinite; }
.bead-two { animation-delay: -1.6s; }.bead-three { animation-delay: -3s; }
.paint-spark { transform-origin: 578px 128px; animation: spark-spin 14s linear infinite; }
.art-caption { position: absolute; z-index: 1; font: 9px/1.5 var(--mono); letter-spacing: .1em; }
.caption-one { right: 3%; top: 8%; color: #4a554c; }
.caption-two { left: 4%; bottom: 8%; color: #7a8378; }
.hero-scroll { position: absolute; bottom: 20px; left: 0; color: #737b71; }
.hero-scroll span { margin-left: 12px; }

.intro-band { background: #172622; color: #f7f4ed; overflow: hidden; }
.intro-inner { min-height: 166px; display: grid; grid-template-columns: 145px 1fr 70px; align-items: center; gap: 24px; position:relative; isolation:isolate; }
.intro-paint { position:absolute; z-index:-1; right:5%; top:50%; width:110px; height:82px; border-radius:56% 44% 45% 55%/58% 40% 60% 42%; background:linear-gradient(125deg,#f25d93,#ffc447 48%,#45c9b7); box-shadow:inset 9px 7px 13px #ffffff78,0 18px 23px #0003; opacity:.55; transform:translateY(-50%) rotate(-16deg); animation:intro-orbit 8s ease-in-out infinite; }
.section-no { color: #a9b2a6; }
.typing-copy { margin: 0; font-size: clamp(24px, 2.5vw, 39px); line-height: 1.3; letter-spacing: 0; font-weight: 500; }
.typing-line { display: block; width: fit-content; white-space: nowrap; }
.typing-char { position: relative; }
.typing-copy.is-typing .typing-char:not(.is-visible) { visibility: hidden; }
.typing-char.has-caret::after { content: ""; position: absolute; left: 100%; top: .08em; height: 1em; border-left: 1px solid var(--pink); }
.typing-copy.is-complete .has-caret::after { animation: caret-blink 1s step-end infinite; }
.typing-line strong { color: #d6ee68; font-weight: 700; }
.intro-mark { font-size: 38px; color: var(--pink); animation: mark-twist 8s linear infinite; }

.work { padding-top: 68px; padding-bottom: 105px; }
.section-heading { display: flex; justify-content: space-between; align-items: end; margin-bottom: 26px; }
.section-heading .eyebrow { margin-bottom: 9px; }
.section-heading h2, .clients-heading h2 { margin: 0; font-size: clamp(40px, 5vw, 68px); line-height: 1.04; letter-spacing: 0; font-weight: 600; }
.project-count { text-align: right; line-height: 1.7; color: #737b71; padding-bottom: 6px; }
.work-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 19px; align-items: stretch; }
.project-card { min-width: 0; padding: 9px 9px 13px; border: 1px solid #ded9cf; border-radius: 7px; background: #faf8f3; text-align: left; display: flex; flex-direction: column; transition: border-color .3s,transform .35s,box-shadow .35s; }
.project-card:hover { border-color: #a3b981; transform: translateY(-4px); box-shadow: 0 15px 35px rgba(39,49,41,.09); }
.project-image { width: 100%; aspect-ratio: 1.58 / 1; min-height: 150px; display: grid; place-items: center; background: #e8e5dc; overflow: hidden; position: relative; border-radius: 3px; }
.project-image img { display: block; width: 100%; height: 100%; object-fit: contain; transition: transform .65s cubic-bezier(.2,.7,.2,1); mix-blend-mode: multiply; }
.image-innoprom { background: #293a35; }.image-innoprom img { mix-blend-mode: normal; object-position: center; }
.image-marathon { background: #e9e5da; }.image-marathon img,.image-sborka img,.image-ural img,.image-cherno img { object-fit: contain; }
.image-sborka { background: #e5e2d7; }.image-ural { background: #efede6; }.image-cherno { background: #ebe5cf; }.image-capsule { background:#f6f5f2; }
.project-card:hover .project-image img { transform: scale(1.045); }
.project-image video { display:block;width:100%;height:100%;object-fit:contain; }
.project-image video[hidden] { display:none; }
.project-meta { flex: 1; display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 12px 2px 0; }
.project-meta b { display: block; font-size: 13px; line-height: 1.3; letter-spacing: -.01em; font-weight: 650; }
.project-meta small { display: block; font: 9px/1.45 var(--mono); color: #747d73; margin-top: 5px; letter-spacing: 0; }
.project-meta i { flex: 0 0 auto; width: 27px; height: 27px; border: 1px solid #c5c9bc; border-radius: 50%; display: grid; place-items: center; font-style: normal; transition: background .25s,transform .25s; }
.project-card:hover .project-meta i { background: var(--lime); transform: rotate(45deg); }
.work-footnote { display:flex; align-items:center; gap:10px; margin:-11px 0 18px; font:10px var(--mono); color:#667066; }
.work-footnote span { color:#e9598e; font-size:15px; }
.project-art { isolation: isolate; }
.visual-note { position:absolute; z-index:3; top:10px; left:10px; padding:5px 7px; border:1px solid rgba(21,34,31,.35); border-radius:99px; background:rgba(248,246,239,.82); color:#27312e; font:7px/1 var(--mono); letter-spacing:.04em; }
.project-art::before,.project-art::after { content: ""; position: absolute; z-index: -1; border-radius: 54% 46% 38% 62% / 60% 36% 64% 40%; filter: drop-shadow(10px 10px 7px rgba(37,44,45,.2)); transition: transform .6s,border-radius .6s; }
.project-art::before { width: 56%; height: 72%; background: linear-gradient(135deg,#ed5c9e,#ffc64e 45%,#46c9bd 70%,#5575eb); transform: rotate(-18deg); }
.project-art::after { width: 33%; height: 43%; right: 12%; top: 9%; background: linear-gradient(160deg,#fff7db,#ff8d62 45%,#ee5796); transform: rotate(34deg); opacity: .9; }
.project-card:hover .project-art::before { transform: rotate(15deg) scale(1.08); border-radius: 35% 65% 58% 42% / 42% 64% 36% 58%; }
.art-initials { position: relative; z-index: 1; font: 700 clamp(44px,5vw,80px)/1 var(--serif); color: rgba(21,34,31,.78); transform: rotate(-9deg); text-shadow: 2px 4px rgba(255,255,255,.5); }
.art-caption-small { position: absolute; right: 12px; bottom: 12px; z-index: 2; font: 8px/1.4 var(--mono); letter-spacing: .08em; text-align: right; }
.stand-lines { width: 57%; height: 70%; background: #f8f3e9; box-shadow: 9px 10px #45c9be,18px 19px #f15c91; padding: 18px; transform: rotate(-6deg); }
.stand-lines i { display: block; height: 3px; margin-bottom: 11px; background: #192925; }.stand-lines i:nth-child(2) { width: 70%; height: 17px; background: #ff8a4c; }.stand-lines i:nth-child(4) { width: 55%; }
.social-tiles { width: 65%; height: 70%; display: grid; grid-template-columns:1fr 1fr; gap: 5px; transform: rotate(7deg); }
.social-tiles i { display:grid; place-items:center; font:700 17px var(--mono); font-style:normal; color:#15221f; background:linear-gradient(140deg,#fed458,#f15c91); }.social-tiles i:nth-child(2){background:linear-gradient(130deg,#52cfc0,#5176e8)}.social-tiles i:nth-child(3){background:linear-gradient(140deg,#f3a4ca,#fff1d5)}.social-tiles i:nth-child(4){background:linear-gradient(140deg,#536de6,#f37660)}
.city-lines { position: relative; width: 70%; height: 70%; border-bottom: 3px solid #172622; border-radius: 50% 50% 0 0; transform: perspective(200px) rotateX(18deg); }
.city-lines i { position:absolute; bottom:0; width:27%; height:65%; border:3px solid #172622; border-bottom:0; border-radius: 100% 100% 0 0; }.city-lines i:nth-child(1){left:4%;height:46%}.city-lines i:nth-child(2){left:36%;height:78%;border-color:#e65891}.city-lines i:nth-child(3){right:4%;height:56%;border-color:#4771e9}
.banner-shape { width: 80%; height: 55%; background: linear-gradient(105deg,#ffbe44,#ee5796 45%,#4bc7b2 75%,#4b73eb); border-radius: 48% 52% 14% 86% / 45% 50% 50% 55%; transform: rotate(-9deg); box-shadow: 10px 16px 0 rgba(25,40,39,.13); }
.slide-shape { width: 70%; height: 70%; background: #fffdf5; transform: rotate(-8deg); box-shadow: 7px 8px 0 #ff8a4c,14px 16px 0 #46c9be; padding: 14px; position: relative; }
.slide-shape i { display: block; position: absolute; width: 50%; height: 50%; border-radius: 52% 48% 41% 59%; background: linear-gradient(125deg,#f15c91,#ffc64e,#48c7bd); left: 20%; top: 18%; }.slide-shape i:nth-child(2){width:28%;height:28%;left:54%;top:48%;background:linear-gradient(120deg,#5077ec,#f15c91)}.slide-shape i:nth-child(3){height:2px;width:76%;left:12%;top:83%;border-radius:0;background:#172622}
.project-placeholder:nth-child(6) .project-art::before { background:linear-gradient(135deg,#44c7b5,#526fe5 55%,#f15c91); }
.project-placeholder:nth-child(8) .project-art::before { background:linear-gradient(135deg,#ffe15b,#f15c91 47%,#5674e8); }
.project-placeholder:nth-child(9) .project-art::before { background:linear-gradient(135deg,#42cbb3,#e4ef65 50%,#5776e9); }
.project-placeholder:nth-child(10) .project-art::before { background:linear-gradient(135deg,#ff8b4b,#ed5191 50%,#565fe4); }

.play-section { padding: 80px 0 86px; background: #e9e5dc; overflow: hidden; }
.play-layout { display: grid; grid-template-columns: .78fr 1.22fr; gap: 48px; align-items: center; }
.play-copy h2 { margin: 0 0 38px; font-size: clamp(55px,6.8vw,88px); line-height: .97; letter-spacing: 0; font-weight: 600; }
.play-copy h2 span { color: var(--pink); }
.play-description { max-width:350px; margin:-20px 0 30px; font-size:13px; line-height:1.75; color:#647067; }
.play-controls { display: grid; gap: 23px; max-width: 440px; }
.control-group>span { display: block; margin-bottom: 11px; font: 9px var(--mono); letter-spacing: .11em; color: #707a71; }
.swatches,.shape-options,.orientation-group>div { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.swatch { width: 28px; height: 28px; border-radius: 50%; position: relative; border: 1px solid rgba(21,34,31,.24); background: linear-gradient(140deg,#f15c91,#ffc64e,#4bc9be); transition: transform .2s; }
.swatch:hover { transform: scale(1.13); }
.swatch[data-palette="ocean"] { background: linear-gradient(140deg,#1939b6,#22bad0,#79dfb5); }
.swatch[data-palette="sunset"] { background: linear-gradient(140deg,#ffab3f,#f55869,#cc57c3); }
.swatch[data-palette="garden"] { background: linear-gradient(140deg,#3bad77,#c9e35b,#906bdb); }
.swatch[data-palette="berry"] { background: linear-gradient(140deg,#422aaf,#d346ab,#fa605d); }
.swatch[data-palette="citrus"] { background: linear-gradient(140deg,#f1e851,#9dd435,#38bcae); }
.swatch[data-palette="mono"] { background: linear-gradient(140deg,#fff,#8b8d88,#111); }
.swatch.active::after { content:""; position:absolute; inset:-4px; border:1px solid var(--ink); border-radius:50%; }
.shape-choice,.orientation-choice { border:1px solid #c4c5b9; background:transparent; min-width:37px; height:35px; border-radius:5px; font-size:17px; transition:background .2s,border-color .2s,transform .2s; }
.shape-choice:hover,.orientation-choice:hover { transform:translateY(-2px); }
.shape-choice.active,.orientation-choice.active { background:#172622; color:#fff; border-color:#172622; }
.orientation-choice { padding:0 12px; font-size:10px; }
.shuffle-button { width: fit-content; display: flex; gap: 17px; align-items: center; border: 0; border-bottom: 1px solid #899389; padding: 0 0 8px; background: transparent; font-size: 11px; }
.shuffle-button span { font-size: 19px; transition: transform .4s; }.shuffle-button:hover span { transform: rotate(100deg); }
.play-stage { width:min(100%,590px); min-height:0; aspect-ratio:.93 / 1; margin-inline:auto; display: grid; place-items: center; position: relative; isolation: isolate; overflow: hidden; perspective: 900px; background: #c9d2d0; transition: background .55s,aspect-ratio .55s,width .55s; }
.play-stage[data-orientation="horizontal"] { width:min(100%,740px); aspect-ratio:1.48 / 1; }
.play-stage::before,.play-stage::after { content:""; position:absolute; z-index:-1; border:1px solid rgba(21,34,31,.15); border-radius:50%; left:50%; top:50%; transform:translate(-50%,-50%); }
.play-stage::before { width: 470px; height: 430px; animation: orbit-wobble 13s ease-in-out infinite; }
.play-stage::after { width: 340px; height: 520px; border-style:dashed; animation: orbit-wobble 17s ease-in-out infinite reverse; }
.play-stage[data-palette="ocean"] { background:#b4d7dc; }.play-stage[data-palette="sunset"] { background:#f0cabe; }.play-stage[data-palette="garden"] { background:#cad9b8; }.play-stage[data-palette="berry"] { background:#d7c5dc; }.play-stage[data-palette="citrus"] { background:#e4e2b8; }.play-stage[data-palette="mono"] { background:#c9c9c2; }
.stage-caption { position:absolute; top:20px; left:22px; z-index:3; }.stage-coordinate { position:absolute; top:20px; right:22px; z-index:3; text-align:right; line-height:1.5; color:#6b756d; }
.game-poster { position:relative; z-index:1; width:280px; height:375px; transform:rotate(-5deg) translateZ(30px); transform-style:preserve-3d; transition:width .6s,height .6s,transform .7s; }
.game-poster.is-shuffling { animation:poster-shuffle .72s cubic-bezier(.2,.7,.2,1); }
.game-poster[data-orientation="horizontal"] { width:390px; height:265px; transform:rotate(3deg) translateZ(30px); }
.game-shape { position:absolute; display:block; width:66%; height:65%; left:14%; top:16%; border-radius:55% 45% 39% 61% / 54% 42% 58% 46%; background:linear-gradient(140deg,#ed5798 4%,#ffbd45 34%,#52c8b0 64%,#4d70ec); box-shadow:inset 12px 8px 17px rgba(255,255,255,.48),inset -18px -24px 24px rgba(30,38,117,.24),0 24px 25px rgba(30,41,40,.2); filter:saturate(1.1); transition:all .6s cubic-bezier(.2,.7,.2,1); animation:blob-breathe 8s ease-in-out infinite; }
.game-poster[data-palette="ocean"] .game-shape { background:linear-gradient(140deg,#183aba,#2b7de3 39%,#27c7ca 68%,#9be5af); }
.game-poster[data-palette="sunset"] .game-shape { background:linear-gradient(140deg,#ffbd40,#ff704d 42%,#ee4a9c 75%,#b54cc5); }
.game-poster[data-palette="garden"] .game-shape { background:linear-gradient(140deg,#54b879,#bee555 40%,#7ccfcb 70%,#926cd4); }
.game-poster[data-palette="berry"] .game-shape { background:linear-gradient(140deg,#4539c9,#be4bd0 45%,#f05380 78%,#ffbd52); }
.game-poster[data-palette="citrus"] .game-shape { background:linear-gradient(140deg,#f4e74c,#afe23e 45%,#40c77c 74%,#31b9bc); }
.game-poster[data-palette="mono"] .game-shape { background:linear-gradient(140deg,#fff,#b3b6b2 40%,#4f5451 72%,#141a19); }
.game-poster[data-shape="orb"] .shape-main { width:62%; height:62%; left:var(--shape-main-x,20%); top:var(--shape-main-y,19%); border-radius:50%; }
.game-poster[data-shape="flower"] .shape-main { width:66%; height:65%; left:var(--shape-main-x,14%); top:var(--shape-main-y,16%); border-radius:50%; box-shadow:inset 0 0 0 19px rgba(255,255,255,.16),0 0 0 12px rgba(241,92,145,.38),0 0 0 24px rgba(69,201,190,.28),0 25px 27px rgba(30,41,40,.18); }
.game-poster[data-shape="star"] .shape-main { width:68%; height:68%; left:var(--shape-main-x,16%); top:var(--shape-main-y,14%); clip-path:polygon(50% 0,62% 31%,96% 16%,78% 47%,100% 66%,66% 68%,69% 100%,48% 76%,22% 98%,28% 65%,0 54%,29% 43%,16% 12%,44% 30%); border-radius:20%; }
.game-poster[data-shape="ribbon"] .shape-main { width:77%; height:45%; left:var(--shape-main-x,11%); top:var(--shape-main-y,27%); border-radius:47% 53% 44% 56% / 56% 41% 59% 44%; transform:rotate(-35deg) skew(-10deg); }
.game-shape.shape-small { width:31%; height:31%; left:58%; top:56%; opacity:.85; border:2px solid rgba(255,255,255,.85); background:transparent; box-shadow:inset 0 0 0 7px rgba(20,34,31,.12),0 8px 16px rgba(29,42,42,.16); animation:blob-breathe 6s ease-in-out infinite reverse; }
.game-poster[data-shape="orb"] .shape-small { left:9%;top:12%;width:23%;height:23%; }
.game-poster[data-shape="flower"] .shape-small { left:61%;top:12%;width:25%;height:25%;border-radius:50%;box-shadow:0 0 0 8px rgba(255,255,255,.28),0 0 0 16px rgba(241,92,145,.22); }
.game-poster[data-shape="star"] .shape-small { clip-path:polygon(50% 0,62% 35%,100% 50%,62% 64%,50% 100%,38% 64%,0 50%,38% 35%);border:0;background:#fff;left:60%;top:13%; }
.game-letter { position:absolute; left:18px; bottom:20px; z-index:2; font-size:77px; font-weight:750; line-height:.8; color:rgba(19,35,31,.86); letter-spacing:-.04em; }
.game-stamp { position:absolute; top:18px; left:18px; z-index:2; font-size:8px; line-height:1.45; }
.game-caption { position:absolute; right:15px; bottom:14px; z-index:2; font-size:7px; writing-mode:vertical-rl; }
.game-poster[data-orientation="horizontal"] .game-letter { font-size:65px; }.game-poster[data-orientation="horizontal"] .game-shape.shape-main { width:49%; height:86%; left:var(--shape-main-x,28%); top:var(--shape-main-y,7%); }
.stage-sticker { position:absolute; right:8%; bottom:12%; z-index:2; width:67px; height:67px; display:grid; place-items:center; text-align:center; border-radius:44% 56% 52% 48% / 50% 37% 63% 50%; background:#f15c91; color:#18221e; font:9px/1.3 var(--mono); transform:rotate(11deg); animation:sticker-float 5s ease-in-out infinite; }

.about { display:grid; grid-template-columns:1fr .95fr; gap:7%; padding-top:76px; padding-bottom:78px; }
.about-left .eyebrow { margin-bottom:24px; }.about h2 { margin:0; font-size:clamp(47px,6.1vw,82px); line-height:1.02; letter-spacing:0; font-weight:600; }
.about h2 span { color:#d34f87; }
.about-signature { margin-top:22px; width:min(430px,100%); }
.about-paint { display:block; width:100%; height:auto; overflow:visible; }
.about-paint path { fill:none; stroke-linecap:round; stroke-width:30px; stroke:url(#aboutRainbow); filter:drop-shadow(1px 12px 7px rgba(27,40,38,.18)); }
.signature-ribbon { stroke-dasharray:950; stroke-dashoffset:950; animation:signature-draw 4.6s ease-in-out infinite alternate; }
.signature-highlight { stroke:#fff8df; stroke-width:4px!important; opacity:.55; stroke-dasharray:950; stroke-dashoffset:950; animation:signature-draw 4.6s ease-in-out .3s infinite alternate; }
.about-signature p { display:flex; align-items:baseline; gap:0; margin:-3px 0 0; font-size:clamp(21px,2.6vw,34px); font-weight:650; letter-spacing:.005em; white-space:nowrap; }
.signature-a { display:inline-block; margin-right:1px; font-size:1.62em; font-weight:800; line-height:.8; color:#e85890; transform:scaleY(1.28); transform-origin:bottom; animation:signature-a 3.8s ease-in-out infinite; }
.about-right { padding-top:14px; }
.about-lead { font-size:clamp(20px,2vw,25px); line-height:1.55; letter-spacing:-.01em; margin-bottom:24px; }
.about-text { max-width:510px; font-size:13px; line-height:1.85; color:#626c63; }
.facts { display:flex; flex-wrap:wrap; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin:23px 0 20px; padding:14px 0; gap:20px 32px; }
.facts div { display:flex; flex-direction:column; gap:5px; }.facts strong { font-size:24px; letter-spacing:-.015em; }.facts span { font:9px/1.6 var(--mono); color:#6b7569; }
.text-link { display:inline-flex; gap:24px; border-bottom:1px solid #7c8679; padding-bottom:8px; font-size:11px; }.text-link span { font-size:15px; }

.services-band { position:relative; min-height:155px; display:flex; flex-direction:column; justify-content:center; overflow:hidden; background:#d6eb68; }
.services-kicker { position:absolute; left:5vw; top:20px; z-index:2; color:#475a36; }
.service-window { width:100%; overflow:hidden; }
.service-track { display:flex; width:max-content; animation:marquee 27s linear infinite; }
.service-set { display:flex; align-items:center; flex:0 0 auto; gap:34px; padding-right:34px; }
.service-set span { display:flex; align-items:center; gap:26px; white-space:nowrap; font-size:clamp(22px,3vw,39px); letter-spacing:-.015em; font-weight:560; }
.service-set i { display:inline-grid; place-items:center; width:34px; height:34px; font-style:normal; font-size:22px; color:#ef4c8f; animation:mark-twist 7s linear infinite; }
.services-paint { position:absolute; width:84px; height:120px; right:8%; top:17px; border-radius:58% 42% 43% 57% / 62% 36% 64% 38%; background:linear-gradient(155deg,#f55a98,#ffb944,#39bdb7); box-shadow:inset 7px 6px 10px rgba(255,255,255,.42),8px 11px 18px rgba(39,53,27,.16); transform:rotate(23deg); animation:blob-breathe 6s ease-in-out infinite; }

.clients { padding-top:110px; padding-bottom:115px; }
.clients-heading { display:flex; align-items:end; justify-content:space-between; margin-bottom:38px; gap:30px; }
.clients-heading .eyebrow { margin-bottom:10px; }.clients-heading h2 { font-size:clamp(40px,5.2vw,67px); }
.clients-heading>p { margin:0 0 5px; font:10px/1.65 var(--mono); color:#758075; text-align:right; }
.logo-sber { font-size:25px; font-weight:760; letter-spacing:.02em; }.logo-sber b { font-size:25px; }
.logo-kino { font-size:21px; font-weight:900; letter-spacing:-.06em; transform:skew(-8deg); }
.logo-russia { display:block; font-size:11px; line-height:1.2; font-weight:800; font-style:italic; }
.logo-znanie { font-size:9px; font-weight:750; line-height:1.1; }.logo-znanie b { width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#19211e;color:white;font-size:25px; }
.logo-ocean { display:flex;flex-direction:column;font-size:20px;font-weight:900;letter-spacing:.03em; }.logo-ocean small,.logo-keramir small { display:block;font:7px var(--mono);letter-spacing:.05em; }
.logo-allure { font-size:20px;font-weight:400;letter-spacing:-.04em; }
.logo-orlyata { font-family:var(--serif);font-size:18px;font-weight:700; }
.logo-navigators { font-size:12px;line-height:1.2;font-weight:900;transform:rotate(-3deg); }
.logo-orlyonok { font-family:var(--serif);font-size:17px;font-weight:700;letter-spacing:.04em; }
.logo-first { font-size:16px;line-height:1.02;font-weight:900;letter-spacing:.02em; }
.logo-cersanit { font-family:var(--serif);font-size:26px;letter-spacing:-.05em; }
.logo-school { font-size:9px;line-height:1.3;font-weight:700; }
.logo-culture { font-family:var(--serif);font-size:15px;font-weight:700; }
.logo-museum { font-size:10px;line-height:1.3;font-weight:700; }
.logo-keramir { font-size:16px;font-weight:900;letter-spacing:.06em; }.logo-keramir small { letter-spacing:.35em; }
.logo-note { margin:16px 0 0; color:#7d867c; font-size:9px; }

.contact-section { overflow:hidden; background:#172622; color:#faf7ef; position:relative; }
.contact-wrap { min-height:540px; padding-top:85px; padding-bottom:50px; position:relative; }
.contact-wrap>.eyebrow { color:#d6e1cc; margin-bottom:22px; font-size:13px; letter-spacing:.12em; }
.contact-wrap h2 { max-width:1100px; margin:0; position:relative; z-index:2; font-size:clamp(72px,9vw,138px); line-height:.99; letter-spacing:0; font-weight:600; }
.contact-wrap h2 span { color:#d6ee68; }
.contact-button { position:relative; z-index:2; display:inline-flex; align-items:center; gap:55px; padding:17px 22px; margin-top:30px; background:#d6ee68; color:#172622; font-size:12px; transition:transform .25s,background .25s; }
.contact-button:hover { transform:translateY(-3px);background:#e7ff90; }.contact-button span { font-size:17px; }
.contact-details { position:relative; z-index:2; display:flex; flex-wrap:wrap; gap:18px 30px; margin-top:56px; font:9px var(--mono); color:#c6d0c5; }
.contact-details a:hover { color:#d6ee68; }.contact-details span { color:#98a49a; }
.contact-art { position:absolute; width:490px; height:390px; right:1%;top:33px;perspective:900px;transform:rotate(-8deg); }
.contact-art::before { content:"";position:absolute;width:310px;height:300px;left:90px;top:42px;border-radius:53% 47% 38% 62% / 61% 44% 56% 39%;background:linear-gradient(135deg,#f15c91,#ffbc42 38%,#49c8b7 69%,#4d72ea);box-shadow:inset 14px 11px 18px rgba(255,255,255,.4),inset -18px -22px 28px rgba(24,36,92,.23),0 32px 42px rgba(0,0,0,.28);animation:contact-fluid 9s ease-in-out infinite; }
.contact-art::after { content:"";position:absolute;width:275px;height:120px;left:120px;top:132px;border:19px solid rgba(255,249,225,.53);border-radius:50%;transform:rotate(-30deg);filter:blur(1px);animation:contact-ribbon 7s ease-in-out infinite; }
.contact-art span { position:absolute;width:78px;height:58px;left:62px;top:36px;border-radius:60% 40% 50% 50%;background:linear-gradient(145deg,#51cbb6,#4774eb);box-shadow:inset 6px 4px 10px rgba(255,255,255,.55),0 15px 20px rgba(0,0,0,.2);animation:bead-float 5.5s ease-in-out infinite; }
.contact-art i,.contact-art b { position:absolute;right:42px;bottom:43px;width:83px;height:66px;border-radius:56% 44% 37% 63%;background:linear-gradient(150deg,#f15c91,#ffb648);box-shadow:inset 6px 6px 12px rgba(255,255,255,.5);animation:bead-float 6.5s ease-in-out infinite reverse; }
.contact-art b { width:34px;height:32px;right:100px;bottom:12px;background:linear-gradient(150deg,#69d7b6,#5474e9);animation-delay:-3s; }
.site-footer { min-height:79px; padding:0 4vw; display:flex; align-items:center; justify-content:space-between; background:#172622; color:#aebbb0; border-top:1px solid rgba(245,242,235,.17); }
.site-footer .brand-mark { color:#fff; }.site-footer .brand-copy b { color:#fff; }.site-footer .brand-copy small { color:#bac7bb; }.site-footer>span { font:9px var(--mono); }.site-footer>a:last-child { font-size:9px; }

.project-card:focus-visible,.swatch:focus-visible,.shape-choice:focus-visible,.orientation-choice:focus-visible,.shuffle-button:focus-visible,.contact-button:focus-visible,a:focus-visible { outline:3px solid #347d44;outline-offset:4px; }

@keyframes caret-blink { 50% { opacity:0; } }
@keyframes drift-back { 0%,100% { transform:translate3d(0,0,0) rotate(-2deg); } 50% { transform:translate3d(9px,-16px,24px) rotate(5deg); } }
@keyframes drift-front { 0%,100% { transform:translate3d(0,0,25px) rotate(0deg); } 50% { transform:translate3d(-13px,10px,42px) rotate(-7deg); } }
@keyframes drift-loop { 0%,100% { transform:translate3d(0,0,48px) rotate(0deg); } 50% { transform:translate3d(7px,-9px,62px) rotate(4deg); } }
@keyframes bead-float { 0%,100% { transform:translate3d(0,0,10px) scale(1); } 50% { transform:translate3d(4px,-11px,25px) scale(1.08); } }
@keyframes spark-spin { to { transform:rotate(360deg); } }
@keyframes mark-twist { 0% { transform:rotate(0deg) scale(1); } 50% { transform:rotate(180deg) scale(.74); } 100% { transform:rotate(360deg) scale(1); } }
@keyframes blob-breathe { 0%,100% { border-radius:55% 45% 39% 61% / 54% 42% 58% 46%; } 50% { border-radius:39% 61% 57% 43% / 44% 60% 40% 56%; } }
@keyframes orbit-wobble { 50% { transform:translate(-50%,-50%) rotate(20deg) scale(.92,1.06); } }
@keyframes sticker-float { 0%,100% { transform:translateY(0) rotate(11deg); } 50% { transform:translateY(-12px) rotate(-2deg); } }
@keyframes marquee { to { transform:translateX(-50%); } }
@keyframes logo-drift { 0%,100% { transform:translateY(0) rotate(0) scale(1); } 50% { transform:translateY(-7px) rotate(1deg) scale(1.02); } }
@keyframes poster-shuffle { 0% { filter:blur(0);transform:rotate(-5deg) translateZ(30px) scale(1); } 42% { filter:blur(3px);transform:rotate(8deg) translateZ(75px) scale(.89); } 100% { filter:blur(0);transform:rotate(-5deg) translateZ(30px) scale(1); } }
@keyframes contact-fluid { 0%,100% { border-radius:53% 47% 38% 62% / 61% 44% 56% 39%;transform:rotate(0) translateY(0); } 50% { border-radius:40% 60% 54% 46% / 45% 58% 42% 55%;transform:rotate(12deg) translateY(-12px); } }
@keyframes contact-ribbon { 0%,100% { transform:rotate(-30deg) scale(1); } 50% { transform:rotate(28deg) scale(.8,1.2); } }

@media (min-width: 1700px) {
  .section-wrap { width:min(1640px,calc(100% - 160px)); }
  .hero { grid-template-columns: .95fr 1.05fr; }
  .work { padding-top:50px; }
  .project-image { aspect-ratio:1.75 / 1; }
  .project-card { padding:8px 8px 10px; }
  .project-meta { padding-top:9px; }
  .project-meta b { font-size:12px; }
  .project-meta small { font-size:8px; }
  .project-meta i { width:24px;height:24px; }
  .work-grid { gap:14px; }
}
@media (max-width: 1050px) {
  .section-wrap { width:calc(100% - 72px); }
  .hero { grid-template-columns:1fr .9fr; }.paint-world { width:112%; }
  .work-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .project-image { min-height:138px; }
  .play-layout { grid-template-columns:.8fr 1.2fr;gap:28px; }.play-stage { min-height:480px; }
  .game-poster[data-orientation="horizontal"] { width:330px;height:230px; }
  .contact-art { right:-14%;opacity:.82; }
}
@media (max-width: 680px) {
  .section-wrap { width:calc(100% - 38px); }
  .site-header { height:68px;padding-inline:18px; }
  .brand-lockup { min-width:0;gap:8px; }.brand-mark { width:40px;height:36px;font-size:19px; }.brand-copy b { font-size:9px; }.brand-copy small { font-size:7px; }
  .main-nav { display:none;position:absolute;left:0;right:0;top:67px;background:var(--paper);padding:20px 22px 24px;flex-direction:column;align-items:start;gap:12px;border-bottom:1px solid var(--line); }
  .main-nav.is-open { display:flex; }.main-nav a { padding:6px 0; }
  .header-cta { margin-left:auto;margin-right:9px;font-size:9px; }.header-cta span { margin-left:7px; }
  .menu-toggle { display:flex;flex-direction:column;gap:5px;border:0;background:transparent;padding:9px; }.menu-toggle span { width:20px;height:1px;background:var(--ink); }
  .hero { display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;height:auto;min-height:0;max-height:none;padding-top:52px; }
  .hero .eyebrow { font-size:8px;margin-bottom:18px; }.hero h1 { font-size:clamp(49px,12.5vw,76px);line-height:1.03;letter-spacing:-.01em;margin-bottom:23px; }
  .hero-bottom { display:grid;grid-template-columns:1fr auto;align-items:end;gap:10px; }.hero-bottom p { font-size:11px; }.round-link { margin-top:0;width:39px;height:39px; }
  .paint-world { width:115%; }.art-caption { font-size:7px; }.caption-one { right:0;top:5%; }.caption-two { left:0;bottom:3%; }
  .hero-note { bottom:-16px;font-size:8px; }.hero-scroll { position:static;margin:0 0 20px;font-size:8px; }
  .intro-inner { min-height:172px;grid-template-columns:1fr 24px;gap:12px;padding-block:25px; }.intro-inner .section-no { grid-column:1/-1;font-size:8px; }.typing-copy { font-size:clamp(18px,5.1vw,27px);white-space:normal; }.typing-line { white-space:normal; }.intro-mark { font-size:25px; }
  .work { padding-top:64px;padding-bottom:75px; }.section-heading { margin-bottom:22px; }.section-heading h2 { font-size:45px; }.project-count { font-size:8px; }
  .work-grid { grid-template-columns:repeat(2,minmax(0,1fr));gap:11px; }.project-card { padding:5px 5px 8px;border-radius:5px; }.project-image { aspect-ratio:1.18 / 1;min-height:120px; }.project-meta { align-items:flex-start;padding:8px 1px 0;gap:4px; }.project-meta b { font-size:10px;line-height:1.25; }.project-meta small { font-size:7px;margin-top:4px; }.project-meta i { width:22px;height:22px;font-size:12px; }
  .art-initials { font-size:42px; }.art-caption-small { font-size:6px;right:6px;bottom:6px; }.stand-lines { padding:10px; }.stand-lines i { margin-bottom:6px; }.social-tiles i { font-size:11px; }
  .play-section { padding:67px 0 70px; }.play-layout { display:flex;flex-direction:column;align-items:stretch;gap:30px; }.play-copy h2 { font-size:58px;margin-bottom:28px; }.play-controls { gap:18px; }.control-group>span { font-size:8px; }.swatches { gap:9px; }.swatch { width:25px;height:25px; }.shape-options { gap:7px; }.shape-choice { width:34px;height:32px;min-width:34px; }.orientation-choice { padding:0 9px;font-size:9px; }
  .play-stage { min-height:390px; }.play-stage::before { width:335px;height:315px; }.play-stage::after { width:260px;height:390px; }.game-poster { width:220px;height:300px; }.game-poster[data-orientation="horizontal"] { width:min(310px,82vw);height:210px; }.game-letter { font-size:60px;left:13px;bottom:15px; }.game-stamp { left:13px;top:13px;font-size:7px; }.game-caption { right:10px;bottom:9px;font-size:6px; }.stage-caption,.stage-coordinate { top:13px;font-size:8px; }.stage-caption { left:13px; }.stage-coordinate { right:13px; }.stage-sticker { width:52px;height:52px;font-size:7px;right:4%;bottom:9%; }
  .about { display:block;padding-top:78px;padding-bottom:82px; }.about h2 { font-size:57px; }.about-photo { margin-top:28px;height:165px;max-width:310px; }.about-photo>span { font-size:62px; }.about-right { padding-top:34px; }.about-lead { font-size:19px; }.about-text { font-size:12px; }.facts { gap:28px; }
  .services-band { min-height:125px; }.services-kicker { top:14px;left:19px;font-size:8px; }.service-set { gap:17px;padding-right:17px; }.service-set span { gap:14px;font-size:23px; }.service-set i { width:23px;height:23px;font-size:17px; }.services-paint { width:55px;height:75px;right:6%;top:23px;opacity:.8; }
  .clients { padding-top:76px;padding-bottom:78px; }.clients-heading { align-items:flex-start;margin-bottom:26px; }.clients-heading h2 { font-size:39px; }.clients-heading>p { padding-top:3px;font-size:8px; }.logo-sber,.logo-kino { font-size:18px; }.logo-allure { font-size:17px; }.logo-note { font-size:8px;line-height:1.6; }
  .contact-wrap { min-height:540px;padding-top:67px;padding-bottom:34px; }.contact-wrap>.eyebrow { font-size:10px; }.contact-wrap h2 { font-size:clamp(49px,11.4vw,72px);line-height:1.04; }.contact-art { width:275px;height:245px;right:-33%;top:44px;opacity:.38; }.contact-art::before { width:190px;height:180px;left:54px;top:27px; }.contact-art::after { width:164px;height:77px;left:69px;top:82px;border-width:12px; }.contact-art span { width:47px;height:37px;left:25px;top:24px; }.contact-art i { width:53px;height:46px;right:18px;bottom:26px; }.contact-art b { width:24px;height:21px;right:56px;bottom:7px; }
  .contact-button { margin-top:24px;padding:14px 17px;gap:35px; }.contact-details { flex-direction:column;gap:9px;margin-top:46px;font-size:8px; }
  .site-footer { min-height:70px;padding:0 18px; }.site-footer>span { font-size:7px; }.site-footer>a:last-child { font-size:8px; }

}
@media (min-width: 681px) and (max-height: 800px) {
  .hero { height:min(530px,calc(100svh - 135px)); min-height:480px; }

  .paint-world { width:min(100%,432px); }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important; }
  .typing-copy.is-typing .typing-char { visibility:visible; }
  .typing-char.has-caret::after { display:none; }
}
.site-footer .brand-copy small { display:none; }
.services-paint { background:linear-gradient(135deg,#ff5a9b,#ffd14c 47%,#42c9ba 72%,#516eec); box-shadow:inset 8px 7px 14px #fff8, inset -14px -17px 21px #18234938, 0 20px 26px #22301b29; }
.services-paint::before { content:""; position:absolute; inset:19% 10%; border:7px solid #fff7; border-radius:50%; transform:rotate(-32deg); }
.services-paint::after { content:""; position:absolute; width:34%; height:24%; left:-22%; top:10%; border-radius:50%; background:linear-gradient(145deg,#51cbb6,#4774eb); box-shadow:inset 4px 3px 7px #fff9,0 9px 14px #0002; }
.intro-band { position:relative; }
.intro-band::after { content:""; position:absolute; inset:0; pointer-events:none; opacity:.3; background:linear-gradient(105deg,transparent 35%,rgba(214,238,104,.13) 49%,transparent 63%); transform:translateX(-100%); animation:approach-sheen 8s ease-in-out infinite; }
.intro-inner { position:relative; }
.play-stage { --stage-a:#efbcae; --stage-b:#d8b8cb; background-image:linear-gradient(165deg,var(--stage-a),var(--stage-b)); }
.play-stage[data-orientation="horizontal"] { background-image:linear-gradient(90deg,var(--stage-a),var(--stage-b)); }
.play-stage[data-palette="ocean"] { --stage-a:#84c9db; --stage-b:#b2ddcc; }
.play-stage[data-palette="sunset"] { --stage-a:#ffbb78; --stage-b:#f296b2; }
.play-stage[data-palette="garden"] { --stage-a:#b3d99a; --stage-b:#c8b9df; }
.play-stage[data-palette="berry"] { --stage-a:#a78bcf; --stage-b:#ec9bb8; }
.play-stage[data-palette="citrus"] { --stage-a:#e9e77a; --stage-b:#94d49e; }
.play-stage[data-palette="mono"] { --stage-a:#d8d7d1; --stage-b:#a8aeaa; }
.game-shape { box-shadow:inset 12px 9px 18px rgba(255,255,255,.58),inset -20px -26px 28px rgba(30,38,117,.27),0 28px 28px rgba(30,41,40,.22); }
.game-shape.shape-main { transition:left .6s cubic-bezier(.2,.7,.2,1),top .6s cubic-bezier(.2,.7,.2,1),width .6s,height .6s,border-radius .7s,background .5s,transform .7s; }
.game-shape.shape-main::after { content:""; position:absolute; inset:10% 13%; border:2px solid rgba(255,255,255,.28); border-radius:inherit; filter:blur(.2px); }
.game-shape.shape-small { transition:left .6s cubic-bezier(.2,.7,.2,1),top .6s cubic-bezier(.2,.7,.2,1),width .6s,height .6s; }
.about-signature { max-width:420px; }
.signature-a { background:linear-gradient(160deg,#ee5796,#ffbf46 48%,#44c5b5); color:transparent; background-clip:text; -webkit-background-clip:text; }
.contact-wrap { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(350px,.78fr); column-gap:8%; align-items:center; min-height:0; padding-top:83px; padding-bottom:65px; }
.contact-copy { position:relative; z-index:2; }
.contact-wrap h2 { font-size:clamp(62px,7.2vw,110px); line-height:1.02; }
.contact-button { margin-top:54px; }
.contact-details { margin-top:48px; }
.contact-form { position:relative; z-index:2; display:grid; grid-template-columns:1fr 1fr; gap:15px 18px; padding:25px; background:rgba(255,255,255,.07); border:1px solid rgba(240,245,227,.23); backdrop-filter:blur(5px); }
.contact-form>.eyebrow { grid-column:1/-1; color:#d6e1cc; margin:0 0 3px; }
.contact-form label { display:grid; gap:7px; font-size:10px; color:#d8dfd4; }
.contact-form .form-wide { grid-column:1/-1; }
.contact-form .form-control { position:relative; display:block; }
.contact-form input,.contact-form textarea { box-sizing:border-box; display:block; width:100%; min-height:49px; padding:9px 2px 22px; border:0; border-bottom:1px solid rgba(240,245,227,.48); border-radius:0; outline:0; background:transparent; color:#fff; font:13px/1.4 var(--sans); resize:none; overflow:hidden; }
.contact-form .field-count { position:absolute; right:2px; bottom:5px; color:#d8dfd4; font-size:10px; line-height:1; pointer-events:none; }
.contact-form .field-error { color:#ffe0b5; font-size:11px; }
.contact-form .field-error:empty { display:none; }
.contact-form .form-trap { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.contact-form button:disabled { opacity:.65; cursor:wait; }
.contact-form input:focus,.contact-form textarea:focus { border-color:#d6ee68; }
.contact-form button { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; padding:14px 17px; border:0; background:#d6ee68; color:#172622; font-size:11px; }
.contact-form button span { font-size:16px; }
.form-status { grid-column:1/-1; margin:0; font:8px/1.6 var(--mono); color:#aebbb0; }
.contact-art { right:-3%; opacity:.33; }
.site-footer .brand-lockup { min-width:154px; }

/* Shared sculptural language: soft inflated volume, broad studio highlights and a grounded shadow. */
.paint-world { filter:drop-shadow(0 28px 18px rgba(24,37,44,.17)); }
.paint-stroke { paint-order:stroke; }
.paint-highlight { stroke-width:22px; opacity:.43; filter:blur(4px); mix-blend-mode:screen; }
.ribbon-loop .paint-highlight { stroke-width:15px; opacity:.62; filter:blur(2px); }
.paint-bead { stroke:rgba(255,255,255,.7); stroke-width:3px; }

.project-art { background:radial-gradient(ellipse at 50% 110%,#d1cec5 0,transparent 48%),linear-gradient(135deg,#eeece5,#d9ded6); }
.project-art::before,.project-art::after { border-radius:58% 42% 48% 52% / 45% 58% 42% 55%; background-image:radial-gradient(ellipse at 27% 19%,rgba(255,255,255,.95) 0,rgba(255,255,255,.55) 9%,transparent 31%),radial-gradient(ellipse at 70% 82%,rgba(23,34,92,.48),transparent 44%),linear-gradient(145deg,#ff6da6 0%,#ffba52 34%,#47cbbb 66%,#4d72ea 100%); box-shadow:inset 12px 9px 17px rgba(255,255,255,.57),inset -17px -22px 25px rgba(29,36,91,.23),0 25px 24px rgba(24,34,38,.24); filter:none; }
.project-art::before { width:52%; height:68%; left:21%; top:15%; transform:rotate(-28deg); }
.project-art::after { width:29%; height:38%; right:12%; top:14%; opacity:1; background-image:radial-gradient(ellipse at 30% 20%,rgba(255,255,255,.95),transparent 30%),radial-gradient(ellipse at 68% 82%,rgba(50,48,120,.38),transparent 50%),linear-gradient(145deg,#ffd76e,#fa6a9e 55%,#a94fda); box-shadow:inset 8px 6px 11px rgba(255,255,255,.6),inset -11px -14px 16px rgba(43,37,105,.22),0 19px 19px rgba(24,34,38,.2); transform:rotate(27deg); }
.project-card:hover .project-art::before { transform:rotate(-12deg) scale(1.08); border-radius:47% 53% 55% 45% / 57% 43% 57% 43%; }
.project-art .stand-lines,.project-art .social-tiles,.project-art .city-lines,.project-art .banner-shape,.project-art .slide-shape { display:none; }
.art-crest::before { width:55%;height:62%;left:18%;top:20%;border-radius:51% 49% 41% 59%/59% 41% 59% 41%;background-image:radial-gradient(ellipse at 26% 18%,#fff 0,rgba(255,255,255,.52) 10%,transparent 32%),radial-gradient(ellipse at 72% 83%,#343c96aa,transparent 46%),linear-gradient(145deg,#54d2bd,#6473ef 55%,#ef5d9f); }
.art-stand::before { width:48%;height:72%;left:24%;top:11%;border-radius:42% 58% 50% 50%/45% 40% 60% 55%; }
.art-social::before { width:66%;height:50%;left:17%;top:24%;border-radius:49% 51% 42% 58%/55% 42% 58% 45%;transform:rotate(-12deg); }
.art-city::before { width:39%;height:70%;left:29%;top:13%;border-radius:48% 52% 40% 60%/47% 47% 53% 53%;background-image:radial-gradient(ellipse at 27% 18%,#fff 0,rgba(255,255,255,.48) 9%,transparent 33%),radial-gradient(ellipse at 75% 84%,#303b8f99,transparent 43%),linear-gradient(145deg,#ffb74f,#f05c99 50%,#596fe8); }
.art-banners::before { width:68%;height:45%;left:16%;top:26%;border-radius:49% 51% 46% 54%/55% 43% 57% 45%;transform:rotate(-14deg); }
.art-presentations::before { width:58%;height:65%;left:21%;top:17%;border-radius:48% 52% 43% 57%/50% 42% 58% 50%;background-image:radial-gradient(ellipse at 25% 18%,#fff 0,rgba(255,255,255,.5) 9%,transparent 31%),radial-gradient(ellipse at 76% 84%,#263a86a8,transparent 43%),linear-gradient(145deg,#6379ed,#43c9bb 52%,#ffca54); }
.art-stand::after,.art-social::after,.art-city::after,.art-banners::after,.art-presentations::after { width:24%;height:32%;right:18%;top:15%; }
.art-social::after { right:19%;top:18%;width:27%;height:39%; }
.art-initials { color:#f7f5ed; text-shadow:0 2px 2px #1b263780,0 8px 15px #1b263750; }
.art-caption-small { color:#33443b; text-shadow:0 1px 0 #fff9; }
.visual-note { z-index:3; border:0; background:rgba(250,248,243,.7); backdrop-filter:blur(5px); }

.game-shape.shape-main { background-image:radial-gradient(ellipse at 27% 18%,rgba(255,255,255,.96) 0,rgba(255,255,255,.55) 9%,transparent 30%),radial-gradient(ellipse at 74% 82%,rgba(25,35,95,.44),transparent 46%),linear-gradient(145deg,#ed5798 4%,#ffbd45 34%,#52c8b0 64%,#4d70ec 100%); box-shadow:inset 15px 10px 21px rgba(255,255,255,.62),inset -19px -25px 28px rgba(30,38,117,.29),0 31px 31px rgba(30,41,40,.25); }
.game-poster[data-palette="ocean"] .shape-main { background-image:radial-gradient(ellipse at 27% 18%,#ffffffed,transparent 31%),radial-gradient(ellipse at 74% 82%,#182f73aa,transparent 48%),linear-gradient(145deg,#183aba,#2b7de3 39%,#27c7ca 68%,#9be5af); }
.game-poster[data-palette="sunset"] .shape-main { background-image:radial-gradient(ellipse at 27% 18%,#ffffffed,transparent 31%),radial-gradient(ellipse at 74% 82%,#87306c88,transparent 48%),linear-gradient(145deg,#ffbd40,#ff704d 42%,#ee4a9c 75%,#b54cc5); }
.game-poster[data-palette="garden"] .shape-main { background-image:radial-gradient(ellipse at 27% 18%,#ffffffed,transparent 31%),radial-gradient(ellipse at 74% 82%,#365c6e88,transparent 48%),linear-gradient(145deg,#54b879,#bee555 40%,#7ccfcb 70%,#926cd4); }
.game-poster[data-palette="berry"] .shape-main { background-image:radial-gradient(ellipse at 27% 18%,#ffffffed,transparent 31%),radial-gradient(ellipse at 74% 82%,#31145099,transparent 48%),linear-gradient(145deg,#4539c9,#be4bd0 45%,#f05380 78%,#ffbd52); }
.game-poster[data-palette="citrus"] .shape-main { background-image:radial-gradient(ellipse at 27% 18%,#ffffffed,transparent 31%),radial-gradient(ellipse at 74% 82%,#24633b88,transparent 48%),linear-gradient(145deg,#f4e74c,#afe23e 45%,#40c77c 74%,#31b9bc); }
.game-poster[data-palette="mono"] .shape-main { background-image:radial-gradient(ellipse at 27% 18%,#ffffffed,transparent 31%),radial-gradient(ellipse at 74% 82%,#10131499,transparent 48%),linear-gradient(145deg,#fff,#b3b6b2 40%,#4f5451 72%,#141a19); }
.game-shape.shape-small { border:0; background-image:radial-gradient(ellipse at 27% 18%,#ffffff 0,rgba(255,255,255,.7) 12%,transparent 34%),linear-gradient(145deg,#ff6da6,#ffc64e 48%,#46c9bd); box-shadow:inset 8px 6px 12px #fff9,inset -9px -12px 14px #253b8b55,0 16px 18px #15221f35; }
.game-shape.shape-small::after { content:"";position:absolute;inset:12% 17%;border:2px solid #fff8;border-radius:inherit;filter:blur(1px); }
.game-poster[data-shape="star"] .shape-main { clip-path:none;border-radius:46% 54% 42% 58%/54% 43% 57% 46%; }
.game-poster[data-shape="star"] .shape-main::before { content:"";position:absolute;inset:-13%;background:inherit;filter:brightness(.94);border-radius:inherit;clip-path:polygon(50% 0,62% 31%,96% 16%,78% 47%,100% 66%,66% 68%,69% 100%,48% 76%,22% 98%,28% 65%,0 54%,29% 43%,16% 12%,44% 30%);z-index:-1; }

.signature-ribbon { stroke-width:38px!important; filter:drop-shadow(0 13px 9px rgba(20,33,42,.25)); }
.signature-highlight { stroke-width:8px!important; opacity:.72; filter:blur(1px); }
.services-paint { width:104px;height:125px;border-radius:48% 52% 42% 58%/55% 39% 61% 45%; background:radial-gradient(ellipse at 27% 17%,#fff 0,rgba(255,255,255,.55) 12%,transparent 34%),radial-gradient(ellipse at 78% 85%,#284080a8,transparent 45%),linear-gradient(145deg,#ff5a9b,#ffd14c 47%,#42c9ba 72%,#516eec); box-shadow:inset 12px 9px 16px #fff8,inset -15px -18px 20px #18234940,0 24px 27px #22301b3b; }
.services-paint::before { inset:24% 13%;border-width:8px;box-shadow:0 4px 9px #5c4a6433; }
.services-paint::after { width:37%;height:29%;left:-24%;top:9%;background-image:radial-gradient(ellipse at 26% 18%,#fff,transparent 35%),linear-gradient(145deg,#51cbb6,#4774eb);box-shadow:inset 6px 4px 9px #fff9,0 11px 15px #0003; }
.contact-art::before { background-image:radial-gradient(ellipse at 25% 17%,rgba(255,255,255,.96) 0,rgba(255,255,255,.5) 9%,transparent 31%),radial-gradient(ellipse at 77% 83%,rgba(30,42,115,.54),transparent 45%),linear-gradient(145deg,#f15c91,#ffbc42 38%,#49c8b7 69%,#4d72ea); box-shadow:inset 18px 13px 22px rgba(255,255,255,.57),inset -22px -27px 31px rgba(24,36,92,.3),0 38px 46px rgba(0,0,0,.3); }
.contact-art::after { border-color:rgba(255,249,225,.77); border-width:23px;box-shadow:inset 0 5px 12px #fff8,0 9px 13px #25346442; }
.contact-art span,.contact-art i,.contact-art b { box-shadow:inset 9px 7px 13px rgba(255,255,255,.68),inset -9px -12px 14px rgba(30,38,117,.2),0 18px 22px rgba(0,0,0,.23); }

.brand-mark::before { background-image:radial-gradient(ellipse at 28% 17%,#fff 0,rgba(255,255,255,.62) 13%,transparent 33%),linear-gradient(145deg,#f04e91,#ffbd46 48%,#44c5b5);box-shadow:inset 3px 3px 6px #fff9,inset -5px -7px 9px #233e6545,0 8px 12px #19251f2b; }
.intro-paint { background-image:radial-gradient(ellipse at 26% 18%,#fff 0,rgba(255,255,255,.62) 12%,transparent 34%),radial-gradient(ellipse at 76% 83%,#293c8a99,transparent 45%),linear-gradient(145deg,#f25d93,#ffc447 48%,#45c9b7);box-shadow:inset 11px 8px 15px #ffffff85,inset -11px -14px 16px #1e386b45,0 20px 24px #0004; }
.intro-paint::after { content:"";position:absolute;width:52%;height:22%;left:14%;top:15%;border-radius:50%;background:linear-gradient(90deg,#fff9,transparent);filter:blur(5px);transform:rotate(-18deg); }
.service-set i { border-radius:45% 55% 48% 52%;text-shadow:0 2px 0 #fff8,0 5px 5px #b9337555;filter:drop-shadow(0 5px 5px #31422b30); }

:root { --page-gutter:56px; }
.section-wrap { width:min(var(--wrap),calc(100% - 2 * var(--page-gutter))); }

.brand-mark { width:48px;height:42px;display:block;isolation:isolate; }
.brand-mark::before { content:none; }
.brand-mark i { position:absolute;display:block;border-radius:8px;box-shadow:inset 3px 2px 4px #fff9,inset -4px -5px 6px #151f4f55,0 4px 6px #17262228; }
.brand-mark i:nth-child(1) { width:21px;height:17px;left:1px;top:2px;background:linear-gradient(145deg,#ff9a99,#e53172 60%,#781b60); }
.brand-mark i:nth-child(2) { width:23px;height:15px;left:24px;top:1px;background:linear-gradient(145deg,#ffcf71,#e9509b 58%,#692673); }
.brand-mark i:nth-child(3) { width:16px;height:20px;left:0;top:21px;background:linear-gradient(145deg,#6ce2dd,#238ad3 64%,#283a9e); }
.brand-mark i:nth-child(4) { width:24px;height:20px;left:17px;top:19px;background:linear-gradient(145deg,#d472eb,#7c38c0 55%,#311657); }
.brand-mark i:nth-child(5) { width:17px;height:17px;left:31px;top:23px;background:linear-gradient(145deg,#ffc36e,#ed4e72 62%,#671e49); }
.brand-mark i:nth-child(6) { width:18px;height:11px;left:14px;top:7px;background:linear-gradient(145deg,#5fe4c9,#138f87 70%,#165456); }
.brand-mark b { position:absolute;inset:0;z-index:2;display:grid;place-items:center;color:#fff8f2;font-size:17px;letter-spacing:-.08em;text-shadow:0 2px 4px #171b4e88; }
.brand-lockup:hover .brand-mark i { animation:brand-tile-pop .55s cubic-bezier(.2,.7,.2,1) both; }
.brand-lockup:hover .brand-mark i:nth-child(2n) { animation-delay:.05s; }
.intro-paint { width:124px;height:90px;right:4%;background:none;box-shadow:none;opacity:1;display:block; }
.intro-paint::after { display:none; }
.intro-paint { filter:blur(3px) contrast(8); }
.intro-paint i { position:absolute;display:block;border-radius:50%;box-shadow:inset 7px 5px 10px #fff9,inset -8px -10px 13px #17234e77,0 12px 14px #0003; }
.intro-paint i:nth-child(1) { width:49px;height:50px;left:0;top:7px;background:radial-gradient(ellipse at 28% 21%,#fff 0,rgba(255,255,255,.5) 13%,transparent 34%),linear-gradient(130deg,#00f5d4 0%,#226dff 28%,#bf22ff 55%,#ff2d9a 76%,#faff00 100%);animation:lava-flow-a 6.4s ease-in-out infinite; }
.intro-paint i:nth-child(2) { width:62px;height:54px;left:45px;top:4px;background:radial-gradient(ellipse at 28% 21%,#fff 0,rgba(255,255,255,.5) 13%,transparent 34%),linear-gradient(145deg,#faff00 0%,#00f5d4 28%,#226dff 54%,#bf22ff 78%,#ff2d9a 100%);animation:lava-flow-b 7.6s ease-in-out infinite; }
.intro-paint i:nth-child(3) { width:50px;height:23px;left:37px;top:61px;background:linear-gradient(120deg,#00f5d4,#226dff 30%,#bf22ff 59%,#ff2d9a 82%,#faff00);animation:lava-flow-a 5.8s ease-in-out -2.3s infinite; }
.about { padding-top:40px;padding-bottom:42px; }
.about-signature { display:none; }
.work { padding-top:var(--page-gutter);padding-bottom:var(--page-gutter); }
.work-grid { row-gap:var(--page-gutter); }
.play-section { padding-top:var(--page-gutter);padding-bottom:var(--page-gutter); }
.services-paint { width:104px;height:115px;right:7%;top:18px;border-radius:13px 18px 12px 19px;transform:rotate(-8deg); }
.services-paint::before { inset:9px 10px auto auto;width:28px;height:48px;border:0;border-radius:10px;background:linear-gradient(145deg,#8ee8e0,#2676da 64%,#222f82);box-shadow:inset 4px 3px 6px #fff9,0 8px 10px #101c5544;transform:rotate(8deg); }
.services-paint::after { width:49px;height:29px;left:-8px;top:69px;border-radius:9px;background:linear-gradient(145deg,#ffe5a0,#de7d40 62%,#633444); }
.clients { padding-top:var(--page-gutter);padding-bottom:var(--page-gutter); }
.clients-heading { margin-bottom:24px; }
.clients-heading>p { display:none; }
.contact-wrap { padding-top:var(--page-gutter);padding-bottom:var(--page-gutter); }
.contact-copy>.eyebrow { color:#f7f4ed;font-size:clamp(25px,2.25vw,32px);letter-spacing:.03em;margin-bottom:18px; }
.contact-details { margin-top:var(--page-gutter);gap:12px 22px;font:clamp(25px,2.25vw,32px)/1.35 var(--sans); }
.contact-art { opacity:.045; }
.contact-art::before { border-radius:17px 24px 16px 24px; }
.contact-art::after { width:86px;height:198px;left:63%;top:16%;border:0;border-radius:15px;background:linear-gradient(145deg,#f2c76e,#99529e 58%,#263a90);box-shadow:inset 7px 5px 10px #fff8,inset -7px -10px 12px #101b5844,0 14px 20px #17262233;transform:rotate(9deg); }
.contact-art span { border-radius:12px; }
.contact-art i,.contact-art b { border-radius:12px; }
.contact-button { display:none; }

.work-grid { column-gap:clamp(14px,2vw,25px); }
.project-art::before,.project-art::after { border-radius:15px 22px 14px 24px; }
.project-art::before { box-shadow:inset 13px 9px 17px rgba(255,255,255,.62),inset -16px -20px 25px rgba(29,36,91,.3),0 25px 24px rgba(24,34,38,.24); }
.project-art::after { border-radius:12px 17px 11px 17px; }
.game-poster[data-shape="orb"] .game-shape { border-radius:50%;clip-path:none; }
.game-poster[data-shape="orb"] .shape-small { border-radius:50%; }
.game-poster[data-shape="flower"] .game-shape { clip-path:polygon(50% 0%,61% 20%,78% 7%,80% 28%,100% 36%,84% 50%,100% 64%,80% 72%,77% 94%,59% 83%,50% 100%,40% 81%,20% 93%,21% 70%,0% 62%,17% 49%,0% 37%,21% 28%,24% 7%,41% 19%);border-radius:0;filter:drop-shadow(0 19px 16px rgba(27,38,61,.28)); }
.game-poster[data-shape="flower"] .shape-small { clip-path:polygon(50% 0%,61% 20%,78% 7%,80% 28%,100% 36%,84% 50%,100% 64%,80% 72%,77% 94%,59% 83%,50% 100%,40% 81%,20% 93%,21% 70%,0% 62%,17% 49%,0% 37%,21% 28%,24% 7%,41% 19%);border-radius:0; }
.game-poster[data-shape="flower"] .game-shape { clip-path:var(--flower-shape); }
.game-poster[data-shape="ribbon"] .shape-main { width:76%;height:30%;left:10%;top:28%;border-radius:44% 56% 48% 52%/56% 44% 56% 44%;transform:rotate(-29deg) skew(-10deg); }
.game-poster[data-shape="ribbon"] .shape-small { width:42%;height:19%;left:46%;top:58%;border-radius:47% 53% 45% 55%/56% 43% 57% 44%;transform:rotate(30deg) skew(12deg); }
.game-poster[data-shape="star"] .game-shape { clip-path:polygon(50% 0%,62% 31%,96% 16%,78% 47%,100% 66%,66% 68%,69% 100%,48% 76%,22% 98%,28% 65%,0% 54%,29% 43%,16% 12%,44% 30%);border-radius:0;filter:drop-shadow(0 18px 15px rgba(27,38,61,.3)); }
.game-poster[data-shape="star"] .shape-small { clip-path:polygon(50% 0%,62% 31%,96% 16%,78% 47%,100% 66%,66% 68%,69% 100%,48% 76%,22% 98%,28% 65%,0% 54%,29% 43%,16% 12%,44% 30%);border-radius:0; }
.game-poster[data-shape="ribbon"] .game-shape { clip-path:var(--ribbon-shape);filter:drop-shadow(0 15px 10px rgba(27,38,61,.27)); }
.game-poster[data-shape="flower"] .shape-small::after,.game-poster[data-shape="star"] .shape-small::after { display:none; }

@keyframes brand-tile-pop { 50% { translate:0 -3px;rotate:3deg;scale:1.08; } }
@keyframes lava-flow-a {
  0%,100% { transform:translate(0,0) scale(.96,1.04);border-radius:52% 48% 60% 40% / 45% 57% 43% 55%; }
  28% { transform:translate(11%,4%) scale(1.18,.86);border-radius:43% 57% 42% 58% / 58% 42% 58% 42%; }
  56% { transform:translate(20%,-5%) scale(.88,1.16);border-radius:61% 39% 53% 47% / 42% 58% 42% 58%; }
  78% { transform:translate(8%,7%) scale(1.1,.91);border-radius:44% 56% 61% 39% / 56% 44% 56% 44%; }
}
@keyframes lava-flow-b {
  0%,100% { transform:translate(0,0) scale(1.04,.94);border-radius:45% 55% 42% 58% / 57% 43% 57% 43%; }
  31% { transform:translate(-14%,-5%) scale(.88,1.16);border-radius:58% 42% 61% 39% / 42% 58% 42% 58%; }
  58% { transform:translate(-19%,6%) scale(1.17,.88);border-radius:40% 60% 47% 53% / 58% 42% 58% 42%; }
  82% { transform:translate(-7%,-4%) scale(.94,1.08);border-radius:57% 43% 39% 61% / 44% 56% 44% 56%; }
}

@media (min-width:1700px) { :root { --page-gutter:80px; } }
@media (max-width:1050px) { :root { --page-gutter:36px; }.contact-details { font-size:20px; } }
@media (max-width:680px) {
  :root { --page-gutter:19px; }
  .work-grid { row-gap:var(--page-gutter); }
  .about { padding-top:var(--page-gutter);padding-bottom:var(--page-gutter); }
  .intro-paint { right:0;width:74px;height:60px; }
  .intro-paint i:nth-child(1) { width:32px;height:34px; }.intro-paint i:nth-child(2) { width:37px;height:36px;left:31px; }.intro-paint i:nth-child(3) { width:36px;height:18px;left:24px;top:42px; }
  .clients { padding-top:var(--page-gutter);padding-bottom:var(--page-gutter); }
  .contact-wrap { padding-top:var(--page-gutter);padding-bottom:var(--page-gutter); }.contact-copy>.eyebrow { font-size:22px; }.contact-details { margin-top:var(--page-gutter);font-size:22px;gap:11px; }

  .services-paint { width:58px;height:69px;top:29px; }.services-paint::before { width:18px;height:31px; }.services-paint::after { width:31px;height:19px;top:43px;left:-5px; }
}
.hero-bottom p,.about-text,.about-lead,.play-description,.work-intro { text-wrap:pretty; }
.game-poster[data-palette="ocean"] .shape-small { background-image:radial-gradient(ellipse at 27% 18%,#ffffffed,transparent 31%),radial-gradient(ellipse at 74% 82%,#182f73aa,transparent 48%),linear-gradient(145deg,#183aba,#2b7de3 39%,#27c7ca 68%,#9be5af); }
.game-poster[data-palette="sunset"] .shape-small { background-image:radial-gradient(ellipse at 27% 18%,#ffffffed,transparent 31%),radial-gradient(ellipse at 74% 82%,#87306c88,transparent 48%),linear-gradient(145deg,#ffbd40,#ff704d 42%,#ee4a9c 75%,#b54cc5); }
.game-poster[data-palette="garden"] .shape-small { background-image:radial-gradient(ellipse at 27% 18%,#ffffffed,transparent 31%),radial-gradient(ellipse at 74% 82%,#365c6e88,transparent 48%),linear-gradient(145deg,#54b879,#bee555 40%,#7ccfcb 70%,#926cd4); }
.game-poster[data-palette="berry"] .shape-small { background-image:radial-gradient(ellipse at 27% 18%,#ffffffed,transparent 31%),radial-gradient(ellipse at 74% 82%,#31145099,transparent 48%),linear-gradient(145deg,#4539c9,#be4bd0 45%,#f05380 78%,#ffbd52); }
.game-poster[data-palette="citrus"] .shape-small { background-image:radial-gradient(ellipse at 27% 18%,#ffffffed,transparent 31%),radial-gradient(ellipse at 74% 82%,#24633b88,transparent 48%),linear-gradient(145deg,#f4e74c,#afe23e 45%,#40c77c 74%,#31b9bc); }
.game-poster[data-palette="mono"] .shape-small { background-image:radial-gradient(ellipse at 27% 18%,#ffffffed,transparent 31%),radial-gradient(ellipse at 74% 82%,#10131499,transparent 48%),linear-gradient(145deg,#fff,#b3b6b2 40%,#4f5451 72%,#141a19); }
.game-poster { --small-shape-fill:linear-gradient(145deg,#ed5798 4%,#ffbd45 34%,#52c8b0 64%,#4d70ec 100%); }
.game-poster[data-palette="ocean"] { --small-shape-fill:linear-gradient(145deg,#183aba,#2b7de3 39%,#27c7ca 68%,#9be5af); }
.game-poster[data-palette="sunset"] { --small-shape-fill:linear-gradient(145deg,#ffbd40,#ff704d 42%,#ee4a9c 75%,#b54cc5); }
.game-poster[data-palette="garden"] { --small-shape-fill:linear-gradient(145deg,#54b879,#bee555 40%,#7ccfcb 70%,#926cd4); }
.game-poster[data-palette="berry"] { --small-shape-fill:linear-gradient(145deg,#4539c9,#be4bd0 45%,#f05380 78%,#ffbd52); }
.game-poster[data-palette="citrus"] { --small-shape-fill:linear-gradient(145deg,#f4e74c,#afe23e 45%,#40c77c 74%,#31b9bc); }
.game-poster[data-palette="mono"] { --small-shape-fill:linear-gradient(145deg,#fff,#b3b6b2 40%,#4f5451 72%,#141a19); }
.game-poster[data-shape="star"] .shape-small { background-image:radial-gradient(ellipse at 28% 18%,rgba(255,255,255,.95),transparent 32%),var(--small-shape-fill); }

@keyframes logo-lift { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-3px); } }
@keyframes intro-orbit { 0%,100% { transform:translateY(-50%) rotate(-16deg) scale(1); border-radius:56% 44% 45% 55%/58% 40% 60% 42%; } 50% { transform:translateY(-55%) rotate(15deg) scale(1.08); border-radius:42% 58% 62% 38%/44% 62% 38% 56%; } }
@keyframes approach-sheen { 0%,35% { transform:translateX(-100%); } 75%,100% { transform:translateX(100%); } }
@keyframes signature-draw { 0% { stroke-dashoffset:950; } 45%,100% { stroke-dashoffset:0; } }
@keyframes signature-a { 0%,100% { transform:scaleY(1.28) rotate(0); } 50% { transform:scaleY(1.5) rotate(-3deg); } }

@media (max-width: 1050px) {
  .contact-wrap { grid-template-columns:1fr; gap:44px; }
  .contact-form { max-width:650px; }
  .contact-art { right:-12%; top:10px; }
}
@media (max-width: 680px) {
  .brand-lockup { min-width:120px; }.brand-copy b { font-size:9px; }
  .intro-inner { grid-template-columns:1fr 24px; }.intro-paint { right:2%; width:56px; height:48px; }
  .play-stage,.play-stage[data-orientation="horizontal"] { width:100%; aspect-ratio:.92 / 1; min-height:0; }
  .play-stage[data-orientation="horizontal"] { aspect-ratio:1.25 / 1; }
  .game-poster { width:220px; height:300px; }.game-poster[data-orientation="horizontal"] { width:min(310px,78vw);height:210px; }
  .about-signature p { font-size:clamp(20px,6.5vw,29px); }
  .facts { gap:18px 24px; }.facts div { min-width:95px; }
  .contact-wrap { padding-top:67px; padding-bottom:42px; gap:37px; }
  .contact-wrap h2 { font-size:clamp(46px,11vw,70px); }
  .contact-button { margin-top:40px; }
  .contact-form { grid-template-columns:1fr; gap:14px; padding:18px; }
  .contact-form label,.contact-form .form-wide,.contact-form>.eyebrow,.contact-form button,.form-status { grid-column:1; }

}

/* Refinements from the latest review */

/* Compact partner grid with consistent, smaller logo marks. */
.clients { padding-top:34px; padding-bottom:36px; }
.clients-heading { margin-bottom:18px; }
.clients-heading h2 { font-size:clamp(38px,4vw,58px); }
@media (max-width:1050px) { .clients { padding-block:30px; } }
@media (max-width:680px) { .clients { padding-block:var(--page-gutter); } }

/* Contact labels and links share the clean display type used in the main headings. */
.contact-copy>.eyebrow { font-family:var(--sans); font-size:clamp(20px,2vw,25px); font-weight:650; letter-spacing:0; margin-bottom:16px; }
.contact-details { display:grid; grid-template-columns:1fr; justify-items:start; gap:7px; font:650 clamp(20px,2vw,25px)/1.4 var(--sans); }
.contact-details .contact-telegram { grid-column:1; }
.contact-telegram span { color:var(--lime); }
@media (max-width:680px) { .contact-copy>.eyebrow,.contact-details { font-size:19px; } }

/* Brand lockups blend two bright, shifting forms like a small lava lamp. */
.brand-mark { position:relative; }
.brand-fluid { position:absolute;inset:0;z-index:0;filter:blur(1.5px) contrast(8); }
.brand-mark i:nth-child(1),.brand-mark i:nth-child(2) { width:58%;height:61%;top:19%;border-radius:48% 52% 61% 39% / 55% 43% 57% 45%;background:radial-gradient(ellipse at 28% 21%,#fff 0,rgba(255,255,255,.48) 13%,transparent 34%),linear-gradient(130deg,#00f5d4 0%,#226dff 28%,#bf22ff 55%,#ff2d9a 76%,#faff00 100%); }
.brand-mark i:nth-child(1) { left:3%;animation:lava-flow-a 6.4s ease-in-out infinite; }
.brand-mark i:nth-child(2) { left:38%;animation:lava-flow-b 7.6s ease-in-out infinite; }
.brand-fluid i { box-shadow:inset 3px 3px 7px #fff9,inset -5px -7px 9px #08236566,0 4px 8px #081a3f55; }
.brand-lockup:hover .brand-mark i { animation-play-state:paused; }
.brand-mark b { font-size:15px; }

/* Matte color transitions with broad, soft shading across the site's decorative forms. */

.intro-paint i,.brand-mark i,.services-paint,.contact-art span,.contact-art i,.contact-art b { box-shadow:inset 4px 3px 8px #fff7,inset -5px -7px 10px #22305824,0 8px 12px #17262218; }
.services-paint::before,.services-paint::after { display:none; }
.game-shape { box-shadow:inset 9px 7px 16px rgba(255,255,255,.32),inset -12px -16px 22px rgba(30,38,117,.17),0 17px 20px rgba(30,41,40,.14); filter:saturate(.92); }
.project-art::before,.project-art::after { box-shadow:inset 8px 6px 14px rgba(255,255,255,.34),inset -11px -14px 20px rgba(29,36,91,.18),0 17px 18px rgba(24,34,38,.14); }
.paint-world:not(.capsule-world) { filter:drop-shadow(0 15px 14px rgba(24,37,44,.1)); }

.hero { grid-template-columns:.92fr 1.08fr; }
@media (max-width:1050px) { }
@media (max-width:680px) { }

.hero { align-items:start; padding-top:var(--page-gutter); }

.hero-scroll { display:none; }
.logo-controls { display:flex;justify-content:flex-end;margin:0 0 18px; }
.veil-toggle { display:inline-flex;align-items:center;gap:10px;min-height:44px;position:relative;cursor:pointer;font-size:15px;line-height:1.4;user-select:none; }
.veil-toggle input { position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer; }
.veil-toggle-track { width:42px;height:24px;flex:none;border:1px solid #7f857b;border-radius:999px;background:transparent;transition:background .2s,border-color .2s; }
.veil-toggle-track::after { content:"";display:block;width:16px;height:16px;margin:3px;border-radius:50%;background:var(--ink);transition:transform .2s; }
.veil-toggle input:checked + .veil-toggle-track { background:#ef8eae;border-color:#b94b72; }
.veil-toggle input:checked + .veil-toggle-track::after { transform:translateX(18px); }
.veil-toggle input:focus-visible + .veil-toggle-track { outline:2px solid var(--ink);outline-offset:4px; }
@media (prefers-reduced-motion:reduce) { .veil-toggle-track,.veil-toggle-track::after { transition:none; } }
@media (max-width:1050px) { }
@media (max-width:680px) { }
@media (hover:none) { }

/* Use the same regular sans-serif weight and line rhythm as the About paragraph. */
.contact-copy>.eyebrow { font-family:var(--sans);font-size:clamp(20px,2vw,25px);font-weight:400;line-height:1.55;letter-spacing:-.01em; }
.contact-details { font:400 clamp(20px,2vw,25px)/1.55 var(--sans);letter-spacing:-.01em; }
.contact-telegram span { color:#d6ee68; }
@media (max-width:680px) { .contact-copy>.eyebrow,.contact-details { font-size:19px; } }

/* Poster objects have a broad light falloff, no decorative corner stripes, and direct manipulation. */
.game-shape { cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;box-shadow:inset 10px 8px 18px rgba(255,255,255,.25),inset -14px -17px 22px rgba(30,38,117,.18),0 20px 24px rgba(30,41,40,.16); }
.game-shape.is-dragging { cursor:grabbing;z-index:5;transition:none!important; }
.game-shape:focus-visible { outline:3px solid #172622;outline-offset:5px; }
.game-shape::after { content:"";position:absolute;inset:0;border:0;border-radius:inherit;background:radial-gradient(ellipse at 28% 18%,rgba(255,244,221,.3),transparent 43%),radial-gradient(ellipse at 78% 84%,rgba(24,35,91,.18),transparent 56%);filter:none;pointer-events:none; }
.game-poster[data-shape="star"] .game-shape::before,.game-poster[data-shape="flower"] .game-shape::before { display:none!important; }
.game-poster[data-shape="star"] .game-shape::after,.game-poster[data-shape="flower"] .game-shape::after { border:0; }
.game-poster[data-shape="star"] .game-shape { clip-path:polygon(50% 0%,56% 25%,62% 29%,94% 17%,77% 43%,76% 49%,99% 65%,68% 65%,64% 71%,69% 99%,48% 78%,43% 78%,22% 98%,29% 67%,26% 62%,1% 54%,28% 44%,31% 38%,16% 12%,43% 30%,48% 27% round 10px);border-radius:22px;filter:drop-shadow(0 18px 15px rgba(27,38,61,.22)); }
.game-poster[data-shape="flower"] .game-shape { border-radius:24px;filter:drop-shadow(0 18px 15px rgba(27,38,61,.2)); }
.game-poster[data-shape="star"] .shape-small,.game-poster[data-shape="flower"] .shape-small { border:0;background-color:transparent; }

/* One softly rounded form in the services band with its own four-stop gradient and colored studio light. */
.services-paint { border-radius:18px 24px 17px 23px;transform:rotate(0);background:radial-gradient(ellipse at 28% 22%,rgba(255,244,223,.34),transparent 40%),radial-gradient(ellipse at 78% 82%,rgba(42,42,105,.28),transparent 48%),linear-gradient(137deg,#dc6595 0%,#d69a55 31%,#62a99a 64%,#607fc1 100%);box-shadow:inset 7px 6px 14px rgba(255,255,255,.2),inset -9px -12px 18px rgba(30,38,91,.15),0 16px 20px rgba(30,45,40,.16); }
.services-paint::before,.services-paint::after { display:none!important; }

@media (max-width:680px) { .hero { align-items:stretch;padding-top:52px; } }

/* Remove inset edge streaks from draggable poster shapes. */
.game-shape { box-shadow:0 18px 25px rgba(30,41,40,.18)!important; }
.game-shape::after { display:none!important; }
.game-shape.shape-main::after,.game-shape.shape-small::after { display:none!important; }

/* Smaller tilted studio mark in the services band. */
.services-paint { width:52px;height:60px;right:8%;top:30px;transform:rotate(35deg); }
@media (max-width:680px) { .services-paint { width:42px;height:48px;right:7%;top:36px;transform:rotate(35deg); } }
@media (max-width:1050px) { }
@media (max-width:680px) { }
@media (hover:none) { }

/* Align the hero arrow with the text edge and the bottom of the moving artwork. */
.hero-copy { align-self:stretch;display:flex;flex-direction:column;padding-bottom:0; }
.hero-bottom { width:fit-content;max-width:100%;flex:1;display:flex;flex-direction:column;align-items:flex-start; }
.hero-bottom p { max-width:100%; }
.hero-note { position:static;display:block;margin-top:34px;color:#7f857b; }
.round-link { margin-top:auto;align-self:flex-end; }
@media (min-width:681px) {
  .hero { height:auto;min-height:0;max-height:none;padding-bottom:40px; }
  .hero-copy { align-self:start; }
  .hero h1 { margin-bottom:24px; }
  .hero-bottom { width:100%; }
  .hero-note { position:absolute;left:70px;bottom:18px;margin:0; }
  .round-link { align-self:flex-start;margin:24px 0 0;flex:none; }
  .round-link-mobile { display:none; }
  .round-link svg { display:block; }
}
@media (max-width:680px) {
  .hero-copy { display:block;height:auto;padding-bottom:0; }
  .hero-bottom { width:100%;max-width:none;flex:none;display:grid;grid-template-columns:1fr auto;align-items:end;gap:10px; }
  .hero-bottom p { grid-row:1;grid-column:1; }
  .hero-note { grid-row:2;grid-column:1/-1;margin-top:22px;font-size:8px; }
  .round-link { grid-row:1;grid-column:2;align-self:end;justify-self:end;margin:0;width:39px;height:39px; }
}

/* Keep every project image frame and card gap consistent across breakpoints. */
.project-image { aspect-ratio:16 / 9;min-height:0; }
.work-grid { gap:24px; }
.project-meta { padding-top:14px;gap:12px; }
@media (max-width:680px) { .project-image { aspect-ratio:16 / 9;min-height:0; } }

/* Start the poster composer with the first, round form. */
.game-poster[data-shape="orb"] .game-shape { border-radius:50%;clip-path:none; }

/* The decorative service form softly touches the top and bottom edges. */
.services-paint {
  --services-blob-height:72px;
  right:8%;top:0;bottom:auto;width:62px;height:var(--services-blob-height);opacity:.8;
  animation:service-vertical-bounce 5.4s cubic-bezier(.45,.05,.55,.95) infinite;
}
@keyframes service-vertical-bounce {
  0%,100% { top:0;transform:rotate(12deg) scale(1,1.04); }
  7% { top:0;transform:rotate(12deg) scale(1.12,.82); }
  45% { top:calc(100% - var(--services-blob-height));transform:rotate(-9deg) scale(1,1); }
  50% { top:calc(100% - var(--services-blob-height));transform:rotate(-9deg) scale(1.12,.82); }
  55% { top:calc(100% - var(--services-blob-height));transform:rotate(-9deg) scale(1,1); }
}
@media (max-width:680px) { .services-paint { --services-blob-height:52px;width:44px;height:52px;right:7%; } }
@media (prefers-reduced-motion:reduce) { .services-paint { animation:none; } }
@media (max-width:1050px) { }
@media (max-width:680px) { }

/* Match the About lead for the contact eyebrow and three contact links. */
.contact-copy>.eyebrow,.contact-details { font-family:var(--sans);font-size:clamp(20px,2vw,25px);font-weight:400;line-height:1.55;letter-spacing:-.01em; }
.contact-copy>.eyebrow { margin-bottom:18px; }
.contact-details { gap:7px; }
.contact-details .contact-telegram span { color:var(--lime); }
.contact-wrap h2 .contact-lead-phrase { color:var(--paper); }
@media (max-width:680px) { .contact-copy>.eyebrow,.contact-details { font-size:19px; } }

/* Darker emerald and rose oil-slick colors for the small lava marks. */
.brand-mark i:nth-child(1),.brand-mark i:nth-child(2) {
  background:radial-gradient(ellipse at 27% 20%,rgba(255,223,236,.82),transparent 30%),linear-gradient(132deg,#164c3d 0%,#28785c 27%,#9b3e70 58%,#ef78ac 82%,#452348 100%);
}
.brand-fluid i { box-shadow:inset 3px 3px 7px rgba(255,234,243,.64),inset -5px -7px 9px rgba(9,37,30,.42),0 4px 8px rgba(8,26,20,.34); }
.brand-fluid { filter:blur(1.5px) contrast(3.2) saturate(.88); }
.intro-paint i { box-shadow:inset 7px 5px 10px rgba(255,225,236,.72),inset -8px -10px 13px rgba(10,42,33,.45),0 12px 14px rgba(0,0,0,.18); }
.intro-paint i:nth-child(1) { background:radial-gradient(ellipse at 28% 21%,rgba(255,229,239,.86),transparent 30%),linear-gradient(130deg,#164c3d 0%,#28785c 28%,#9b3e70 58%,#ef78ac 84%,#452348 100%); }
.intro-paint i:nth-child(2) { background:radial-gradient(ellipse at 28% 21%,rgba(255,229,239,.86),transparent 30%),linear-gradient(145deg,#452348 0%,#164c3d 30%,#28785c 56%,#9b3e70 80%,#ef78ac 100%); }
.intro-paint i:nth-child(3) { background:linear-gradient(120deg,#164c3d,#28785c 30%,#9b3e70 61%,#ef78ac 84%,#452348); }
.intro-paint { filter:blur(2px) contrast(3.4) saturate(.9); }

/* Let the translucent pink-purple service blob gently bounce between the top and bottom edges. */
.services-paint {
  left:auto;right:8%;width:62px;height:72px;top:0;bottom:auto;opacity:.78;
  background:radial-gradient(ellipse at 27% 19%,rgba(255,225,243,.76),transparent 31%),linear-gradient(135deg,#ed70b0 0%,#a23891 38%,#563b94 68%,#1b716e 100%);
  box-shadow:inset 6px 5px 11px rgba(255,231,244,.54),inset -8px -10px 14px rgba(34,19,64,.42),0 12px 18px rgba(34,19,64,.2);
  animation:service-vertical-bounce 5.4s cubic-bezier(.45,.05,.55,.95) infinite;
}
@keyframes service-vertical-bounce {
  0%,100% { top:0;transform:rotate(12deg) scale(1,1.04); }
  7% { top:0;transform:rotate(12deg) scale(1.12,.82); }
  45% { top:calc(100% - 72px);transform:rotate(-9deg) scale(1,1); }
  50% { top:calc(100% - 72px);transform:rotate(-9deg) scale(1.12,.82); }
  55% { top:calc(100% - 72px);transform:rotate(-9deg) scale(1,1); }
}
@media (max-width:680px) {
  .services-paint { left:auto;right:7%;top:0;width:44px;height:52px; }
  @keyframes service-vertical-bounce {
    0%,100% { top:0;transform:rotate(12deg) scale(1,1.04); }
    7% { top:0;transform:rotate(12deg) scale(1.12,.82); }
    45% { top:calc(100% - 52px);transform:rotate(-9deg) scale(1,1); }
    50% { top:calc(100% - 52px);transform:rotate(-9deg) scale(1.12,.82); }
    55% { top:calc(100% - 52px);transform:rotate(-9deg) scale(1,1); }
  }
}
@media (prefers-reduced-motion:reduce) { .services-paint { animation:none; } }

/* Bubble curtain: the same rose/blush palette, matte edge and soft studio highlight. */
.logo-stage { position:relative;isolation:isolate; }
.veil-effects { position:absolute;inset:0;z-index:5;pointer-events:none;overflow:clip;overflow-clip-margin:90px; }
.veil-particle,.veil-bubble,.veil-burst { position:absolute;display:block; }
.veil-bubble { inset:0;border-radius:50%;background:radial-gradient(ellipse at 29% 22%,#fff6 0,transparent 39%),radial-gradient(ellipse at 70% 82%,#c8588733,transparent 55%),linear-gradient(145deg,#f9c8d8cc,#ef8eaeeb 58%,#e894b1c9);border:1px solid #e18aa788;box-shadow:inset 2px 3px 6px #fff5,inset -3px -5px 10px #c45d8120; }
.veil-bubble--large { inset:auto;box-shadow:inset 8px 10px 38px #fff5,inset -10px -18px 35px #c45d8120; }
.veil-pop-ring { position:absolute;inset:0;border:1px solid #e88eac;border-radius:50%;opacity:0; }
.veil-drop { position:absolute;left:50%;top:50%;width:4px;height:4px;margin:-2px;border-radius:50%;background:#ec97b4;opacity:0; }