/* Supplied 848 x 1855 design, rebuilt with real HTML and separately cropped visual regions. */
:root {
  --u: min(.1179245283vw, 1.509434px);
  --bg: #f0f1f4;
  --surface: #f9f9fb;
  --surface2: #e8eaf0;
  --ink: #101216;
  --text: #454a54;
  --muted: #858a95;
  --line: #dcdfe5;
  --accent: #171b22;
  --sage: #eceef2;
  --sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}
html { scroll-padding-top: 25px; scrollbar-width: none; }
html::-webkit-scrollbar { display: none; }
body { background: var(--bg); color: var(--text); font-family: var(--sans); overflow-x: clip; }
::selection { color: #fff; background: #242831; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 2px solid #717986; outline-offset: 5px; }
.header-inner, .container, .footer-inner { max-width: 1200px; padding-left: 48px; padding-right: 48px; }
.site-header { position: relative; top: auto; z-index: 30; height: calc(64 * var(--u)); background: #f0f1f4; border: 0; -webkit-backdrop-filter: none; backdrop-filter: none; }
.header-inner { position: relative; display: block; width: calc(848 * var(--u)); max-width: none; height: calc(64 * var(--u)); min-height: 0; margin: 0 auto; padding: 0; }
.brand { position: absolute; left: calc(60 * var(--u)); top: calc(17 * var(--u)); display: flex; align-items: center; gap: calc(13 * var(--u)); color: #1b1f27; }
.brand-symbol { display: block; width: calc(35 * var(--u)); height: calc(21 * var(--u)); flex-shrink: 0; }
.brand-symbol > svg, .brand-symbol > img { display: block; width: 100%; height: 100%; object-fit: contain; }
.brand-logo { display: block; width: calc(35 * var(--u)); height: calc(21 * var(--u)); object-fit: contain; }
.brand-name { color: #20242d; font: 650 calc(14 * var(--u))/calc(24 * var(--u)) var(--sans); letter-spacing: calc(.3 * var(--u)); }
nav { position: absolute; right: calc(58 * var(--u)); top: calc(20 * var(--u)); display: flex; align-items: center; gap: calc(31.5 * var(--u)); margin: 0; width: auto; order: initial; }
nav a { font: calc(10 * var(--u))/calc(20 * var(--u)) var(--sans); color: #30353e; letter-spacing: 0; padding: 0 0 calc(3 * var(--u)); white-space: nowrap; }
nav a:hover, nav a.active { color: #090c11; }
nav a::after, nav a.active::after { height: 1px; background: #8a9099; bottom: 0; }
nav a > span, .search-trigger { display: none; }

.design-home { width: calc(848 * var(--u)); max-width: none; margin: 0 auto; overflow: hidden; background: #f0f1f4; }
.design-hero { position: relative; height: calc(755 * var(--u)); width: 100%; max-width: none; margin: 0; padding: 0; text-align: center; }
.hero-eyebrow { position: absolute; top: calc(22 * var(--u)); left: 0; right: 0; margin: 0; color: #858b96; font: calc(8 * var(--u))/calc(12 * var(--u)) var(--mono); letter-spacing: calc(2 * var(--u)); }
.hero-title { position: absolute; top: calc(45 * var(--u)); left: 0; right: 0; margin: 0; }
.hero-title, .hero-title h1 { color: #06080a; font: 900 calc(48 * var(--u))/calc(58 * var(--u)) var(--sans); letter-spacing: calc(1 * var(--u)); }
.hero-title h1 { margin: 0; }
.hero-title > span { display: block; }
.hero-subtitle { position: absolute; top: calc(169 * var(--u)); left: 0; right: 0; color: #838996; font: calc(15 * var(--u))/calc(26 * var(--u)) var(--mono); letter-spacing: 0; margin: 0; }
.design-actions { position: absolute; top: calc(211 * var(--u)); left: 0; right: 0; display: flex; justify-content: center; align-items: center; gap: calc(30 * var(--u)); height: calc(33 * var(--u)); margin: 0; }
.primary-cta, .line-cta { display: inline-flex; align-items: center; justify-content: center; gap: calc(6 * var(--u)); font: calc(11 * var(--u))/calc(17 * var(--u)) var(--sans); letter-spacing: calc(.4 * var(--u)); }
.primary-cta { width: calc(113 * var(--u)); min-width: 0; height: calc(33 * var(--u)); min-height: 0; padding: 0; border: 1px solid #1b2028; border-radius: calc(21 * var(--u)); background: #1e232b; color: #fff; box-shadow: none; transition: background .2s ease, transform .2s ease; }
.primary-cta:hover { color: #fff; background: #363e49; transform: translateY(-1px); }
.line-cta { height: calc(27 * var(--u)); padding: 0 0 calc(3 * var(--u)); border-bottom: 1px solid #959ba5; color: #323943; }
.line-cta:hover { color: #090d14; border-color: #424b59; }
.hero-visual { position: absolute; left: 0; top: calc(253 * var(--u)); width: calc(848 * var(--u)); height: calc(502 * var(--u)); margin: 0; transform: none; background-image: url('assets/home-design-reference.png'); background-repeat: no-repeat; background-size: calc(848 * var(--u)) calc(1855 * var(--u)); background-position: 0 calc(-317 * var(--u)); }
.hero-visual > img { display: none; }

.feature-section { position: relative; width: 100%; margin: 0; padding: 0; text-align: center; }
.unity-feature { height: calc(471 * var(--u)); background: #f0f1f4; }
.section-kicker { position: absolute; left: 0; right: 0; margin: 0; color: #858b96; font: calc(10 * var(--u))/calc(15 * var(--u)) var(--mono); letter-spacing: calc(3 * var(--u)); }
.unity-feature .section-kicker { top: calc(20 * var(--u)); }
.feature-section h2 { position: absolute; left: 0; right: 0; margin: 0; color: #07090c; font: 800 calc(30 * var(--u))/calc(42 * var(--u)) var(--sans); letter-spacing: calc(.6 * var(--u)); }
.unity-feature h2 { top: calc(37 * var(--u)); }
.feature-image { position: absolute; display: block; width: calc(728 * var(--u)); max-width: none; left: calc(60 * var(--u)); margin: 0; padding: 0; overflow: hidden; border: 0; border-radius: calc(6 * var(--u)); background-image: url('assets/home-design-reference.png'); background-repeat: no-repeat; background-size: calc(848 * var(--u)) calc(1855 * var(--u)); }
.feature-image > img { display: none; }
.unity-feature .feature-image { top: calc(81 * var(--u)); height: calc(322 * var(--u)); background-position: calc(-60 * var(--u)) calc(-900 * var(--u)); }
.feature-link { position: absolute; left: 50%; transform: translateX(-50%); display: inline-flex; align-items: center; justify-content: center; gap: calc(7 * var(--u)); height: calc(21 * var(--u)); margin: 0; padding: 0 0 calc(2 * var(--u)); color: #343c48; border-bottom: 1px solid #8f98a6; font: calc(12 * var(--u))/calc(18 * var(--u)) var(--sans); white-space: nowrap; }
.unity-feature .feature-link { top: calc(426 * var(--u)); }
.feature-link:hover { color: #0b1320; border-color: #263748; }
.feature-link > span { display: inline-block; transition: transform .2s ease; }
.feature-link:hover > span { transform: translate(2px,-2px); }
.cocos-feature { height: calc(433 * var(--u)); background: #e9ebef; }
.cocos-feature .section-kicker { top: calc(41 * var(--u)); }
.cocos-feature h2 { top: calc(66 * var(--u)); }
.cocos-feature .feature-image { top: calc(104 * var(--u)); height: calc(259 * var(--u)); background-position: calc(-60 * var(--u)) calc(-1394 * var(--u)); }
.cocos-feature .feature-link { top: calc(387 * var(--u)); }
.design-contact { height: calc(101 * var(--u)); position: relative; width: 100%; margin: 0; padding: 0; text-align: center; background: #f0f1f4; }
.design-contact h2 { position: absolute; top: calc(20 * var(--u)); left: 0; right: 0; margin: 0; color: #070a0e; font: 800 calc(31 * var(--u))/calc(42 * var(--u)) var(--sans); letter-spacing: calc(.5 * var(--u)); }
.design-contact button, .design-contact > a { position: absolute; top: calc(72 * var(--u)); left: 50%; transform: translateX(-50%); display: inline-flex; align-items: center; justify-content: center; gap: calc(7 * var(--u)); margin: 0; padding: 0 0 calc(2 * var(--u)); color: #3c4552; border-bottom: 1px solid #a1a9b5; border-radius: 0; font: calc(12 * var(--u))/calc(18 * var(--u)) var(--sans); white-space: nowrap; }
.design-contact button:hover, .design-contact > a:hover { color: #0b1524; border-color: #4c5c71; }

footer { width: calc(848 * var(--u)); margin: 0 auto; height: calc(31 * var(--u)); border: 0; background: #f0f1f4; }
.footer-inner { display: flex; justify-content: flex-start; align-items: center; flex-direction: column; gap: 0; width: 100%; max-width: none; min-height: 0; height: 100%; margin: 0; padding: calc(5 * var(--u)) 0 0; }
.footer-inner .footer-brand, .footer-inner .footer-signature, .footer-inner p, .footer-inner > span { color: #929aa7; font: calc(8 * var(--u))/calc(14 * var(--u)) var(--mono); letter-spacing: calc(3 * var(--u)); text-transform: uppercase; margin: 0; }
.footer-note, .footer-inner > a:not(.footer-brand), .footer-links { display: none; }
.footer-inner #back-top { position: fixed; right: 25px; bottom: 25px; width: 35px; height: 35px; border: 1px solid #d2d9e3; border-radius: 50%; background: rgba(255,255,255,.87); color: #687b95; z-index: 20; }
/* Actual shipped projects remain separate from visual concept material. */
.project-list-section { max-width: 1200px; padding: 57px 48px 35px; margin: 0 auto; }
.project-list-section > h2 { color: #171b22; font-size: 26px; font-weight: 650; margin: 0 0 22px; }
.project-list-section .section-heading { margin-bottom: 25px; }
.section-heading h2 { color: #20252d; font-weight: 550; }
.section-heading h2::before { color: #898f99; }
.section-heading h2 small { color: #989da6; }
.text-link { color: #747c88; }
.text-link:hover { color: #171c24; }
.showcase-grid { gap: 22px; }
.game-card { border: 1px solid #dce0e7; border-radius: 8px; background: rgba(255,255,255,.65); overflow: hidden; box-shadow: none; transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease; }
.game-card:hover, .game-card:focus-visible { border-color: #aeb5bf; background: rgba(255,255,255,.85); transform: translateY(-3px); box-shadow: 0 10px 30px rgba(40,47,62,.055); }
.game-cover { background: #e8eaf0; border-color: #dce0e7; }
.game-cover > img, .game-card:hover .game-cover > img, .game-card:focus-visible .game-cover > img, .game-name > img, .detail-title > img { filter: none; }
.game-card:hover .game-cover > img { transform: scale(1.035); }
.game-index { color: #7b818b; }
.game-cover::after { background: #1e232b; color: white; border-radius: 3px; }
.game-info { padding: 22px 20px; }
.game-name h3 { color: #202732; font-weight: 500; }
.game-name > span { color: #727c8a; }
.game-info > p { color: #6b7380; }
.game-role { color: #4f5968; border-left-color: #939dac; }
.game-type { color: #8b929c; }

/* Shared light theme for routes beyond the home page. */
.page-top { padding-top: 55px; border-color: #dce0e7; }
.eyebrow { color: #9197a1; }
.page-top h1, .article-detail h1 { color: #141921; font-weight: 600; }
.page-top p { color: #7c8490; }
.page-body { padding-top: 30px; }
.work-filters { border-color: #d6dbe3; }
.work-filter { color: #8b919b; }
.work-filter.active, .work-filter:hover, .work-filter[aria-pressed="true"] { color: #212731; }
.work-filter::after { background: #555f6b; }
.work-filter > span { color: #9aa0aa; }
.breadcrumb { color: #8e96a2; }
.breadcrumb a:hover { color: #242d38; }
.detail-title h1 { color: #202631; font-weight: 550; }
.detail-title .eyebrow { color: #9299a4; }
.work-description { color: #79818d; }
.store-links a, .store-links button { color: #3b4553; background: #fafbfc; border: 1px solid #d5dbe4; border-radius: 4px; transition: background .2s ease, border-color .2s ease; }
.store-links a:hover, .store-links button:hover { color: #111a27; background: #fff; border-color: #a3adba; }
.work-summary { border-color: #dce0e7; }
.work-summary > span { color: #8993a0; }
.work-summary p { color: #4a5665; }
.gallery-thumb { background: #e9ecf2; border-color: #d4dbe5; border-radius: 6px; transition: border-color .2s ease; }
.gallery-thumb:hover { border-color: #a8b4c3; }
.gallery-thumb > span { color: #7a8798; }
.work-detail-bottom { color: #939ba7; }
.work-detail-bottom a { color: #526378; }
.article-meta, .article-meta .category { color: #9198a3; }
.article-card { border-color: #dce0e7; }
.article-card h3 { color: #444d5a; }
.article-card h3 a:hover { color: #111b2a; }
.article-card h3 a::after { color: #8c96a5; }
.section-note { color: #939ca9; }
.tab { color: #8f99a7; }
.tab.active, .tab:hover { color: #273347; }
.tab.active { box-shadow: 0 1px #7b899d; }
.content-note { background: #e8edf4; border-left-color: #a7b4c8; color: #738198; }
.prose { color: #697586; }
.prose h2, .prose h3 { color: #313e50; font-weight: 550; }
.prose a { color: #425c7b; border-color: #b9c5d5; }
.article-end { color: #6c7e97; border-color: #dce0e7; }
.tags span, .small-tags span { color: #7b889b; border-color: #d6dee9; background: rgba(255,255,255,.3); }
.toc { border-color: #dce0e7; color: #8b97a8; top: 110px; }
.toc strong { color: #5e718a; }
.toc a:hover { color: #354e6d; }
.about-block { border-color: #dce0e7; }
.avatar { color: #718199; }
.about-block h3 { color: #465b76; }
.about-block p, .stack { color: #8594a9; border-color: #dce0e7; }
.library-card { border-color: #dce0e7; }
.library-card h2 { color: #415771; }
.library-card p { color: #8997aa; }
.library-card a { color: #5e7590; border-color: #dce0e7; }
.library-card a span { color: #99a6b8; }
.library-card a:hover { color: #263e5b; }
.career-row { border-color: #dce0e7; }
.career-row > span { color: #8d9cb0; }
.career-row h2 { color: #405872; }
.career-row p { color: #7a8ea8; }
.career-status { color: #7d8da2; border-color: #d0dae8; }
.empty { color: #8999ad; }
.button.primary { color: #fff; background: #202936; border-radius: 25px; }
.project-card { background: #f5f7fa; border-color: #dce0e7; }
.project-info h3 { color: #3d536e; }
.project-info p { color: #8b9aaf; }
.project-label { color: #91a0b5; }

/* Existing search and screenshot dialogs keep their behaviour on the new surface. */
dialog { background: #f9fafc; color: #525e6d; border-color: #d3dae4; border-radius: 10px; box-shadow: 0 25px 100px rgba(35,43,58,.18); }
dialog::backdrop { background: rgba(27,34,44,.5); }
.search-top { border-color: #dce0e7; }
.search-prompt { color: #3b4a5c; }
.search-top input { color: #37465a; }
.search-top button { color: #8895a7; border-color: #d0d9e5; }
.search-hint, .search-empty { color: #9ba8ba; }
#search-results a { color: #4e6581; border-color: #dce0e7; }
#search-results a:hover { background: #edf1f7; }
#search-results small { color: #99a8bc; }
#image-dialog { background: #f2f4f8; border-color: #ccd5e2; border-radius: 8px; }
#image-dialog::backdrop { background: rgba(16,24,35,.83); }
.image-dialog-top { color: #6d829d; border-color: #dce0e7; }
.image-dialog-top button { color: #7b91ac; }
.image-preview > button { color: #8197b4; }
.image-preview > button:hover { color: #324e75; }
.toast { background: #263447; color: #f5f8fc; box-shadow: 0 5px 25px rgba(30,43,62,.12); }
.skip { background: #263447; color: #fff; }

/* Keep the same vertical composition on phones, with readable text sizes. */
@media (max-width: 700px) {
  .site-header { height: 64px; }
  .header-inner { height: 64px; }
  .brand { top: 19px; left: 22px; gap: 10px; }
  .brand-symbol, .brand-logo { width: 31px; height: 23px; }
  .brand-name { font-size: 13px; line-height: 24px; letter-spacing: .3px; }
  nav { top: 21px; right: 22px; gap: 22px; }
  nav a { font-size: 10px; line-height: 19px; padding-bottom: 3px; }
  .design-hero { height: auto; padding-top: 29px; }
  .hero-eyebrow { position: static; margin: 0 12px 15px; font-size: 8px; line-height: 13px; letter-spacing: 1.6px; }
  .hero-title { position: static; }
  .hero-title, .hero-title h1 { font-size: 36px; line-height: 46px; letter-spacing: -.2px; }
  .hero-subtitle { position: static; margin: 13px 10px 0; font-size: 12px; line-height: 22px; }
  .design-actions { position: static; height: 35px; margin-top: 22px; gap: 27px; }
  .primary-cta { width: 123px; height: 35px; border-radius: 22px; font-size: 11px; line-height: 18px; gap: 6px; }
  .line-cta { font-size: 11px; height: 28px; line-height: 18px; gap: 7px; padding-bottom: 3px; }
  .hero-visual { position: relative; top: auto; left: auto; margin-top: 12px; }
  .feature-section { height: auto; padding: 26px 0 29px; }
  .section-kicker, .unity-feature .section-kicker, .cocos-feature .section-kicker { position: static; font-size: 9px; line-height: 14px; letter-spacing: 2.6px; margin: 0 0 5px; }
  .feature-section h2, .unity-feature h2, .cocos-feature h2 { position: static; font-size: 25px; line-height: 35px; letter-spacing: .5px; }
  .feature-image, .unity-feature .feature-image, .cocos-feature .feature-image { position: relative; top: auto; left: auto; margin: 15px auto 0; border-radius: 4px; }
  .feature-link, .unity-feature .feature-link, .cocos-feature .feature-link { position: relative; top: auto; left: auto; transform: none; margin-top: 14px; height: 20px; font-size: 11px; line-height: 18px; padding-bottom: 2px; gap: 7px; }
  .cocos-feature { padding-top: 32px; padding-bottom: 30px; }
  .design-contact { height: auto; padding: 35px 0 24px; }
  .design-contact h2 { position: static; font-size: 26px; line-height: 38px; letter-spacing: .4px; }
  .design-contact button, .design-contact > a { position: relative; top: auto; left: auto; transform: none; margin-top: 8px; font-size: 11px; line-height: 18px; gap: 7px; padding-bottom: 2px; }
  footer { height: 44px; }
  .footer-inner { padding-top: 4px; }
  .footer-inner .footer-brand, .footer-inner .footer-signature, .footer-inner p, .footer-inner > span { font-size: 8px; line-height: 14px; letter-spacing: 2.3px; }
  .footer-inner #back-top { right: 17px; bottom: 17px; width: 31px; height: 31px; }
  .container { padding-left: 23px; padding-right: 23px; }
  .page-top { padding-top: 29px; }
  .page-top h1 { font-size: 28px; }
  .page-top p { line-height: 1.9; }
  .detail-title h1 { font-size: 20px; }
  .game-card { border-radius: 6px; }
  .game-info { padding: 18px 14px; }
  .game-role { line-height: 1.7; }
  .game-cover { border-color: #dce0e7; }
  .project-list-section { padding: 37px 23px 25px; }
}
@media (max-width: 360px) {
  .brand { left: 17px; gap: 8px; }
  nav { right: 17px; gap: 17px; }
  .brand-name { font-size: 12px; }
  .hero-title, .hero-title h1 { font-size: 32px; line-height: 42px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
  .primary-cta:hover, .game-card:hover { transform: none; }
  .reveal-section.will-reveal:not(.is-visible) { opacity: 1; transform: none; }
}

/* Contact uses an actual dialog, without taking space in the reference composition. */
#contact-dialog { width: calc(100% - 40px); max-width: 465px; padding: 0; top: 17vh; border: 1px solid #d4dae3; border-radius: 12px; background: #f9fafc; color: #3b4655; }
.contact-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 23px 25px 19px; border-bottom: 1px solid #e0e5ec; }
.contact-dialog-header h2 { font: 600 19px/1.6 var(--sans); color: #202a38; margin: 0; }
.contact-dialog-header button { font: 20px/1 var(--sans); color: #7e8b9d; padding: 5px; border: 0; background: none; }
.contact-dialog-header button:hover { color: #16263b; }
#contact-details { padding: 22px 25px 25px; }
.contact-channel { position: relative; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 5px; width: 100%; padding: 14px 42px 14px 16px; border: 1px solid #dce3ed; border-radius: 6px; background: #f1f4f8; text-align: left; margin: 0 0 12px; transition: background .2s ease, border-color .2s ease; }
.contact-channel:last-child { margin-bottom: 0; }
.contact-channel:hover { background: #e8eef6; border-color: #b8c7da; }
.contact-channel > span { font: 10px/1.6 var(--mono); letter-spacing: .6px; color: #8999af; }
.contact-channel > strong { font: 500 14px/1.8 var(--sans); color: #3b506d; overflow-wrap: anywhere; }
.contact-channel > i { position: absolute; right: 15px; top: 50%; transform: translateY(-50%); font: normal 15px/1 var(--sans); color: #8299b9; }
.contact-dialog-note, .contact-note { margin: 15px 0 0; font-size: 11px; line-height: 1.8; color: #99a6b8; }
@media (max-width: 700px) { #contact-dialog { top: 12vh; } .contact-dialog-header { padding: 19px 21px 16px; } .contact-dialog-header h2 { font-size: 17px; } #contact-details { padding: 19px 21px 22px; } .contact-channel > strong { font-size: 13px; } }
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@font-face{font-family:'Reference Heading';src:url('assets/heading-black.woff2?v=20261026-subpages') format('woff2');font-weight:100 900;font-display:swap}
.hero-title,.hero-title h1,.feature-section h2,.design-contact h2{font-family:'Reference Heading',var(--sans);font-weight:900}
.cocos-feature{background:linear-gradient(180deg,#e9eaee 0%,#e9eaee 22%,#eff0f3 88%,#f0f1f4 100%)}
.design-contact{background:linear-gradient(180deg,#f0f1f4,#f4f5f7)}
footer{background:#f4f5f7}
/* Optical alignment to the supplied title artwork at its 848px reference width. */
.hero-title{top:calc(41*var(--u));font-feature-settings:'palt' 1}
.hero-line-first{letter-spacing:0;transform:translateX(calc(3*var(--u)))}
.hero-line-second{letter-spacing:calc(2*var(--u));transform:translateX(calc(10*var(--u)))}
.design-actions{transform:translateX(calc(-7*var(--u)))}
.unity-feature h2{top:calc(29*var(--u))}
.cocos-feature h2{top:calc(53*var(--u))}
.design-contact h2{top:calc(11*var(--u));letter-spacing:calc(3.2*var(--u));font-feature-settings:'palt' 1;transform:translateX(calc(6*var(--u)))}
.footer-inner{padding-top:calc(3*var(--u))}
@media(max-width:700px){.hero-title,.unity-feature h2,.cocos-feature h2,.design-contact h2{top:auto}.design-actions{transform:none}.design-contact h2{letter-spacing:.4px;transform:none}}
.hero-line-first{letter-spacing:calc(2.3*var(--u));transform:translateX(calc(7.6*var(--u)))}
.hero-line-second{transform:translateX(calc(13*var(--u)))}
.unity-feature .section-kicker{top:calc(13*var(--u))}
.cocos-feature .section-kicker{top:calc(35*var(--u))}
.unity-feature .feature-link{top:calc(438*var(--u))}
.cocos-feature .feature-link{top:calc(378*var(--u))}
.design-contact h2{transform:translateX(calc(9*var(--u)))}
.design-contact button,.design-contact>a{top:calc(61*var(--u))}
@media(max-width:700px){.unity-feature .section-kicker,.cocos-feature .section-kicker,.unity-feature .feature-link,.cocos-feature .feature-link,.design-contact button,.design-contact>a{top:auto}.design-contact h2{transform:none}}