@font-face {
  font-family: Anton;
  src: url('/assets/studio/fonts/Anton.ttf') format('truetype');
  font-display: swap;
}
:root {
  --paper: #090a08;
  --ink: #f3f4e7;
  --accent: #effa34;
  --signal-yellow: #ddea10;
  --muted: #b6b8aa;
  --line: #37392c;
  --surface: #15170f;
  --gutter: clamp(16px,4vw,64px);
  --ease: cubic-bezier(.22,1,.36,1);
  --display: Anton, Impact, sans-serif;
  color-scheme: dark;
  font-family: Geist, system-ui, sans-serif;
  color: var(--ink);
  background: var(--paper);
}
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; }
h1,h2,h3,p,figure,ol,dl,dd { margin: 0; }
p,dd { text-wrap: pretty; }
em { color: var(--accent); font-style: normal; }
img,video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
a:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }
a:active { opacity: .8; }
.shell,.case-wrap { width: min(100% - 2 * var(--gutter), 1440px); margin-inline: auto; }
.heading-1,.heading-2,.heading-3 { font-family: var(--display); text-transform: uppercase; font-weight: 400; line-height: 1; letter-spacing: -.025em; }
.heading-1 { font-size: clamp(48px,6.15vw,112px); }
.heading-2 { font-size: clamp(44px,6.15vw,100px); }
.heading-3 { font-size: clamp(40px,5vw,76px); }
.title-1 { font-size: clamp(16px,1.55vw,22px); line-height: 1.2; font-weight: 650; }
.body-3,dd { font-size: 1rem; line-height: 1.5; font-weight: 400; }
.caption-3,.caption-5 { font-size: .75rem; line-height: 1.3; font-weight: 600; }
.caption-5 { font-weight: 450; }
.button-md { font-size: 1rem; line-height: 1.5rem; font-weight: 700; }
.skip-link { position: fixed; left: 16px; top: 16px; z-index: 30; padding: 12px; color: var(--paper); background: var(--signal-yellow); transform: translateY(-160%); }
.skip-link:focus { transform: none; }

