@font-face {
  font-family: "Inter";
  src: url("assets/Inter-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("assets/Inter-Medium.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

:root {
  color-scheme: light;
  --u: 1px;
  --frame-left: max(calc(650 * var(--u)), calc(49.21466vw - 168.92147 * var(--u)));
  --project-left: calc(var(--frame-left) - 230 * var(--u));
  --black: #0a0a0a;
  --gray: #707070;
  --surface: #f2f2f2;
  --blue: #ddf4ff;
  font-family: "Inter", Arial, sans-serif;
  font-synthesis: none;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  min-width: 320px;
  color: var(--black);
  background: #fff;
  font-family: "Inter", Arial, sans-serif;
  line-height: 1.3;
  letter-spacing: -0.03em;
}

a { color: inherit; text-decoration: none; }
img { display: block; }
h1, h2, h3, p, ul, figure { margin: 0; }
ul { padding: 0; list-style: none; }
.mobile-header { display: none; }

.frame {
  position: relative;
  width: 100%;
  min-height: calc(3694 * var(--u));
  overflow: visible;
  background: #fff;
  transition: min-height 0s 640ms;
}

body[data-view="pricing"] .frame { min-height: calc(960 * var(--u)); }
body[data-view="pricing"] .sidebar { height: 100svh; }

.sidebar {
  position: fixed;
  top: 0;
  z-index: 2;
  width: calc(400 * var(--u));
  height: 100svh;
  color: var(--black);
  background: #fff;
}

.logo {
  position: absolute;
  top: calc(40 * var(--u));
  left: calc(30 * var(--u));
  width: calc(26 * var(--u));
  height: calc(40.625 * var(--u));
  overflow: hidden;
}

.logo img {
  position: absolute;
  top: -28%;
  left: -64.58%;
  width: 222.92%;
  height: 142.67%;
  max-width: none;
}

.sidebar h1,
.sidebar h2,
.sidebar p,
.actions a,
.services li,
.project h3,
.project p,
.project-tags li,
.view-switcher button,
.price-card,
.build-card {
  font-family: "Inter", Arial, sans-serif;
  font-style: normal;
  line-height: 1.3;
}

.sidebar-content {
  position: absolute;
  top: calc(121 * var(--u));
  left: calc(30 * var(--u));
  display: flex;
  width: calc(337 * var(--u));
  flex-direction: column;
  align-items: flex-start;
  gap: calc(28 * var(--u));
}

.sidebar h1 {
  position: absolute;
  top: calc(121 * var(--u));
  left: calc(30 * var(--u));
  width: calc(326 * var(--u));
  font-size: calc(14 * var(--u));
  font-weight: 500;
  letter-spacing: -0.03em;
}

.intro-copy,
.process-copy,
.studio-copy,
.sidebar h2,
.copyright {
  position: absolute;
  left: calc(30 * var(--u));
  font-size: calc(14 * var(--u));
  letter-spacing: -0.03em;
}

.intro-copy {
  top: calc(164 * var(--u));
  width: calc(334 * var(--u));
  color: var(--black);
}

.actions {
  position: absolute;
  top: calc(239 * var(--u));
  left: calc(30 * var(--u));
  display: flex;
  align-items: center;
  gap: calc(10 * var(--u));
  height: calc(39 * var(--u));
  margin-bottom: calc(28 * var(--u));
}

.actions a {
  position: relative;
  height: calc(39 * var(--u));
  overflow: hidden;
  border-radius: calc(5 * var(--u));
  font-size: calc(14 * var(--u));
  letter-spacing: -0.03em;
  transition: background-color 220ms ease;
}

.actions a:focus-visible {
  outline: 1px solid var(--black);
  outline-offset: calc(3 * var(--u));
}

.pricing:hover { background: #ededed; }
.talk:hover { background: #d9f2fe; }

.pricing {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(13 * var(--u)) calc(15 * var(--u));
  background: var(--surface);
}

.talk {
  position: relative;
  display: flex;
  align-items: center;
  width: calc(246 * var(--u));
  overflow: hidden;
  background: var(--blue);
}

.talk span {
  margin-left: calc(20 * var(--u));
  white-space: nowrap;
}

.talk img {
  position: absolute;
  top: 50%;
  right: calc(15.5 * var(--u));
  width: calc(10.72 * var(--u));
  height: calc(9.92 * var(--u));
  opacity: 1;
  transform: translateY(-50%);
}

.process-copy {
  top: calc(308 * var(--u));
  width: calc(337 * var(--u));
  color: var(--gray);
  font-weight: 400;
}

.studio-copy {
  top: calc(383 * var(--u));
  width: calc(334 * var(--u));
  color: var(--gray);
  font-weight: 400;
}

.process-copy strong,
.studio-copy strong,
.sidebar h2 strong {
  color: var(--black);
  font-weight: 400;
}

.sidebar h2 {
  top: calc(458 * var(--u));
  width: calc(334 * var(--u));
  color: var(--gray);
  font-weight: 400;
}

.services {
  position: absolute;
  top: calc(501 * var(--u));
  left: calc(30 * var(--u));
  display: flex;
  width: calc(327 * var(--u));
  flex-wrap: wrap;
  align-content: flex-start;
  align-items: center;
  gap: calc(7 * var(--u));
}

.sidebar .sidebar-content > h1,
.sidebar .sidebar-content > h2,
.sidebar .sidebar-content > p,
.sidebar .sidebar-content > nav,
.sidebar .sidebar-content > ul {
  position: static;
  top: auto;
  left: auto;
}

.services li,
.project-tags li {
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(25 * var(--u));
  padding: 0 calc(9 * var(--u));
  border-radius: calc(5 * var(--u));
  color: var(--gray);
  background: var(--surface);
  font-size: calc(12 * var(--u));
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.03em;
  white-space: nowrap;
}

.services li,
.project-tags li {
  cursor: default;
  transition:
    color 180ms ease,
    background-color 220ms ease;
}

@media (hover: hover) {
  .services li:hover,
  .project-tags li:hover {
    color: var(--black);
    background: #ededed;
  }
}

.copyright {
  top: auto;
  bottom: calc(34.8 * var(--u));
  color: var(--gray);
  white-space: nowrap;
}

.socials a {
  position: absolute;
  top: auto;
  bottom: calc(39 * var(--u));
  height: calc(14 * var(--u));
}

.socials img { width: 100%; height: 100%; }
.socials .x { left: calc(311.76 * var(--u)); width: calc(15.65 * var(--u)); }
.socials .linkedin { left: calc(340.56 * var(--u)); width: calc(13.92 * var(--u)); }

.view {
  position: absolute;
  inset: 0;
}

.work {
  min-height: calc(3694 * var(--u));
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.view-switcher {
  position: absolute;
  top: calc(48 * var(--u));
  left: var(--frame-left);
  z-index: 5;
  display: flex;
  gap: calc(5 * var(--u));
}

.view-switcher button {
  appearance: none;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(22 * var(--u));
  height: calc(23 * var(--u));
  overflow: hidden;
  border: 0;
  padding: 0;
  border-radius: calc(5 * var(--u));
  color: var(--gray);
  background: var(--surface);
  font-size: calc(14 * var(--u));
  line-height: 1.3;
  letter-spacing: -0.03em;
  white-space: nowrap;
  cursor: pointer;
  transition:
    width 440ms cubic-bezier(0.22, 1, 0.36, 1),
    color 180ms ease,
    background-color 180ms ease;
}

.view-switcher button:first-child { width: calc(114 * var(--u)); }
.view-switcher button:hover { color: var(--black); }
.view-switcher button:focus-visible { outline: 1px solid var(--black); outline-offset: 2px; }
.switch-label {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  opacity: 1;
  transition: opacity 220ms ease;
}
.switch-label--pricing {
  opacity: 0;
}
body[data-view="pricing"] .view-switcher button:first-child { width: calc(22 * var(--u)); }
body[data-view="pricing"] .view-switcher button:last-child { width: calc(69 * var(--u)); }
body[data-view="pricing"] .switch-label--work {
  opacity: 0;
}
body[data-view="pricing"] .switch-label--pricing {
  opacity: 1;
}

.pricing-view {
  min-height: calc(960 * var(--u));
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-100vh);
}

body[data-view="pricing"] .work {
  display: none;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(100vh);
}

body.is-switching[data-view="pricing"] .work { display: block; }

body[data-view="pricing"] .pricing-view {
  visibility: visible;
  pointer-events: auto;
  transform: none;
}

body.is-switching .view {
  visibility: visible;
  will-change: transform;
  transition: transform 640ms cubic-bezier(0.76, 0, 0.24, 1);
}

body.is-switching {
  overflow: hidden;
}

.sidebar {
  view-transition-name: sticky-sidebar;
}

@keyframes snapshot-exit-down {
  from { transform: translateY(0); }
  to { transform: translateY(100%); }
}

@keyframes snapshot-enter-from-top {
  from { transform: translateY(-100%); }
  to { transform: translateY(0); }
}

@keyframes snapshot-exit-up {
  from { transform: translateY(0); }
  to { transform: translateY(-100%); }
}

@keyframes snapshot-enter-from-bottom {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}

html.snapshot-to-pricing::view-transition-old(root),
html.snapshot-to-pricing::view-transition-new(root),
html.snapshot-to-work::view-transition-old(root),
html.snapshot-to-work::view-transition-new(root) {
  opacity: 1;
  mix-blend-mode: normal;
  animation-duration: 640ms;
  animation-fill-mode: both;
  animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
}

html.snapshot-to-pricing::view-transition-old(root) {
  animation-name: snapshot-exit-down;
}

html.snapshot-to-pricing::view-transition-new(root) {
  animation-name: snapshot-enter-from-top;
}

html.snapshot-to-work::view-transition-old(root) {
  animation-name: snapshot-exit-up;
}

html.snapshot-to-work::view-transition-new(root) {
  animation-name: snapshot-enter-from-bottom;
}

html.snapshot-to-pricing::view-transition-group(sticky-sidebar),
html.snapshot-to-work::view-transition-group(sticky-sidebar) {
  z-index: 10;
  animation: none;
}

html.snapshot-to-pricing::view-transition-old(sticky-sidebar),
html.snapshot-to-work::view-transition-old(sticky-sidebar) {
  opacity: 1;
  animation: none;
}

html.snapshot-to-pricing::view-transition-new(sticky-sidebar),
html.snapshot-to-work::view-transition-new(sticky-sidebar) {
  opacity: 0;
  animation: none;
}

.pricing-grid {
  position: absolute;
  top: calc(106 * var(--u));
  left: var(--frame-left);
  display: flex;
  gap: calc(10 * var(--u));
  width: calc(756 * var(--u));
  overflow: hidden;
}

.price-card {
  position: relative;
  flex: 0 0 calc(373 * var(--u));
  width: calc(373 * var(--u));
  height: calc(471 * var(--u));
  overflow: hidden;
  border-radius: calc(5 * var(--u));
  background: var(--surface);
}

.price-card--partner { background: var(--blue); }

.price-card h3,
.build-card h3 {
  position: absolute;
  top: calc(20 * var(--u));
  left: calc(15 * var(--u));
  margin: 0;
  color: var(--black);
  font-size: calc(16 * var(--u));
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.03em;
  white-space: nowrap;
}

.price-description,
.build-card > p {
  position: absolute;
  top: calc(48 * var(--u));
  left: calc(15 * var(--u));
  width: calc(338 * var(--u));
  color: rgba(10, 10, 10, 0.7);
  font-size: calc(12 * var(--u));
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.03em;
}

.price-amount {
  position: absolute;
  top: calc(114 * var(--u));
  left: calc(15 * var(--u));
  color: var(--black);
  font-size: calc(23 * var(--u));
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.03em;
  white-space: nowrap;
}

.price-card--partner .price-amount { top: calc(101 * var(--u)); }
.price-amount small {
  color: rgba(10, 10, 10, 0.7);
  font-size: calc(12 * var(--u));
  font-weight: 500;
  letter-spacing: -0.03em;
}

.price-cta {
  position: absolute;
  top: calc(162 * var(--u));
  left: calc(15 * var(--u));
  display: flex;
  align-items: center;
  width: calc(338 * var(--u));
  height: calc(39 * var(--u));
  padding-left: calc(20 * var(--u));
  overflow: hidden;
  border-radius: calc(5 * var(--u));
  color: var(--black);
  transition: background-color 220ms ease;
}

.price-card--partner .price-cta { top: calc(149 * var(--u)); }
.price-cta--blue { background: rgba(189, 235, 255, 0.5); }
.price-cta--dark { color: #fff; background: var(--black); }
.price-cta--blue:hover { background: #d9f2fe; }
.price-cta--dark:hover { background: #202020; }
.price-cta:focus-visible {
  outline: 1px solid var(--black);
  outline-offset: calc(3 * var(--u));
}
.price-cta span {
  position: static;
  font-size: calc(16 * var(--u));
  line-height: 1.3;
  letter-spacing: -0.03em;
  white-space: nowrap;
}

.price-cta-label--mobile,
.build-divider,
.mobile-pricing-footer,
.mobile-work-footer { display: none; }
.price-cta img {
  position: absolute;
  top: 50%;
  right: calc(15.5 * var(--u));
  width: calc(10.72 * var(--u));
  height: calc(9.92 * var(--u));
  transform: translateY(-50%);
}

.price-divider {
  position: absolute;
  top: calc(216 * var(--u));
  left: calc(15 * var(--u));
  width: calc(338 * var(--u));
  height: calc(1 * var(--u));
}
.price-card--partner .price-divider { top: calc(203 * var(--u)); }

.feature-list {
  position: absolute;
  left: calc(15 * var(--u));
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc(15 * var(--u));
}
.feature-list--first { top: calc(231 * var(--u)); }
.feature-list--second { top: calc(343 * var(--u)); }
.price-card--partner .feature-list--first { top: calc(218 * var(--u)); }
.price-card--partner .feature-list--second { top: calc(330 * var(--u)); }
.feature-list li {
  display: flex;
  align-items: center;
  gap: calc(8 * var(--u));
  color: rgba(10, 10, 10, 0.7);
  font-size: calc(10 * var(--u));
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.03em;
  white-space: nowrap;
}
.feature-list li img {
  flex: 0 0 auto;
  width: calc(9.636 * var(--u));
  height: calc(6.625 * var(--u));
}

.build-card {
  position: absolute;
  top: calc(587 * var(--u));
  left: var(--frame-left);
  width: calc(756 * var(--u));
  height: calc(160 * var(--u));
  overflow: hidden;
  border-radius: calc(5 * var(--u));
  background: var(--surface);
}
.build-card .price-cta { top: calc(101 * var(--u)); }
.build-list { top: calc(18 * var(--u)); gap: calc(15 * var(--u)); }
.build-list--one { left: calc(413 * var(--u)); }
.build-list--two { left: calc(581 * var(--u)); }

.visual-stack {
  position: absolute;
  top: calc(106 * var(--u));
  left: var(--frame-left);
  display: flex;
  width: calc(756 * var(--u));
  flex-direction: column;
  gap: calc(10 * var(--u));
}

.visual {
  position: relative;
  width: 100%;
  height: calc(378 * var(--u));
  flex: 0 0 auto;
  overflow: hidden;
  background: var(--surface);
}

.visual img {
  position: absolute;
  max-width: none;
  object-fit: cover;
}

.visual--agentcard img {
  top: calc(20 * var(--u));
  left: calc(40 * var(--u));
  width: calc(676 * var(--u));
  height: calc(338 * var(--u));
  object-fit: cover;
}

.visual--your-brand .your-brand-link {
  position: absolute;
  inset: 0;
  display: block;
  cursor: pointer;
}

.visual--your-brand .your-brand-plus {
  top: 50%;
  left: 50%;
  width: calc(19 * var(--u));
  height: calc(19 * var(--u));
  object-fit: contain;
  transform: translate(-50%, -50%);
}

.visual--colrosa-static .colrosa-frame-one,
.visual--colrosa-loop .colrosa-loop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.visual--colrosa-loop .colrosa-loop { display: block; }

.visual--nomos img {
  top: calc(19 * var(--u));
  left: calc(40 * var(--u));
  width: calc(676 * var(--u));
  height: calc(340 * var(--u));
}

.visual--inkbox-static .inkbox-frame-one,
.visual--inkbox-loop .inkbox-loop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.visual--inkbox-loop .inkbox-loop { display: block; }

.visual--penguin-logo .penguin-project-logo {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(49.28 * var(--u));
  height: calc(77 * var(--u));
  overflow: hidden;
  transform: translate(-50%, -50%);
}

.visual--penguin-logo .penguin-project-logo img {
  top: -28%;
  left: -64.58%;
  width: 222.92%;
  height: 142.67%;
  max-width: none;
  object-fit: fill;
}

.visual--penguin-site .penguin-project-site {
  top: calc(40 * var(--u));
  left: calc(111 * var(--u));
  width: calc(534 * var(--u));
  height: calc(298 * var(--u));
  object-fit: contain;
}

.project {
  --desc-top: 65;
  --tag-top: 326;
  position: absolute;
  left: var(--project-left);
  width: calc(195 * var(--u));
  color: var(--gray);
}

.project--seven { top: calc(121 * var(--u)); }
.project--eight {
  top: calc(509 * var(--u));
  height: calc(363 * var(--u));
  --desc-top: 0;
}
.project--one { top: calc(897 * var(--u)); }
.project--colrosa-details {
  top: calc(1285 * var(--u));
  height: calc(363 * var(--u));
  --desc-top: 0;
}
.project--two { top: calc(1673 * var(--u)); }
.project--inkbox { --desc-top: 83; }
.project--inkbox-details {
  top: calc(2061 * var(--u));
  height: calc(363 * var(--u));
  --desc-top: 0;
}
.project--agentcard-intro { top: calc(2449 * var(--u)); }
.project--agentcard-details {
  top: calc(2837 * var(--u));
  height: calc(363 * var(--u));
  --desc-top: 0;
}
.project--your-brand {
  top: calc(3225 * var(--u));
  height: calc(363 * var(--u));
}

.project h3 {
  width: calc(195 * var(--u));
  color: var(--gray);
  font-size: calc(14 * var(--u));
  font-weight: 400;
  letter-spacing: -0.03em;
}

.project h3 strong,
.project p strong {
  color: var(--black);
  font-weight: 400;
}

.project p {
  position: absolute;
  top: calc(var(--desc-top) * var(--u));
  left: 0;
  width: calc(191 * var(--u));
  color: var(--gray);
  font-size: calc(14 * var(--u));
  font-weight: 400;
  letter-spacing: -0.03em;
}

.project-tags {
  position: absolute;
  top: calc(var(--tag-top) * var(--u));
  left: 0;
  display: flex;
  flex-wrap: wrap;
  gap: calc(7 * var(--u));
  width: calc(200 * var(--u));
}

.project--agentcard-details .project-tags,
.project--eight .project-tags,
.project--colrosa-details .project-tags,
.project--inkbox-details .project-tags,
.project--your-brand .project-tags {
  top: auto;
  bottom: calc(11 * var(--u));
}

@media (max-width: 0px) {
  :root {
    --u: 1px;
    --mu: min(1px, calc(100vw / 1080));
    --mobile-header-height: clamp(68px, calc(161 * var(--mu)), 161px);
    --mobile-type: clamp(14px, calc(30 * var(--mu)), 30px);
    --mobile-frame-unit: calc((min(100vw, 1080px) - 80 * var(--mu)) / 756);
  }

  body { overflow-x: hidden; }

  .mobile-header {
    display: block;
    position: fixed;
    inset: 0 0 auto;
    z-index: 20;
    height: var(--mobile-header-height);
    background: #fff;
  }

  .mobile-header-inner {
    position: relative;
    width: min(100%, 1080px);
    height: 100%;
    margin: 0 auto;
  }

  .mobile-header-logo {
    position: absolute;
    top: clamp(14px, calc(40 * var(--mu)), 40px);
    left: calc(40 * var(--mu));
    width: clamp(26px, calc(51.84 * var(--mu)), 51.84px);
    height: clamp(40.625px, calc(81 * var(--mu)), 81px);
    overflow: hidden;
  }

  .mobile-header-logo img {
    position: absolute;
    top: -28%;
    left: -64.58%;
    width: 222.92%;
    height: 142.67%;
    max-width: none;
  }

  .mobile-header-actions {
    position: absolute;
    top: clamp(14px, calc(46 * var(--mu)), 46px);
    right: calc(40 * var(--mu));
    display: flex;
    align-items: center;
  }

  .mobile-view-button,
  .mobile-sticky-talk {
    display: flex;
    align-items: center;
    height: clamp(40px, calc(73 * var(--mu)), 73px);
    overflow: hidden;
    border: 0;
    border-radius: clamp(5px, calc(9.407 * var(--mu)), 9.407px);
    font-family: "Inter", Arial, sans-serif;
    font-size: var(--mobile-type);
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -0.03em;
    white-space: nowrap;
  }

  .mobile-view-button {
    appearance: none;
    justify-content: center;
    padding: 0 clamp(15px, calc(28.22 * var(--mu)), 28.22px);
    color: var(--black);
    background: var(--surface);
    cursor: pointer;
  }

  .mobile-view-button--work { display: none; }
  body[data-view="pricing"] .mobile-view-button--pricing { display: none; }
  body[data-view="pricing"] .mobile-view-button--work { display: flex; }

  .mobile-sticky-talk {
    position: relative;
    width: 0;
    margin-left: 0;
    color: var(--black);
    background: var(--blue);
    opacity: 0;
    pointer-events: none;
    transform: translateX(calc(24 * var(--mu)));
    transition:
      width 520ms cubic-bezier(0.22, 1, 0.36, 1),
      margin-left 520ms cubic-bezier(0.22, 1, 0.36, 1),
      opacity 260ms ease,
      transform 520ms cubic-bezier(0.22, 1, 0.36, 1),
      background-color 220ms ease;
  }

  .mobile-sticky-talk span {
    margin-left: clamp(20px, calc(37 * var(--mu)), 37px);
  }

  .mobile-sticky-talk img {
    position: absolute;
    top: 50%;
    right: clamp(18px, calc(36.88 * var(--mu)), 36.88px);
    width: clamp(11px, calc(20.122 * var(--mu)), 20.122px);
    height: clamp(10px, calc(19.713 * var(--mu)), 19.713px);
    transform: translateY(-50%);
  }

  body.mobile-header-has-talk .mobile-sticky-talk,
  body[data-view="pricing"] .mobile-sticky-talk {
    width: clamp(170px, calc(367 * var(--mu)), 367px);
    margin-left: calc(10 * var(--mu));
    opacity: 1;
    pointer-events: auto;
    transform: none;
  }

  .frame,
  body[data-view="pricing"] .frame {
    display: block;
    min-height: 0;
    overflow: visible;
  }

  .sidebar,
  .view {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    min-height: 0;
  }

  .sidebar {
    width: min(100%, 1080px);
    margin: 0 auto;
    padding: clamp(92px, calc(201 * var(--mu)), 201px) calc(40 * var(--mu)) calc(29 * var(--mu));
  }

  body[data-view="pricing"] .sidebar { display: none; }
  .sidebar > .logo,
  .sidebar .pricing,
  .process-copy,
  .studio-copy,
  .copyright,
  .socials { display: none; }

  .sidebar-content {
    position: static;
    display: flex;
    width: min(calc(657 * var(--mu)), 100%);
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(24px, calc(40 * var(--mu)), 40px);
  }

  .sidebar h1,
  .intro-copy,
  .sidebar h2 {
    position: static;
    width: 100%;
    font-size: var(--mobile-type);
    line-height: 1.3;
    letter-spacing: -0.03em;
  }

  .sidebar h1 { font-weight: 500; }

  .actions {
    position: static;
    width: 100%;
    height: clamp(44px, calc(73 * var(--mu)), 73px);
    margin: 0;
  }

  .actions .talk {
    width: 100%;
    height: 100%;
    border-radius: clamp(5px, calc(9.407 * var(--mu)), 9.407px);
    font-size: var(--mobile-type);
  }

  .actions .talk span { margin-left: clamp(20px, calc(37 * var(--mu)), 37px); }
  .actions .talk img {
    right: clamp(18px, calc(36.88 * var(--mu)), 36.88px);
    width: clamp(11px, calc(20.122 * var(--mu)), 20.122px);
    height: clamp(10px, calc(19.713 * var(--mu)), 19.713px);
  }

  .sidebar h2 {
    width: min(calc(634 * var(--mu)), 100%);
    margin-top: calc(6 * var(--mu));
    font-weight: 500;
  }

  .sidebar h2 strong { font-weight: 500; }

  .services {
    position: static;
    width: min(calc(1000 * var(--mu)), calc(100vw - 80 * var(--mu)));
    margin-top: calc(-17 * var(--mu));
    gap: clamp(7px, calc(15 * var(--mu)), 15px);
  }

  .services li {
    height: clamp(32px, calc(67 * var(--mu)), 67px);
    padding: 0 clamp(10px, calc(20 * var(--mu)), 20px);
    border-radius: clamp(5px, calc(12 * var(--mu)), 12px);
    font-size: clamp(12px, calc(30 * var(--mu)), 30px);
  }

  .view-switcher { display: none; }

  .work {
    display: block;
    width: min(100%, 1080px);
    margin: 0 auto;
    padding: 0 calc(40 * var(--mu)) calc(40 * var(--mu));
  }

  .visual-stack,
  .project { position: static; }

  .visual-stack {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: calc(13.228 * var(--mu));
  }

  .visual {
    --u: var(--mobile-frame-unit);
    width: 100%;
    height: calc(378 * var(--u));
  }

  .project { display: none; }

  .pricing-view {
    display: none;
    width: min(100%, 1080px);
    margin: var(--mobile-header-height) auto 0;
    padding: calc(40 * var(--mu)) calc(40 * var(--mu)) calc(72 * var(--mu));
  }

  body[data-view="pricing"] .work { display: none; }
  body[data-view="pricing"] .pricing-view { display: flex; flex-direction: column; gap: 12px; }
  .pricing-grid, .build-card { position: static; width: 100%; }
  .pricing-grid { flex-direction: column; overflow: visible; }
  .price-card { width: 100%; flex-basis: 471px; height: 471px; }
  .build-card { height: 360px; }
  .build-list--one { left: 15px; top: 175px; }
  .build-list--two { left: 185px; top: 175px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .view, .frame, .actions a, .price-cta, .view-switcher button, .switch-label, .services li, .project-tags li, .mobile-sticky-talk { transition: none; }
}