/* homepage website · site.css · 3 Sep 2026. Phone values are the default; desktop takes over at 760px. */

@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/hanken-grotesk-latin.woff2?v=20260902') format('woff2');
}

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  background: #ffffff;
  color: #1a1a19;
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-wrap: pretty;
}
@media (max-width: 759.98px) {
  body { padding-bottom: calc(54px + env(safe-area-inset-bottom)); }
  .btn-full .btn { width: 100%; }
}
img, video { display: block; max-width: 100%; }
a { color: #177226; text-decoration: none; }
a:hover { color: #1a6b26; }
section { scroll-margin-top: 64px; }

/* Design-system components used on the site, lifted from Homepage Customer DS (Button primary lg, TextInput md, TextArea). Tokens inlined. */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;flex-shrink:0;cursor:pointer;margin:0;min-height:3rem;padding:0 1.25rem;border:1px solid transparent;border-radius:8px;background:#24b33e;color:#fff;text-align:center;text-decoration:none;font-family:inherit;font-weight:600;font-size:1rem;line-height:1.2;outline:none;transition:background-color 120ms cubic-bezier(.2,0,.38,.9),box-shadow 120ms cubic-bezier(.2,0,.38,.9),transform 120ms cubic-bezier(.2,0,.38,.9)}
.btn:hover{background:#1ea035;color:#fff}
.btn:active:not(:disabled){background:#198a2d;transform:scale(.97)}
.btn:focus-visible{box-shadow:0 0 0 3px rgba(36,179,62,.35)}
.btn:disabled{cursor:not-allowed;background:#f7f7f6;border-color:#e4e4e3;color:#6f6f6f;transform:none}
.field{display:flex;flex-direction:column;align-items:stretch;width:100%}
.field label{display:block;margin-bottom:.5rem;font-size:.875rem;line-height:1.3;color:#1a1a19;font-weight:500}
.field input,.field textarea{width:100%;border:1px solid #e2e2e0;border-radius:8px;background:#fff;color:#1a1a19;font-family:inherit;font-size:1rem;outline:none;transition:border-color 120ms cubic-bezier(.2,0,.38,.9),box-shadow 120ms cubic-bezier(.2,0,.38,.9)}
.field input{height:3rem;padding:0 .875rem}
.field textarea{min-height:5rem;line-height:1.5;padding:.6875rem .875rem;resize:vertical}
.field input:hover,.field textarea:hover{border-color:#d4d4d2}
.field input:focus,.field textarea:focus{border-color:#24b33e;box-shadow:0 0 0 3px rgba(36,179,62,.35)}
.field input::placeholder,.field textarea::placeholder{color:#a3a3a2}
.if{display:contents}
.if[hidden]{display:none}
*,*::before,*::after{box-sizing:border-box}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}

/* index.html */
.page-home {
  color-scheme: only light;
  --m: block; --m-flex: flex; --d: none; --d-flex: none;
  --pad-x: 20px; --wrap: 100%; --wrap-wide: 100%;
  --hdr-h: 56px; --mark: 24px; --word: 19px;
  --hero-pt: 44px; --h1: 32px; --h1-mb: 16px; --lead: 16.5px; --lead-mb: 27px;
  --chain-mt: 40px; --chain-py: 40px; --chain-fs: 27px; --chain-lh: 1.2;
  --sec-py: 40px; --cards-gap: 0px; --card-gap: 20px; --label-pad: 0; --card-r: 10px 10px 0 0; --card-mask: linear-gradient(180deg, #000 68%, rgba(0,0,0,0) 100%); --art-dir: row; --art-align: center; --row-line: 1px solid #e4e4e3; --art-pad: 20px 0; --frame-w: 124px; --chat-w: 340px; --chat-s: .3588; --art-bg: transparent; --art-border: 0; --art-r: 0; --art-shadow: none; --label-order: 1; --label-line: 0; --frame-border: 1px solid #e4e4e3; --frame-shadow: 0 2px 10px rgba(26,26,25,.07); --frame-ar: 390/400; --proof-h2: 19px;
  --gap-py: 64px; --gap-fs1: 23px; --gap-fs2: 30px;
  --film-py: 48px; --film-fs: 26px;
  --h2: 24px; --contact-pt: 28px; --contact-pb: 24px; --contact-gap: 14px; --form-gap: 12px; --panel-pad: 16px;
  --foot-py: 14px;
}
@media (min-width: 760px) {
  .page-home {
  --m: none; --m-flex: none; --d: block; --d-flex: flex;
  --pad-x: 0px; --wrap: min(1180px, 92vw); --wrap-wide: var(--wrap);
  --hdr-h: 64px; --mark: 26px; --word: 20px;
  --hero-pt: clamp(44px, 5vw, 68px); --h1: clamp(30px, 4.4vw, 52px); --h1-mb: 22px; --lead: 18px; --lead-mb: 30px;
  --chain-mt: clamp(40px, 5vw, 64px); --chain-py: clamp(36px, 4.5vw, 56px); --chain-fs: clamp(30px, 3.9vw, 50px); --chain-lh: 1.16;
  --sec-py: clamp(48px, 6vw, 76px); --cards-gap: 44px 40px; --card-gap: 14px; --label-pad: 0; --card-r: 16px 16px 0 0; --card-mask: linear-gradient(180deg, #000 68%, rgba(0,0,0,0) 100%); --art-dir: column; --art-align: stretch; --row-line: 0; --art-pad: 0; --frame-w: 100%; --chat-w: auto; --chat-s: 1; --art-bg: transparent; --art-border: 0; --art-r: 0; --art-shadow: none; --label-order: -1; --label-line: 0; --frame-border: 1px solid #e4e4e3; --frame-ar: 390/420; --proof-h2: 20px;
  --gap-py: clamp(56px, 7vw, 92px); --gap-fs1: clamp(26px, 3.4vw, 40px); --gap-fs2: clamp(30px, 4.2vw, 52px);
  --film-py: clamp(48px, 6vw, 72px); --film-fs: clamp(26px, 3vw, 34px);
  --h2: clamp(24px, 2.5vw, 30px); --contact-pt: clamp(40px, 5vw, 56px); --contact-pb: clamp(44px, 5vw, 60px); --contact-gap: 18px; --form-gap: 12px; --panel-pad: 24px;
  --foot-py: 20px;
  }
}

#hero-frame { container-type: inline-size; }
#hero-mock {
  position: absolute; top: 0; left: 0; width: 1360px; height: 561px;
  transform-origin: top left; transform: scale(calc(100cqw / 1360px));
}
#hero-nav button {
  appearance: none; background: none; border: 0; margin: 0; padding: 0 0 2px;
  font: inherit; color: #6b6b6a; cursor: default;
  box-shadow: inset 0 -2px 0 transparent;
  transition: color 240ms ease, box-shadow 240ms ease;
}
#hero-nav button:focus-visible { outline: 2px solid #24b33e; outline-offset: 3px; border-radius: 3px; }
#hero-stack > picture { position: absolute; inset: 0; display: block; }
#hero-stack img {
  width: 100%; height: auto;
  transform-origin: top center; pointer-events: none; opacity: 0; transform: scale(1.006);
  transition: opacity 700ms cubic-bezier(.25,.46,.45,.94), transform 900ms cubic-bezier(.25,.46,.45,.94);
}
#hero-mock:not([data-active]) #hero-nav button:nth-child(4) { color: #1a1a19; box-shadow: inset 0 -2px 0 #24b33e; }
#hero-mock:not([data-active]) #hero-stack picture:nth-child(4) img { opacity: 1; transform: scale(1); }
#hero-mock[data-active="1"] #hero-nav button:nth-child(1) { color: #1a1a19; box-shadow: inset 0 -2px 0 #24b33e; }
#hero-mock[data-active="1"] #hero-stack picture:nth-child(1) img { opacity: 1; transform: scale(1); }
#hero-mock[data-active="2"] #hero-nav button:nth-child(2) { color: #1a1a19; box-shadow: inset 0 -2px 0 #24b33e; }
#hero-mock[data-active="2"] #hero-stack picture:nth-child(2) img { opacity: 1; transform: scale(1); }
#hero-mock[data-active="3"] #hero-nav button:nth-child(3) { color: #1a1a19; box-shadow: inset 0 -2px 0 #24b33e; }
#hero-mock[data-active="3"] #hero-stack picture:nth-child(3) img { opacity: 1; transform: scale(1); }
#hero-mock[data-active="4"] #hero-nav button:nth-child(4) { color: #1a1a19; box-shadow: inset 0 -2px 0 #24b33e; }
#hero-mock[data-active="4"] #hero-stack picture:nth-child(4) img { opacity: 1; transform: scale(1); }
#hero-mock[data-active="5"] #hero-nav button:nth-child(5) { color: #1a1a19; box-shadow: inset 0 -2px 0 #24b33e; }
#hero-mock[data-active="5"] #hero-stack picture:nth-child(5) img { opacity: 1; transform: scale(1); }

#tour-tabs { scrollbar-width: none; }
#tour-tabs::-webkit-scrollbar { display: none; }
#tour-tabs button {
  appearance: none; background: none; border: 0; margin: 0; padding: 14px 0;
  font: inherit; font-size: 14.5px; font-weight: 600; color: #6b6b6a; white-space: nowrap; cursor: pointer;
  box-shadow: inset 0 -2px 0 transparent;
  transition: color 240ms ease, box-shadow 240ms ease;
  -webkit-tap-highlight-color: transparent;
}
#tour-tabs button[data-on] { color: #1a1a19; box-shadow: inset 0 -2px 0 #24b33e; }
#tour-tabs button:focus-visible { outline: 2px solid #24b33e; outline-offset: 3px; border-radius: 3px; }
#tour-strip { scrollbar-width: none; }
#tour-strip::-webkit-scrollbar { display: none; }
#tour-strip > div > picture { display: block; width: 100%; }

/* film.html */
.page-film {
  color-scheme: only light;
  --m: block; --m-flex: flex; --d: none; --d-flex: none;
  --pad-x: 20px; --pad-film: 16px; --wrap: 100%;
  --hdr-h: 56px; --mark: 24px; --word: 19px;
  --top-pt: 32px; --h1: 26px; --h1-mb: 14px; --film-pb: 28px;
  --why-py: 44px; --why-pb: 28px; --why-cols: 1fr; --why-gap: 20px; --h2: 26px; --body: 16.5px;
  --foot-py: 14px;
}
@media (min-width: 760px) {
  .page-film {
  --m: none; --m-flex: none; --d: block; --d-flex: flex;
  --pad-x: 0px; --pad-film: 0px; --wrap: min(1180px, 92vw);
  --hdr-h: 64px; --mark: 26px; --word: 20px;
  --top-pt: clamp(32px, 4vw, 48px); --h1: clamp(24px, 3vw, 34px); --h1-mb: 22px; --film-pb: clamp(36px, 4.5vw, 56px);
  --why-py: clamp(48px, 6vw, 72px); --why-pb: clamp(48px, 6vw, 72px); --why-cols: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); --why-gap: 28px 56px; --h2: clamp(26px, 3.2vw, 38px); --body: 17px;
  --foot-py: 28px;
  }
}

/* founder.html */
.page-founder {
  color-scheme: only light;
  --m: block; --m-flex: flex; --d: none; --d-flex: none;
  --pad-x: 20px; --wrap: 100%;
  --hdr-h: 56px; --mark: 24px; --word: 19px;
  --quote-pt: 44px; --quote-pb: 91px; --grid-w: 72%; --grid-cell: 48px; --grid-pos: right bottom;
  --q: 40px; --q-max: 14ch; --q-sub: 20px; --q-gap: 18px; --q-by: 16px; --q-by-w: 500; --q-by-ls: -.01em; --q-rule: none;
  --about-py: 48px; --about-cols: 1fr; --about-gap: 18px; --h2: 25px; --body: 16.5px;
  --vision-pt: 56px; --vision-pb: 28px; --vision-gap: 20px; --vision-fs: 28px; --items-cols: 1fr; --items-gap: 16px; --item-pad-1: 0; --item-pad: 12px 0 0; --item-pad-last: 12px 0 0; --item-gap: 4px; --item-fs: 20px; --rule-money: 0; --rule-part: 1px solid #e4e4e3;
  --close-pt: 20px; --close-bt: 1px solid #1a1a19; --close-accent: #1e8c30; --close-fs: 21px; --close-w: 600; --close-lh: 1.3; --close-ls: -.018em;
  --foot-py: 14px;
}
@media (min-width: 760px) {
  .page-founder {
  --m: none; --m-flex: none; --d: block; --d-flex: flex;
  --pad-x: 0px; --wrap: min(1180px, 92vw);
  --hdr-h: 64px; --mark: 26px; --word: 20px;
  --quote-pt: clamp(72px, 9vw, 128px); --quote-pb: clamp(72px, 9vw, 128px); --grid-w: 56%; --grid-cell: 72px; --grid-pos: 0 0;
  --q: clamp(38px, 5.6vw, 72px); --q-max: 16ch; --q-sub: clamp(20px, 2.4vw, 28px); --q-gap: 22px; --q-by: 15px; --q-by-w: 600; --q-by-ls: .02em; --q-rule: block;
  --about-py: clamp(56px, 7vw, 96px); --about-cols: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); --about-gap: 28px 56px; --h2: clamp(24px, 3vw, 34px); --body: 17px;
  --vision-pt: clamp(64px, 8vw, 104px); --vision-pb: clamp(64px, 8vw, 104px); --vision-gap: clamp(28px, 3.5vw, 40px); --vision-fs: clamp(28px, 3.6vw, 44px); --items-cols: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); --items-gap: 24px 0; --item-pad-1: 18px 32px 0 0; --item-pad: 18px 32px 0 0; --item-pad-last: 18px 0 0 0; --item-gap: 8px; --item-fs: clamp(19px, 2vw, 24px); --rule-money: 3px solid #24b33e; --rule-part: 3px solid #e4e4e3;
  --close-pt: 0px; --close-bt: 0; --close-accent: #1e8c30; --close-fs: 17px; --close-w: 500; --close-lh: 1.4; --close-ls: -.01em;
  --foot-py: 28px;
  }
}