.mast { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.mast { padding-block: 20px; position: relative; z-index: 2; border-bottom: 1px solid var(--line); }
.logo,.case-logo img { width: 118px; }
.mast nav { display: flex; align-items: center; gap: clamp(16px,4vw,64px); }
.mast nav a:last-child,.eyebrow,.case-back { color: var(--accent); }
.mast nav a:hover,.footer a:hover,.hero-next:hover,.case-back:hover { text-decoration: underline; text-underline-offset: 4px; }
.signal { display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: currentColor; }
.eyebrow { letter-spacing: .13em; text-transform: uppercase; }

.hero { position: relative; isolation: isolate; min-height: clamp(590px, 78svh, 830px); display: grid; grid-template-columns: 1fr minmax(152px, .24fr); align-items: end; padding-block: 132px 128px; }
.hero-word { position: absolute; z-index: -2; inset: 2.4vw auto auto 50%; width: max-content; transform: translateX(-50%) scaleY(1.22); transform-origin: top; color: var(--signal-yellow); font: 400 min(18.5vw,320px)/1 var(--display); letter-spacing: -.035em; white-space: nowrap; }
.hero-word span { display: inline-block; }
.hero-art { position: absolute; z-index: -1; bottom: 34px; left: 52%; transform: translateX(-50%); height: min(88%,680px); aspect-ratio: 1; margin: 0; pointer-events: none; }
.hero-art img { width: 100%; height: 100%; object-fit: contain; }
.hero-art figcaption { position: absolute; left: 0; right: 0; bottom: 12px; text-align: center; color: var(--muted); }
.flower-word:not(.hero-word) { position: relative; display: inline-block; white-space: nowrap; }
.flower-word .flower-baseline { display: inline-block; width: 0; height: 0; letter-spacing: 0; vertical-align: baseline; }
.flower-word .flower-word-mask {
  position: absolute; inset: 0; display: block; opacity: 0; pointer-events: none;
  transition: opacity .22s ease;
}
@media (any-hover:hover) and (any-pointer:fine) {
  .flower-word.is-flower-hovered:hover .flower-word-mask { opacity: 1; }
  .hero-copy { pointer-events: none; }
  .hero-copy > * { pointer-events: auto; }
  .hero-copy h1 { width: fit-content; }
}
.flower-word-mask canvas { display: block; width: 100%; height: 100%; }
.hero-word .flower-word-mask { inset: -.07em -.045em; }
.hero-word .flower-word-mask canvas { filter: drop-shadow(0 .018em .025em #090a0890); }
.build-live .flower-word-mask { clip-path: inset(0 var(--flower-hide,0%) 0 0); }
.hero-copy { width: min(100%,560px); z-index: 1; align-self: end; }
.hero h1 > span { display: block; width: fit-content; }
.hero h1 { margin-bottom: 24px; paint-order: stroke fill; -webkit-text-stroke: 3px var(--paper); }
.hero .intro { max-width: 24ch; font-size: clamp(16px,2vw,27px); line-height: 1.25; }
.primary { display: inline-flex; align-items: center; gap: 32px; padding: 12px 20px; margin-top: 24px; background: var(--signal-yellow); color: var(--paper); transition: background .3s var(--ease), transform .5s var(--ease); }
.primary:hover { background: #f4ff54; transform: translateY(-2px); }
.hero-terms { align-self: end; display: grid; gap: 12px; padding-bottom: 8px; }
.hero-terms div { display: grid; grid-template-columns: clamp(70px,7.3vw,114px) 1fr; align-items: end; gap: 8px; border-bottom: 1px solid var(--line); padding-bottom: 8px; }
.hero-terms dt { color: var(--accent); font: 400 clamp(20px,2.45vw,38px)/1 var(--display); text-transform: uppercase; white-space: nowrap; }
.hero-terms dd { font-size: .75rem; padding-bottom: 3px; color: var(--muted); }
.hero-foot { position: absolute; inset: auto 0 24px; display: flex; justify-content: space-between; align-items: center; gap: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.hero-next span { color: var(--accent); margin-right: 6px; }
.intro { max-width: 42ch; }

.assembly { position: relative; border-top: 1px solid var(--signal-yellow); }
.bench { padding-block: 48px; }
.work-ready { position: absolute; }
.work-head { display: flex; justify-content: space-between; align-items: end; gap: 12px; margin-bottom: 20px; }
.work-head h2 { margin-top: 10px; }
.editor { position: relative; }
.editor-bar,.editor-footer { display: none; }
.is-live .editor-bar,.is-live .editor-footer { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 8px 0; min-height: 32px; }
.editor-bar { border-bottom: 1px solid var(--line); }
.editor-footer { border-top: 1px solid var(--line); color: var(--muted); }
.editor-file,.file-extra { color: var(--muted); }
.editor-file .signal { color: var(--accent); }
.editor-status { color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
#editor-step { text-align: right; color: var(--accent); }
.board { position: relative; }
.is-live .board { padding-top: 42px; }
.sources { display: none; }
.is-live .sources { position: absolute; top: 6px; left: 0; right: 0; display: flex; align-items: center; gap: 12px; }
.source-label { color: var(--muted); }
.source { display: flex; align-items: center; gap: 5px; }
.source img { width: 32px; aspect-ratio: 1.5; object-fit: cover; }
.work-grid { min-width: 0; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.work-slot { display: grid; min-width: 0; min-height: 0; position: relative; }
.project-card,.build-copy { display: grid; grid-template-rows: minmax(0,1fr) auto; position: relative; overflow: hidden; background: var(--surface); border: 1px solid var(--line); }
.project-card { transition: border-color .3s var(--ease); }
.project-card:hover { border-color: var(--accent); }
.project-card[inert] { opacity: 0; }
.project-media { position: relative; overflow: hidden; background: #181818; min-height: clamp(120px,20vw,360px); }
.project-media img { position: absolute; width: 100%; height: 100%; object-fit: cover; }
.showcase-play-image { object-position: center top; }
.work-product-links { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; margin-top: 8px; }
.work-product-links > span { color: var(--muted); }
.work-product-link { display: inline-flex; align-items: center; gap: 4px; min-height: 32px; }
.work-product-link span,.work-product-link:hover { color: var(--accent); }
.project-meta { display: flex; justify-content: space-between; align-items: center; gap: 4px; padding: 12px; }
.project-meta span span { display: block; }
.project-type { color: var(--muted); }
.project-title { margin-top: 4px; }
.project-arrow { color: var(--accent); font-size: 20px; }
.editor-meter { display: none; height: 2px; background: var(--accent); transform: scaleX(var(--progress,1)); transform-origin: left; }
.is-live .editor-meter { display: block; }
.editor.is-complete :is(.sources,.editor-meter) { visibility: hidden; }
.assembly-overlay { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 2; }
.assembly-overlay[hidden] { display: none; }
.work-drawing { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; z-index: 1; }
.work-drawing path { fill: none; stroke: #e3f58c; stroke-width: 1.5; stroke-dasharray: 1; opacity: 0; }
.build-copy,.incoming,.guide,.cursor { position: absolute; inset: 0 auto auto 0; }
.build-copy { border-color: var(--cursor-colour, var(--accent)); transform-origin: top left; }
.build-copy .project-meta { overflow: hidden; }
.build-copy .project-media { min-height: 0; }
.build-copy.is-working .project-media { outline: 1px solid #71dbf9; outline-offset: -1px; }
.build-copy .project-title,.build-copy .project-type { white-space: nowrap; }
.incoming { overflow: hidden; border: 1px solid #fdd171; background: var(--surface); transform-origin: top left; z-index: 1; }
.incoming img { width: 100%; height: 100%; object-fit: cover; }
.guide { height: 2px; width: 1px; background: #71dbf9; box-shadow: 0 0 6px #71dbf9; transform-origin: left; opacity: 0; z-index: 2; }
.cursor { z-index: 3; display: flex; align-items: start; gap: 1px; color: #71dbf9; transform-origin: top left; white-space: nowrap; }
.cursor svg { display: block; width: 15px; height: 19px; flex: none; overflow: visible; filter: drop-shadow(0 1px 2px #000a); }
.cursor span { display: none; color: #08080a; background: var(--cursor-colour,currentColor); padding: 2px 4px; margin-top: 8px; font-size: 11px; line-height: 1.2; font-weight: 700; }
.cursor.is-lead { z-index: 4; }
.cursor.is-lead span { display: inline; }
.cursor.is-lead svg { width: 18px; height: 22px; }
.cursor.is-near-edge span { position: absolute; right: 100%; }
.cursor.is-working svg { filter: drop-shadow(0 0 3px currentColor); }

.credentials,.founder { padding-block: 48px; border-top: 1px solid var(--line); }
.credentials .eyebrow { margin-bottom: 16px; }
.credential-marks { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: clamp(10px,2vw,24px); padding: 0; list-style: none; }
.credential-mark { display: grid; place-items: center; min-width: 0; height: 84px; padding: 12px; }
.credential-mark img { width: auto; max-height: 54px; object-fit: contain; filter: url("./credential-ink.svg#white-mark"); }
.credential-mark .credential-axa { filter: url("./credential-ink.svg#white-axa"); }
.credential-mark .credential-crest { filter: url("./credential-ink.svg#white-crest"); }
.founder h2 { margin-top: 12px; font-size: clamp(36px,4.5vw,64px); }
.founder {
  display: grid;
  grid-template-columns: minmax(0,345px) minmax(0,1fr);
  grid-template-areas: "photo heading" "photo intro" "photo quote";
  grid-template-rows: auto auto 1fr;
  column-gap: clamp(24px,5vw,72px);
  row-gap: 16px;
  align-items: start;
}
.founder-heading { grid-area: heading; }
.founder-art { grid-area: photo; width: min(100%, 345px); }
.founder-photo-frame { position: relative; aspect-ratio: 4 / 4.7; overflow: hidden; border-radius: 18px 18px 0 0; }
.founder-photo-frame video { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.founder-sound { position: absolute; inset: auto 12px 12px auto; min-height: 34px; padding: 6px 10px; border: 1px solid #f3f4e75c; border-radius: 3px; background: #090a08cf; color: var(--ink); cursor: pointer; }
.founder-sound:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.founder-art figcaption { display: flex; justify-content: space-between; gap: 8px; padding-top: 8px; color: var(--muted); }
.founder-art figcaption span:first-child { color: var(--ink); }
.founder-intro { grid-area: intro; max-width: 48ch; }
.founder-intro p + p { margin-top: 8px; color: var(--muted); }
.founder-quote { grid-area: quote; margin: 0; padding-left: 12px; border-left: 2px solid var(--accent); color: var(--accent); font-weight: 600; }
.capabilities { display: grid; grid-template-columns: .76fr 1fr; gap: 48px; padding-block: 56px 72px; border-top: 1px solid var(--line); }
.capabilities h2,.client-proof h2 { margin: 16px 0 20px; font-size: clamp(40px,5vw,72px); }
.capabilities .intro,.client-proof .intro { max-width: 42ch; color: var(--muted); }
.capability-row { display: grid; grid-template-columns: 24px minmax(0,1fr) 24px; gap: 20px; padding: 22px 0; border-bottom: 1px solid var(--line); align-items: start; }
.capability-row:first-child { border-top: 1px solid var(--line); }
.capability-row > span { color: var(--accent); }
.capability-row p { margin-top: 8px; color: var(--muted); font-size: .875rem; }
.capability-row:hover h3 { color: var(--accent); }
.process { padding-block: 56px 72px; border-top: 1px solid var(--line); }
.process h2 { margin: 16px 0 20px; font-size: clamp(40px,5vw,72px); }
.process > header { display: grid; grid-template-columns: 1fr 1fr; column-gap: 48px; align-items: end; }
.process > header > .eyebrow { grid-column: 1 / -1; }
.process > header > .intro { max-width: 48ch; margin-bottom: 24px; color: var(--muted); }
.process .workflow-board { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); padding: 0; list-style: none; margin-top: 20px; border: 1px solid var(--line); }
.process .workflow-stage { display: flex; flex-direction: column; min-width: 0; padding: 20px; gap: 18px; border-right: 1px solid var(--line); }
.process .workflow-stage:last-child { border-right: 0; }
.workflow-label { color: var(--accent); font-size: 10px; }
.workflow-copy { min-height: 142px; }
.workflow-stage h3 { font-size: clamp(22px,2.2vw,32px); }
.workflow-stage p { font-size: .875rem; line-height: 1.5; }
.workflow-artifact { min-height: 176px; display: grid; align-content: center; gap: 12px; padding: 18px; border: 1px solid var(--line); background: var(--surface); margin-top: auto; }
.artifact-heading { color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.artifact-note { display: flex; align-items: center; gap: 9px; font-size: 12px; }
.artifact-note i { width: 9px; height: 9px; border: 1px solid var(--accent); }
.artifact-note b { color: var(--accent); margin-left: auto; }
.artifact-flow { gap: 4px; justify-items: center; }
.artifact-node { display: block; padding: 6px 20px; border: 1px solid var(--line); width: 100%; text-align: center; font-size: 11px; }
.artifact-arrow { color: var(--accent); line-height: 1; }
.artifact-interface { align-content: stretch; gap: 13px; }
.artifact-window { display: flex; gap: 4px; }
.artifact-window i { width: 4px; height: 4px; background: var(--muted); border-radius: 50%; }
.artifact-headline { font-size: 16px; line-height: 1.2; font-weight: 600; max-width: 13ch; }
.artifact-lines { height: 13px; background: repeating-linear-gradient(to bottom,var(--line) 0 2px,transparent 2px 7px); }
.artifact-action { padding: 7px 9px; background: var(--accent); color: var(--paper); font-size: 11px; font-weight: 600; justify-self: start; }
.client-proof { padding-block: 56px 72px; border-top: 1px solid var(--line); }
.client-proof > header { margin-bottom: 36px; }
.client-quotes { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 48px; }
.client-quote { display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.quote-mark { color: var(--accent); font-family: var(--display); font-size: 76px; line-height: 1; height: 66px; padding-top: 16px; }
.client-quote blockquote { margin: 0; font-size: clamp(16px,1.5vw,22px); line-height: 1.55; max-width: 50ch; }
.client-quote footer { display: grid; gap: 4px; padding-top: 24px; margin-top: auto; }
.client-quote footer span { color: var(--muted); }
.process li p,dd { margin-top: 4px; color: var(--muted); max-width: 56ch; }
.faq { display: grid; grid-template-columns: .43fr 1fr; gap: 48px; padding-block: 56px 72px; border-top: 1px solid var(--line); }
.faq dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px 24px; }
.faq dl > div { border-bottom: 1px solid var(--line); padding-bottom: 12px; }
.faq dt { font-size: 1rem; }
.faq dd { font-size: .875rem; }
.contact-anchor { display: block; height: 0; }
.closing { min-height: clamp(300px,28vw,460px); display: grid; align-content: center; justify-items: start; padding-block: 64px 84px; border-top: 1px solid var(--line); }
.closing h2 { margin-top: 12px; }
.closing > .primary { margin-top: 48px; }
.footer { border-top: 1px solid var(--line); }
.footer-meta { position: relative; z-index: 4; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; padding-block: 24px; }
.footer-location { margin-right: auto; color: var(--muted); }
.footer-links { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.garden-finale { --sun-x: 25%; --sun-y: 8%; position: relative; isolation: isolate; overflow: hidden; display: grid; align-items: end; min-height: clamp(540px,59vw,900px); background: #252817; }
.garden-finale-art,.garden-sunlight,.garden-motes,.garden-finale::after { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.garden-finale-art { object-fit: cover; object-position: center 53%; }
.garden-sunlight { z-index: 1; mix-blend-mode: screen; }
.garden-sunbeam {
  position: absolute; inset: 0;
  background: conic-gradient(from 103deg at var(--sun-x) var(--sun-y),transparent 0deg,#ffdc985f 9deg,#ffe1aa85 14deg,#ffcc763f 19deg,transparent 26deg);
  mask-image: radial-gradient(ellipse at var(--sun-x) var(--sun-y),#000 6%,#000c 29%,transparent 69%);
  transform-origin: var(--sun-x) var(--sun-y);
  opacity: .55;
  animation: garden-sun-sweep 4.4s cubic-bezier(.45,0,.55,1) -1.8s infinite alternate paused;
}
.garden-sunbeam-soft {
  background: conic-gradient(from 128deg at var(--sun-x) var(--sun-y),transparent 0deg,#ffcb6844 11deg,#ffdc9573 17deg,#ffce7d38 24deg,transparent 35deg);
  animation: garden-sun-sweep-soft 5.6s cubic-bezier(.45,0,.55,1) -3.5s infinite alternate paused;
}
.garden-motes { z-index: 2; }
.garden-mote {
  position: absolute; top: var(--y); left: var(--x); width: var(--size); aspect-ratio: 1;
  border-radius: 50%; background: #ffe9ac; box-shadow: 0 0 5px 1px #ffc768aa;
  --sway: calc(var(--drift) * clamp(24px, 5vw, 68px));
  --lift: clamp(22px, 5vh, 44px);
  animation: garden-mote-drift linear infinite paused;
}
.garden-mote-near {
  background: radial-gradient(circle,#fff6d9 15%,#ffd38b 46%,transparent 74%);
  box-shadow: 0 0 8px 2px #ffb85577;
  --lift: clamp(32px, 7vh, 63px);
}
.garden-finale[data-garden-active] :is(.garden-sunbeam,.garden-mote) { animation-play-state: running; }
@keyframes garden-mote-drift {
  0%,100% { opacity: 0; }
  21% { opacity: .72; }
  44% { transform: translate3d(calc(var(--sway) * .30),calc(var(--lift) * -.54),0); opacity: .93; }
  70% { transform: translate3d(calc(var(--sway) * .70),calc(var(--lift) * -.70),0); opacity: .48; }
  100% { transform: translate3d(var(--sway),calc(var(--lift) * -1),0); }
}
.garden-finale::after { content: ""; z-index: 3; background: linear-gradient(0deg,#090a08fa 0%,#090a08c9 15%,transparent 42%); }
.garden-foliage { position: absolute; z-index: 2; max-width: none; height: auto; pointer-events: none; transform-origin: 50% 96%; animation: garden-breeze 8.5s var(--ease) infinite alternate; }
.garden-bank { left: -7%; bottom: 10%; width: clamp(210px,26vw,380px); filter: blur(.8px); }
.garden-foreground { right: -6%; bottom: -8%; width: clamp(255px,35vw,540px); filter: blur(1.3px); animation-duration: 10.5s; animation-direction: alternate-reverse; }
.garden-plant { position: absolute; z-index: 2; max-width: none; height: auto; pointer-events: none; transform-origin: 50% 91%; animation: garden-stem 4.8s cubic-bezier(.42,0,.58,1) infinite alternate; }
.garden-daisy { left: 24%; bottom: 18%; width: clamp(125px,14vw,225px); }
.garden-lavender { right: 8%; bottom: 22%; width: clamp(105px,13vw,190px); animation-duration: 5.9s; animation-delay: -3.6s; }
.garden-butterfly {
  position: absolute; z-index: 2; top: 39%; left: -7%; width: clamp(47px,5vw,72px);
  aspect-ratio: 512/341; perspective: 110px; pointer-events: none;
  filter: drop-shadow(0 2px 3px #251b1280); animation: garden-flight 14s cubic-bezier(.40,.23,.55,.78) -4.4s infinite;
}
.garden-butterfly[data-butterfly="2"] { top: 54%; width: clamp(39px,4.2vw,59px); animation-duration: 18s; animation-delay: -10s; animation-direction: reverse; }
.garden-butterfly[data-butterfly="3"] { top: 34%; width: clamp(34px,3.8vw,52px); animation-duration: 20s; animation-delay: -14s; }
.garden-finale[data-butterflies-live] .garden-butterfly { left: 0; top: 0; animation: none; }
.garden-butterfly::before,.garden-butterfly::after {
  content: ""; position: absolute; inset: 0; transform-origin: 50% 50%;
  background: url("/assets/studio/garden/butterfly.png") center/contain no-repeat;
  animation: garden-wing .28s cubic-bezier(.38,.05,.54,.95) infinite alternate;
}
.garden-butterfly::before { --fold: 57deg; clip-path: inset(0 50% 0 0); }
.garden-butterfly::after { --fold: -57deg; clip-path: inset(0 0 0 50%); }
.garden-butterfly[data-butterfly="2"]::before,.garden-butterfly[data-butterfly="2"]::after { animation-duration: .34s; animation-delay: -.12s; }
.garden-butterfly[data-butterfly="3"]::before,.garden-butterfly[data-butterfly="3"]::after { animation-duration: .25s; animation-delay: -.18s; }
.footer-brand { flex: none; width: 118px; }
.footer-brand img { width: 100%; filter: brightness(0) invert(1) drop-shadow(0 2px 6px #1418119c); }
@keyframes garden-breeze {
  from { transform: skewX(-3deg) rotate(-.6deg); }
  to { transform: skewX(3deg) rotate(.6deg); }
}
@keyframes garden-stem {
  from { transform: rotate(-7deg) skewX(-2.5deg); }
  to { transform: rotate(8deg) skewX(2.5deg); }
}
@keyframes garden-sun-sweep {
  from { opacity: .23; transform: rotate(-11deg) scale(1); }
  to { opacity: .90; transform: rotate(14deg) scale(1.13,1.07); }
}
@keyframes garden-sun-sweep-soft {
  from { opacity: .84; transform: rotate(8deg) scale(1.02,1.09); }
  to { opacity: .24; transform: rotate(-16deg) scale(1.12,1.04); }
}
@keyframes garden-flight {
  0% { opacity: 0; transform: translate3d(-3vw,6svh,0) rotate(64deg) scale(.68); }
  12% { opacity: 1; transform: translate3d(16vw,-2svh,0) rotate(66deg) scale(.84); }
  27% { transform: translate3d(33vw,-8svh,0) rotate(75deg) scale(.98); }
  43% { transform: translate3d(47vw,-2svh,0) rotate(104deg) scale(.93); }
  58% { transform: translate3d(59vw,-10svh,0) rotate(56deg) scale(1); }
  74% { transform: translate3d(77vw,-7svh,0) rotate(101deg) scale(.9); }
  88% { opacity: 1; transform: translate3d(94vw,-14svh,0) rotate(63deg) scale(.77); }
  100% { opacity: 0; transform: translate3d(116vw,-18svh,0) rotate(72deg) scale(.66); }
}
@keyframes garden-wing {
  from { transform: rotateY(2deg); }
  to { transform: rotateY(var(--fold)); }
}
.case-header { position: sticky; top: 0; z-index: 1; background: var(--paper); border-bottom: 1px solid var(--line); }
.case-header .case-wrap,.case-footer .case-wrap { display: flex; justify-content: space-between; gap: 16px; align-items: center; padding-block: 20px; }
.case-intro { padding-block: 48px; }
.case-intro h1 { margin-block: 16px; }
.case-index { display: flex; flex-wrap: wrap; gap: 16px; }
.case-index a:hover { color: var(--accent); }
.case-item { display: grid; grid-template-columns: .6fr 1fr; gap: 32px; padding-block: 48px; border-top: 1px solid var(--line); scroll-margin-top: 96px; }
.case-copy h2 { margin-block: 12px; font-size: clamp(40px,5vw,72px); }
.case-copy p + p { margin-top: 12px; }
.case-media img,.case-media video { width: 100%; background: #181818; }
.case-media figcaption { color: var(--muted); margin-top: 8px; }
.case-game-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px 16px; }
.case-game-grid figure:first-child { grid-column: 1/-1; }
.case-game-grid figure:not(:first-child) img { aspect-ratio: 16/10; object-fit: cover; }
.case-game-grid figcaption { display: grid; justify-items: start; gap: 4px; }
.case-game-grid figcaption strong { color: var(--ink); }
.case-local-label { margin-top: 4px; }
.case-action { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.case-action:hover { color: var(--ink); }
.case-actions { display: grid; justify-items: start; gap: 8px; margin-top: 16px; }
.case-action-secondary { color: var(--muted); }

@media(max-width:850px) {
  .hero { min-height: 630px; padding-block: 164px 135px; grid-template-columns: 1fr 136px; }
  .hero-art { height: min(82%,520px); left: 56%; }
  .hero-terms div { grid-template-columns: 52px 1fr; }
  .hero-terms { padding-bottom: 0; }
  .process,.faq { gap: 24px; }
}
@media(max-width:620px) {
  .mast { padding-block: 14px; }
  .mast .logo { width: 82px; }
  .mast nav { gap: 12px; }
  .studio-nav-link { display: none; }
  .hero { min-height: 620px; grid-template-columns: 1fr; padding-block: 268px 64px; }
  .hero-word { top: 18px; font-size: 19vw; }
  .hero-art { left: 54%; top: 22px; bottom: auto; height: min(84vw,355px); }
  .hero-art figcaption { bottom: 6px; }
  .hero h1 { font-size: clamp(45px,13vw,72px); margin-bottom: 12px; }
  .hero .intro { font-size: 16px; }
  .hero-terms { display: flex; margin-top: 20px; align-items: start; gap: 12px; }
  .hero-terms div { display: flex; gap: 6px; align-items: end; border: 0; padding-bottom: 0; }
  .hero-terms dt { font-size: 20px; }
  .hero-terms dd { font-size: 10px; padding-bottom: 0; }
  .hero-foot { inset: auto 0 12px; font-size: 10px; }
  .hero-foot > span { display: none; }
  .primary { padding: 8px 12px; margin-top: 16px; }
  .bench { padding-block: 20px; }
  .work-head { margin-bottom: 12px; }
  .work-head h2 { margin-top: 6px; font-size: 44px; }
  .file-extra,.source span { display: none; }
  .work-grid { gap: 8px; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .work-product-links { column-gap: 12px; }
  .work-slot:first-child { grid-column: span 2; }
  .work-slot:first-child .project-media { min-height: clamp(72px,18svh,160px); }
  .work-slot:not(:first-child) .project-media { min-height: clamp(52px,9svh,95px); }
  .build-copy .project-media { min-height: 0; }
  .project-meta { padding: 8px; }
  .project-title { margin-top: 2px; }
  .cursor svg { width: 12px; height: 16px; }
  .cursor.is-lead svg { width: 15px; height: 19px; }
  .capabilities,.process > header,.faq,.case-item,.case-game-grid { grid-template-columns: 1fr; }
  .capabilities { gap: 24px; }
  .capability-row { gap: 12px; }
  .process .workflow-board { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .process .workflow-stage { padding: 14px; border-bottom: 1px solid var(--line); }
  .process .workflow-stage:nth-child(2n) { border-right: 0; }
  .process .workflow-stage:nth-last-child(-n+2) { border-bottom: 0; }
  .workflow-copy { min-height: 162px; }
  .workflow-artifact { padding: 10px; min-height: 164px; }
  .workflow-label { font-size: 9px; }
  .artifact-note { font-size: 10px; gap: 6px; }
  .artifact-headline { font-size: 15px; }
  .client-quotes { grid-template-columns: 1fr; gap: 32px; }
  .faq dl { gap: 16px; }
  .credentials,.capabilities,.founder,.process,.client-proof,.faq,.closing { padding-block: 40px; }
  .credential-marks { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .credential-mark { height: 64px; padding: 8px; }
  .credential-mark img { max-height: 42px; }
  .footer-meta { gap: 10px 14px; padding-block: 18px; }
  .footer-links { flex-basis: 100%; }
  .garden-finale::after { background: linear-gradient(0deg,#090a08fa 0%,#090a08d9 22%,transparent 55%); }
  .garden-finale { --sun-x: 7%; --sun-y: 9%; min-height: clamp(520px,77svh,690px); }
  .garden-finale-art { object-position: 56% center; }
  .garden-bank { left: -18%; bottom: 10%; width: 55%; }
  .garden-foreground { right: -16%; bottom: 4%; width: 71%; }
  .garden-daisy { left: 2%; bottom: 23%; width: 124px; }
  .garden-lavender { right: -5%; bottom: 22%; width: 130px; }
  .footer-brand { width: 95px; }
  .founder { grid-template-columns: 1fr; grid-template-areas: "heading" "photo" "intro" "quote"; grid-template-rows: auto; }
}
@media(max-width:365px) {
  .mast nav { gap: 8px; }
  .work-head h2 { font-size: 36px; }
  .file-extra { display: none; }
  .editor-bar { font-size: 10px; }
}
@media(max-height:530px) and (min-width:621px) {
  .bench { padding-block: 10px; }
  .work-head { margin-bottom: 8px; }
  .work-head h2 { font-size: 36px; }
  .project-media { min-height: 105px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { transition: none !important; }
  .garden-foliage,.garden-plant,.garden-sunbeam,.garden-butterfly,.garden-butterfly::before,.garden-butterfly::after { animation: none; }
  .garden-motes { display: none; }
  .garden-butterfly[data-butterfly="1"] { left: 63%; top: 34%; transform: rotate(23deg) scale(.78); }
  .garden-butterfly[data-butterfly="2"] { left: 29%; top: 42%; transform: rotate(-38deg) scale(.72); }
  .garden-butterfly[data-butterfly="3"] { left: 79%; top: 27%; transform: rotate(-14deg) scale(.66); }
}
.hero-word { font-size: min(19vw, 340px); transform: translateX(-50%) scale(1.24,1.22); }
.hero h1 { font-size: clamp(48px,7vw,112px); }
.build-live [data-build-target] { translate: var(--place-x,0) var(--place-y,0); opacity: var(--place-alpha,1); }
.build-live [data-build-target]:focus-visible { translate: none; opacity: 1; }
.build-live .build-word { opacity: var(--word-alpha,1); }
.hero h1 .build-word { display: inline; }
.page-build-layer { position: fixed; inset: 0; z-index: 8; overflow: hidden; pointer-events: none; }
.page-build-layer[hidden], .build-selection[hidden], .page-build-layer .cursor[hidden] { display: none; }
[data-team="0"] { --cursor-colour: #70e5ff; }
[data-team="1"] { --cursor-colour: #ffc47e; }
[data-team="2"] { --cursor-colour: #cca6ff; }
[data-team="3"] { --cursor-colour: #b5f07b; }
.cursor { color: var(--cursor-colour); }
.cursor[data-phase="working"][data-tool="cross"] > .agent-pointer,
.cursor[data-phase="working"][data-tool="type"] > .agent-pointer,
.cursor[data-phase="working"][data-tool="align"] > .agent-pointer { opacity: 0; }
.cursor[data-phase="working"][data-tool="cross"]::before {
  content: ""; position: absolute; left: -8px; top: -8px; width: 17px; height: 17px;
  background: linear-gradient(currentColor,currentColor) center / 1px 100% no-repeat,
    linear-gradient(currentColor,currentColor) center / 100% 1px no-repeat;
}
.cursor[data-phase="working"][data-tool="cross"][data-size]::after {
  content: attr(data-size); position: absolute; left: 12px; top: -19px;
  padding: 3px 5px; border: 1px solid currentColor; background: var(--paper); font-size: 10px; line-height: 1;
}
.cursor.is-near-edge[data-phase="working"][data-tool="cross"][data-size]::after { left: auto; right: 12px; }
.cursor[data-phase="working"][data-tool="type"]::before {
  content: ""; position: absolute; left: -1px; top: -7px; width: 1px; height: 16px; background: currentColor;
}
.cursor[data-phase="working"][data-tool="type"]::after {
  content: ""; position: absolute; left: -4px; top: -7px; width: 7px; height: 16px;
  border-block: 1px solid currentColor;
}
.cursor[data-phase="working"][data-tool="align"]::before {
  content: "↔"; position: absolute; left: -10px; top: -13px; font-size: 23px; line-height: 1;
}
.cursor[data-phase="working"][data-tool="duplicate"]::before,
.cursor[data-phase="working"][data-tool="duplicate"]::after {
  content: ""; position: absolute; width: 7px; height: 7px; border: 1px solid currentColor; background: var(--paper);
}
.cursor[data-phase="working"][data-tool="duplicate"]::before { left: 11px; top: -5px; }
.cursor[data-phase="working"][data-tool="duplicate"]::after { left: 14px; top: -2px; }
.cursor:not(.is-lead) span { display: inline; font-size: 8px; padding: 1px 2px; opacity: .85; }
.cursor.is-support span { padding: 1px 3px; opacity: .65; }
.page-build-layer .cursor.is-forming span { display: none; }
.build-support-frame { position: absolute; left: 0; top: 0; overflow: visible; pointer-events: none; }
.build-support-frame[hidden] { display: none; }
.build-support-frame path { fill: none; stroke: var(--cursor-colour); stroke-width: 1; vector-effect: non-scaling-stroke; }
.build-support-frame .layout-ghost { opacity: .13; }
.build-support-frame .layout-trace { opacity: .54; stroke-dasharray: 1; }
.build-selection { position: absolute; inset: 0 auto auto 0; border: 1px solid var(--cursor-colour); }
.build-selection::before,.build-selection::after { position: absolute; content: ""; width: 5px; height: 5px; background: var(--cursor-colour); }
.build-selection::before { top: -3px; left: -3px; }
.build-selection::after { bottom: -3px; right: -3px; }
.build-readout { position: absolute; right: max(var(--gutter),12px); bottom: 12px; display: flex; align-items: center; gap: 12px; padding: 7px 9px; color: var(--ink); background: #090a08ee; border: 1px solid var(--line); white-space: nowrap; font-variant-numeric: tabular-nums; }
.crew-key { display: flex; gap: 8px; }
.crew-key i { color: var(--cursor-colour); font-style: normal; }
@media(max-width:620px) {
  .hero-word { font-size: 17.5vw; transform: translateX(-50%) scale(1.33,1.22); }
  .hero h1 { font-size: clamp(45px,13vw,72px); }
  .build-readout { font-size: 10px; padding: 5px 6px; bottom: 6px; }
  .cursor:not(.is-lead) span { display: none; }
  .page-build-layer .cursor.is-lead span { font-size: 10px; }
}
.founder h2,.process h2,.closing h2 { width: fit-content; max-width: 100%; }
.page-build-layer.at-footer .build-readout { top: 12px; bottom: auto; }
.build-readout { bottom: 52px; }
.build-loader { display: none; }
.build-boot .build-loader { position: fixed; z-index: 50; inset: 0; display: grid; align-items: center; background: var(--paper); }
.build-loader .shell { position: relative; padding-block: 16px; }
.build-loader .logo { margin-bottom: clamp(36px,6vw,84px); }
.loader-title { font: 400 clamp(52px,9vw,142px)/.98 var(--display); text-transform: uppercase; }
.loader-progress { margin-top: 28px; color: var(--accent); font: 400 clamp(32px,6vw,82px)/1 var(--display); }
.loader-progress b { font-weight: 400; font-variant-numeric: tabular-nums; }
.loader-progress span { font-size: .44em; margin-left: 5px; }
.loader-meter { height: 2px; margin-top: 12px; background: var(--line); }
.loader-meter::before { content: ""; display: block; height: 100%; background: var(--accent); transform: scaleX(var(--loaded,0)); transform-origin: left; }
.build-controls { position: fixed; z-index: 10; bottom: 12px; right: max(var(--gutter),12px); display: flex; gap: 0; background: var(--paper); border: 1px solid var(--line); }
.build-controls[hidden],.build-controls button[hidden] { display: none; }
.agent-status { display: flex; align-items: center; gap: 7px; padding: 6px 9px; white-space: nowrap; border-right: 1px solid var(--line); }
.agent-status[hidden] { display: none; }
.agent-status b { color: var(--accent); font-variant-numeric: tabular-nums; min-width: 2ch; text-align: right; }
.build-controls button { border: 0; border-right: 1px solid var(--line); color: var(--ink); background: transparent; padding: 8px 10px; font: inherit; cursor: pointer; }
.build-controls button:last-child { border-right: 0; }
.build-controls button:hover { background: var(--surface); color: var(--accent); }
.build-controls button:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }
@media(max-width:620px) {
  .build-controls { bottom: 8px; right: 8px; font-size: 11px; }
  .build-controls button { padding: 7px 8px; }
  .agent-status { position: absolute; right: -1px; bottom: calc(100% + 5px); border: 1px solid var(--line); background: var(--paper); }
  .build-readout { bottom: 44px; }
}
.bloom-stage { position: relative; width: 100%; height: 100%; }
.bloom-stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.bloom-stage.has-bloom img { visibility: hidden; }
.build-live .build-char { opacity: 0; }
.build-live .build-char.is-inked { opacity: 1; }
.build-token { white-space: nowrap; }
.hero-word .build-char { display: inline; }
.build-caret { position: absolute; top: 0; left: 0; width: 2px; background: var(--cursor-colour); }
.build-caret[hidden] { display: none; }
.closing .primary.build-focus { outline: 2px solid var(--accent); outline-offset: 5px; }
@media(max-width:620px) { .hero-art figcaption { display: none; } }

.model-credit { flex-basis: 100%; color: var(--muted); font-size: 11px; }
.model-credit a { text-decoration: underline; text-underline-offset: 3px; }