/* Encore home v10f (2 Nov 2026). Built by lane-logs/2026-10-29-home-v7-v8/home-v10f/build.py from 9E/9A/9B/8C sources; never edit the copy in assets/. */
/* ===== Lifted verbatim from Hero lab v2 (home-heroes-v2.css): the windows you can use, the stack, the pause button, the role line and its list, the tabs and the loop window ===== */
/* ---------- The windows you can use (from v1: the live hero's studio rules, for every window here) ---------- */
.hx-page .ka-rhead { position: relative; z-index: 1; background: #FFFFFF; }
.hx-page .ka-slides { display: grid; grid-template-columns: minmax(0, 1fr); place-items: start center; }
.hx-page .ka-slides > .hh-step { grid-area: 1 / 1; width: 100%; display: flex; flex-direction: column; align-items: center; transition: opacity .42s var(--ease-out) .2s, visibility 0s; }
.hx-page .hh-step:not(.is-on) { opacity: 0; visibility: hidden; transition: opacity .2s var(--ease-out), visibility 0s .2s; }
.hx-page .ka-ballot span { transition: box-shadow .3s var(--ease-out), background-color .3s var(--ease-out); }
.hx-page [data-hl-ctl] [role="button"], .hx-page [data-hl-ctl] [role="radio"], .hx-page [data-hl-ctl] [role="checkbox"], .hx-page [data-hl-ctl] .ka-row[data-hh-row] { cursor: pointer; }
.hx-page [data-hl-ctl] [aria-disabled="true"] { cursor: default; }
.hx-page [data-hl-ctl] [tabindex]:focus-visible { outline: 2px solid #8F83D6; outline-offset: 3px; border-radius: 12px; }
.hx-page [data-hl-ctl] .ka-row[data-hh-row]:not(.is-on):hover { background: #F6F3F8; }
.hx-page .ka-card { transition: background-color .25s var(--ease-out), color .25s var(--ease-out), border-color .25s var(--ease-out); }
.hx-page [data-hl-ctl] .ka-card:not(.is-on):hover { border-color: rgba(58, 30, 60, .35); }
.hx-page [data-hl-ctl] .ka-back[aria-disabled="true"], .hx-page [data-hl-ctl] .rv-back[aria-disabled="true"] { opacity: .6; }
.hx-page .hh-spec .track { cursor: pointer; padding: 0; }
.hx-page .hh-spec .track::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; bottom: -14px; }
.hx-page .hh-spec .track i { cursor: grab; transition: left .12s linear; }
.hx-page .hh-spec .track b { transition: width .12s linear; }
.hx-page .hh-one { max-width: 680px; }

/* One window shows at a time; the others share its cell, so a switch never moves anything */
.hl-stack { display: grid; grid-template-columns: minmax(0, 1fr); }
.hl-stack > .hl-win, .hl-stack .fit-in > .hl-win, .hl-stack > .hx-hbrowser, .hl-stack .fit-in > .hx-hbrowser, .hl-stack > .hx-hres, .hl-stack .fit-in > .hx-hres { grid-area: 1 / 1; z-index: 2; transition: opacity .5s var(--ease-out), visibility 0s; }
/* the window leaving stays solid underneath until the one arriving has faded in over it: no see-through frame, no ghosted type */
.hl-stack .hl-win:not(.is-on), .hl-stack .hx-hbrowser:not(.is-on), .hl-stack .hx-hres:not(.is-on) { z-index: 1; opacity: 0; visibility: hidden; transition: opacity .01s linear .5s, visibility 0s .51s; }
.hl-stack .fit-in { display: grid; grid-template-columns: minmax(0, 1fr); }
.hl-stack > *, .hl-stack .fit-in > * { min-width: 0; }   /* a window is never wider than its cell */
.hx-stack > .hx-rwin { overflow: clip; }

/* The page people answer, in a plain browser frame, at one height for every step */
.hx-rwin { display: flex; flex-direction: column; height: calc(var(--hx-hp, 680px) + 46px); aspect-ratio: auto; }
.hx-rwin > .rv { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; }
.hl-steps { position: relative; z-index: 1; flex: 1; display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; }
.hl-steps > .hh-step { grid-area: 1 / 1; transition: opacity .42s var(--ease-out) .2s, transform .5s var(--ease-out) .2s, visibility 0s; }
.hl-steps > .hh-step:not(.is-on) { transition: opacity .2s var(--ease-out), transform .2s var(--ease-out), visibility 0s .2s; }
.hl-steps > .hh-step:not(.is-on) { transform: translateY(10px); }
.hx-page .rv-cont { cursor: default; }
.hx-page [data-hl-ctl] .rv-cont { cursor: pointer; }
.hx-page .rv-q { padding-top: 26px; }
.hx-page .rv-q .ka-spectrum { margin-top: 48px; }
.hx-page .rv-q .ka-ballot { margin-top: 18px; }
.hx-page .rv-foot { margin-top: 24px; }
.hx-page .rv-dots { margin-top: 18px; }

/* The pause / play button: where the profile button sits (the studio's bar) or at the end of the browser chrome */
.hx-pp { flex: none; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; display: grid; place-items: center; cursor: pointer;
  background: #F1EEF4; color: var(--plum); transition: background-color .25s var(--ease-out); }
.hx-pp:hover { background: #E6E1EC; }
.hx-pp svg { width: 14px; height: 14px; grid-area: 1 / 1; }
.hx-pp .i-play, .hx-pp.is-paused .i-pause { display: none; }
.hx-pp.is-paused .i-play { display: block; }
.hx-pp:focus-visible { outline: 2px solid #8F83D6; outline-offset: 2px; }
.ka-chrome .hx-cend { justify-self: end; display: flex; }
.ka-chrome .hx-pp { width: 32px; height: 32px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--ka-hair, rgba(58, 30, 60, .12)); }
.ka-chrome .hx-pp:hover { background: #F3F0F6; }
.ka-acts .hx-pp { margin-left: 2px; }
/* the chrome keeps room for the button at every width (the kit drops its third column on narrow windows) */
.hx-rwin .ka-chrome { grid-template-columns: 80px minmax(0, 1fr) 80px; }
@container ka (max-width: 780px) { .hx-rwin .ka-chrome { grid-template-columns: 52px minmax(0, 1fr) 52px; } }
@container ka (max-width: 520px) {
  .hx-rwin .ka-chrome { grid-template-columns: minmax(0, 1fr) auto; column-gap: 10px; }
  .hx-rwin .ka-chrome .hx-cend { display: flex; }
}

/* The quiet cue over a window: left, on the window's edge */
.hx-cue { font-size: 16px; line-height: 1.4; color: var(--mute); }
/* ============================== 3 · The roles: the line, the big list, the studio ============================== */
.hx-roles-copy { position: relative; text-align: center; }
.hx-pline { max-width: calc(var(--col) * .9); margin-inline: auto; display: flex; flex-direction: column; justify-content: center; }
.hx-pline-in { display: block; }
.hx-pk-btn { font: inherit; letter-spacing: inherit; line-height: inherit; color: #5B478B; background: none; border: 0; padding: 0; cursor: pointer;
  display: inline; text-align: inherit; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .12em; text-decoration-color: rgba(91, 71, 139, .45);
  transition: color .25s var(--ease-out), text-decoration-color .25s var(--ease-out); }
.hx-pk-btn:hover, .hx-pk-btn[aria-expanded="true"] { color: var(--plum); text-decoration-color: var(--plum); }
.hx-pk-btn:focus-visible { outline: 2px solid #8F83D6; outline-offset: 6px; border-radius: 8px; }
.hx-chev { display: inline-block; width: .34em; height: .34em; margin-left: .1em; vertical-align: .12em; transition: transform .3s var(--ease-out); }
.hx-pk-btn[aria-expanded="true"] .hx-chev { transform: rotate(180deg); }
.hx-src { color: #5B478B; }
.hx-pline { transition: opacity .3s var(--ease-out); }

/* The big list: the whole choice at reading size, two columns on a desktop */
.hx-list { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 16px); padding: 26px 28px 30px; text-align: left;
  background: #FFFFFF; border: 1px solid var(--hair-strong); border-radius: 28px; }
.hx-list[hidden] { display: none; }
.hx-list-h { padding: 0 16px 14px; font-size: 15px; color: var(--mute); }
.hx-list ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; outline: none; }
.hx-list li { display: flex; align-items: center; gap: 14px; padding: 10px 16px; border-radius: 16px; cursor: pointer;
  font-family: var(--serif); font-size: max(26px, calc(var(--vw) * 2.5)); line-height: 1.12; letter-spacing: -.015em; color: var(--plum);
  transition: background-color .2s var(--ease-out), color .2s var(--ease-out); }
.hx-list li.is-act { background: #F3F0F8; }
.hx-list li[aria-selected="true"] { color: #5B478B; }
.hx-list li[aria-selected="true"]::after { content: ""; flex: none; width: 9px; height: 9px; border-radius: 50%; background: #8F83D6; }
.hx-list ul:focus-visible { outline: none; }
.hx-list ul:focus-visible li.is-act { box-shadow: inset 0 0 0 2px #8F83D6; }

.hx-roles-vis { margin-top: max(48px, calc(var(--vw) * 4.4)); }
.hx-roles-vis .hx-cue { margin-bottom: 14px; }

/* ============================== 5 · How it works: four loops, one window ============================== */
.hx-how-head { text-align: center; }
.hx-how-head .h2 { max-width: calc(var(--col) * .66); margin-inline: auto; }
.hx-tabs { margin-top: max(44px, calc(var(--vw) * 4)); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: max(20px, calc(var(--vw) * 2.2)); }
.hx-tab { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 10px; align-content: start; padding: 0 0 6px; border: 0; background: none; text-align: left; cursor: pointer; color: var(--mute); font: inherit; }
.hx-bar { grid-column: 1 / -1; position: relative; height: 2px; margin-bottom: 18px; border-radius: 1px; background: var(--hair-strong); overflow: hidden; }
.hx-bar > b { position: absolute; inset: 0; background: var(--plum); transform-origin: 0 50%; transform: scaleX(var(--p, 0)); }
.hx-tn { font-size: 16px; line-height: 1.4; }
.hx-tw { font-size: 18px; line-height: 1.35; font-weight: 500; color: var(--plum); }
.hx-tl { grid-column: 2; margin-top: 6px; font-size: 16px; line-height: 1.45; color: var(--mute); }
.hx-tab:not(.is-on) .hx-tw { color: #7A6680; font-weight: 400; }
.hx-tab:hover .hx-tw { color: var(--plum); }
.hx-tab:focus-visible { outline: 2px solid #8F83D6; outline-offset: 6px; border-radius: 6px; }
.hx-caps { display: none; }
.hx-how-vis { margin-top: max(36px, calc(var(--vw) * 3.3)); }
.hx-fitbox { position: relative; max-width: var(--vis-max); margin-inline: auto; }
.hx-hstack { --hx-hh: 740px; transform-origin: 0 0; }
.hx-fitbox.fit--off > .hx-hstack { position: relative; }
.hx-hstack > * { min-width: 0; width: 100%; overflow: clip; }
.hx-hbrowser, .hx-hres { height: calc(var(--hx-hh) + 46px); aspect-ratio: auto; }   /* the kit's 16:10 would set the width from this height */
.hx-hbrowser { display: flex; flex-direction: column; }
.hx-scrs { position: relative; flex: 1 1 0; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr); }
.hx-scr { grid-area: 1 / 1; z-index: 2; min-height: 0; display: flex; flex-direction: column; transition: opacity .5s var(--ease-out), visibility 0s; }
.hx-scr:not(.is-on) { z-index: 1; opacity: 0; visibility: hidden; transition: opacity .01s linear .5s, visibility 0s .51s; }
.hx-scr > .rv { flex: 1 1 0; min-height: 0; }
.hx-hf .ka-card.is-on, .hx-hf .ka-ballot span.is-on { transition-duration: .35s; }
.hx-hres .ka-ans { transition: opacity .5s var(--ease-out), transform .5s var(--ease-out); }
.hx-hres .ka-ans:not(.is-in) { opacity: 0; transform: translateY(8px); }
.hx-hres .ka-hright { contain: none; }


/* ===================================== home v9e: "Motion that stops the scroll" ===================================== */
.v9e-page { background: #FFFFFF; }

/* ---------- 1 · Hero: the role line (only the role is a picker) ---------- */
.v9e-hero { padding-bottom: max(96px, calc(var(--vw) * 8)); }
.v9e-hero .hx-pline { color: var(--cream); max-width: calc(var(--col) * .92); }
.v9e-hero .hx-pk-btn { color: #D9D3F6; text-decoration-color: rgba(217, 211, 246, .5); }
.v9e-hero .hx-pk-btn:hover, .v9e-hero .hx-pk-btn[aria-expanded="true"] { color: #FFFFFF; text-decoration-color: #FFFFFF; }
.v9e-hero .hx-pk-btn:focus-visible { outline-color: #D9D3F6; }
.v9e-hero .hx-src { color: #D9D3F6; }
.v9e-hero .hx-list { color: var(--plum); overflow-y: auto; overscroll-behavior: contain; z-index: 60; }
.v9e-hero .hx-list li { font-size: max(24px, min(calc(var(--vw) * 2.2), 38px)); }
.v9e-hero .hx-roles-vis { margin-top: max(56px, calc(var(--vw) * 4.6)); }
.v9e-hero .hx-cue { color: rgba(246, 243, 238, .88); }
/* the client's windows in the hero share the studio window's cell and size */
.v9e-hwin { height: 915px; display: flex; flex-direction: column; aspect-ratio: auto; }
.v9e-hwin > .rv { flex: 1 1 0; min-height: 0; }
.v9e-hwin .rv-mason figure { cursor: pointer; }
.v9e-hwin .rv-mason figure:focus-visible, .v9e-hwin .rv-dir:focus-visible { outline: 2px solid #8F83D6; outline-offset: 3px; }
.v9e-hwin .rv-scale span, .v9e-hwin .rv-chips span, .v9e-hwin .rv-btn, .v9e-hwin .rv-x, .v9e-hwin .rv-dir { cursor: pointer; }
.v9e-hwin .rv-dir figure img { object-fit: cover; border-radius: 14px; filter: none; }
.v9e-hwin .rv-cmp { display: flex; flex-direction: column; }
.v9e-hwin .rv-dir { --pair-h: 400px; }
.v9e-hwin .rv-chips span.is-on { background: var(--plum); color: #FFFFFF; }

.v9e-hero .ka-classic { padding-top: 40px; }
.v9e-hero .v9e-csec { margin-top: 26px; padding-top: 0; border-top: 0; }
.v9e-hero .v9e-csec .ka-cq:first-child { margin-top: 0; }
.v9e-hero .v9e-csec .ka-cq { margin-top: 30px; }

/* ---------- the moments: one big field, one statement, one motion ---------- */
.v9e-mo { padding: 0 max(16px, calc(var(--vw) * 1.4)); }
.v9e-hero + .v9e-mo, .v9e-mo + .v9e-mo { margin-top: max(16px, calc(var(--vw) * 1.4)); }
.v9e-field { position: relative; isolation: isolate; min-height: calc(100vh - max(32px, calc(var(--vw) * 2.8))); display: flex; flex-direction: column; justify-content: center;
  border-radius: max(28px, calc(var(--vw) * 2.4)); overflow: clip; padding: max(56px, calc(var(--vw) * 4)) max(32px, calc(var(--vw) * 3.4)); }
.v9e-field--lilac { background: radial-gradient(in oklab 130% 100% at 50% 0%, #CFC8F3 0%, #DDD7F7 34%, #EDE9FB 68%, #F7F5FD 100%); }
.v9e-field--peach { background: radial-gradient(in oklab 130% 100% at 50% 0%, #F6CDB0 0%, #F9DAC4 34%, #FCEADE 68%, #FEF6F0 100%); }
.v9e-field--pink  { background: radial-gradient(in oklab 130% 100% at 50% 0%, #EBC3D5 0%, #F1D3E0 34%, #F7E4EC 68%, #FCF4F8 100%); }
.v9e-field--mint  { background: radial-gradient(in oklab 130% 100% at 50% 0%, #B8D6BC 0%, #CFE3CF 34%, #E5F0E4 68%, #F4F9F3 100%); }
.v9e-field::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .05; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .23 0 0 0 0 .12 0 0 0 0 .24 0 0 0 1 0'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>"); }
.v9e-head { text-align: center; max-width: 1100px; margin: 0 auto; }
.v9e-say { font-family: var(--serif); font-weight: 400; font-size: max(44px, calc(var(--vw) * 4)); line-height: 1.02; letter-spacing: -.028em; color: var(--plum); text-wrap: balance; }
.v9e-quiet { margin-top: 18px; font-size: 18px; line-height: 1.5; color: #5E4A60; text-wrap: balance; }
.v9e-qlink { color: var(--plum); text-decoration: underline; text-decoration-color: rgba(58, 30, 60, .35); text-underline-offset: 4px; white-space: nowrap; margin-left: 6px; }
.v9e-qlink:hover { text-decoration-color: var(--plum); }
.v9e-stage { position: relative; width: 100%; margin-top: max(36px, calc(var(--vw) * 3)); }
.v9e-fit-in { position: relative; transform-origin: 0 0; }
.v9e-pp { position: absolute; right: max(20px, calc(var(--vw) * 1.6)); bottom: max(20px, calc(var(--vw) * 1.6)); width: 40px; height: 40px; border-radius: 50%; border: 0; display: grid; place-items: center;
  background: rgba(255, 255, 255, .7); color: var(--plum); cursor: pointer; box-shadow: inset 0 0 0 1px rgba(58, 30, 60, .14); transition: background-color .25s var(--ease-out); }
.v9e-pp:hover { background: #FFFFFF; }
.v9e-pp:focus-visible { outline: 2px solid #8F83D6; outline-offset: 3px; }
.v9e-pp svg { width: 16px; height: 16px; }
.v9e-pp .i-play { display: none; }
.v9e-pp.is-paused .i-play { display: block; }
.v9e-pp.is-paused .i-pause { display: none; }

/* the shared parts: the Flow's stops strip (as the app draws it), the studio's link */
.v9e-fname { display: flex; align-items: center; gap: 12px; font-size: 18px; }
.v9e-fname b { font-weight: 500; font-size: 20px; }
.v9e-fname span { color: #6E5A70; }
.v9e-stops { display: flex; align-items: flex-start; }
.v9e-stop { flex: 1 1 0; min-width: 0; display: grid; gap: 10px; }
.v9e-stop .l { display: flex; align-items: center; gap: 10px; font-size: 16px; line-height: 1.3; color: var(--plum); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v9e-stop .l .ka-ico { flex: none; }
.v9e-stop .bar { display: block; height: 3px; border-radius: 2px; background: #E4DFE8; }
.v9e-stop .c { font-size: 14px; color: #6E5A70; }
.v9e-stop--fix .l { color: #4F3B52; }
.v9e-plus { flex: none; width: 22px; height: 22px; margin: 30px 6px 0; border-radius: 50%; display: grid; place-items: center; color: #6E5A70; background: #FFFFFF; box-shadow: inset 0 0 0 1px #DDD6E0; }
.v9e-plus svg { width: 12px; height: 12px; }
.v9e-link-m { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--acc); color: #F6F3EE; font-family: var(--serif); font-size: 21px; flex: none; }

/* ---------- 2 · Pieces ---------- */
.v9e-pc { position: relative; width: 1200px; height: 470px; }
.v9e-pc-cards { position: absolute; left: 0; right: 0; top: 0; display: flex; justify-content: center; gap: 24px; }
.v9e-piece { width: 330px; display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 16px; align-items: center; padding: 20px 22px; border-radius: 22px; background: #FFFFFF; box-shadow: inset 0 0 0 1px rgba(58, 30, 60, .08); will-change: transform, opacity; }
.v9e-piece-i { width: 52px; height: 52px; border-radius: 14px; background: #F3F0F8; display: grid; place-items: center; }
.v9e-piece-t { display: grid; gap: 3px; min-width: 0; }
.v9e-piece-t small { font-size: 14px; color: #6E5A70; }
.v9e-piece-t b { font-family: var(--serif); font-weight: 400; font-size: 22px; line-height: 1.15; color: var(--plum); }
.v9e-piece-t span { font-size: 14px; color: #6E5A70; }
.v9e-pc-flow { position: absolute; left: 0; right: 0; top: 214px; padding: 30px 36px 30px; border-radius: 26px; background: #FFFFFF; box-shadow: inset 0 0 0 1px rgba(58, 30, 60, .08); will-change: transform, opacity; }
.v9e-stops--pc { margin-top: 28px; }
.v9e-stops--pc [data-v9-stop] .l, .v9e-stops--pc [data-v9-stop] .c { transition: opacity .35s var(--ease-out); }
.v9e-stops--pc [data-v9-stop]:not(.is-in) .l, .v9e-stops--pc [data-v9-stop]:not(.is-in) .c { opacity: 0; }
.v9e-stops--pc [data-v9-stop] .bar { background: #E4DFE8; transition: background-color .4s var(--ease-out); }
.v9e-stops--pc [data-v9-stop].is-in .bar { background: #8F83D6; }
.v9e-link { position: absolute; left: 50%; top: 196px; width: 760px; margin-left: -380px; display: grid; grid-template-columns: 44px minmax(0, 1fr) auto auto; align-items: center; gap: 18px;
  padding: 18px 20px 18px 18px; border-radius: 999px; background: #FFFFFF; box-shadow: inset 0 0 0 1px rgba(58, 30, 60, .1); opacity: 0; will-change: transform, opacity; }
.v9e-link-t { display: grid; line-height: 1.3; min-width: 0; }
.v9e-link-t b { font-family: var(--serif); font-weight: 400; font-size: 21px; color: var(--plum); }
.v9e-link-t span { font-size: 15px; color: #4F3B52; }
.v9e-link-u { font-size: 16px; color: #4F3B52; }
.v9e-link-c { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 18px; border-radius: 999px; background: var(--plum); color: #FFFFFF; font-size: 15px; font-weight: 500; }
.v9e-link-c svg { width: 16px; height: 16px; }

/* ---------- 3 · Fold: the 8P shrink ---------- */
.v9e-fold { position: relative; width: 1200px; height: 720px; }
.v9e-layer { position: absolute; inset: 0; transform-origin: 0 0; will-change: transform, opacity; }
.v9e-layer--form { z-index: 3; }
.v9e-layer--flow { z-index: 2; }
.v9e-layer--mail { z-index: 1; display: grid; place-items: center; }
.v9e-layer--form > .ka-form { width: 1200px; height: 720px; max-width: none; }
.v9e-layer--form .ka-form .ka-dots, .v9e-layer--form .ka-form .ka-skip { display: none; }
.v9e-fs { width: 1200px; height: 720px; max-width: none; display: flex; flex-direction: column; background: #FFFFFF; }
.v9e-fs-head { display: flex; align-items: center; justify-content: space-between; padding: 26px 34px 0; }
.v9e-fs-tabs { display: flex; gap: 26px; font-size: 16px; color: #6E5A70; }
.v9e-fs-tabs b { font-weight: 400; color: var(--plum); padding-bottom: 6px; box-shadow: inset 0 -2px 0 var(--plum); }
.v9e-stops--fs { padding: 26px 34px 24px; border-bottom: 1px solid #ECE7EF; }
.v9e-stops--fs .v9e-stop .l { font-size: 15px; }
.v9e-stops--fs [data-v9-stop="0"] .bar { background: var(--plum); }
.v9e-stops--fs [data-v9-stop="0"] { border-radius: 10px; transition: background-color .5s var(--ease-out), box-shadow .5s var(--ease-out); }
.v9e-stops--fs [data-v9-stop="0"].is-lit { background: #EFEBFA; box-shadow: 0 0 0 8px #EFEBFA; }
.v9e-fs-body { flex: 1 1 0; min-height: 0; display: grid; grid-template-columns: 380px minmax(0, 1fr); gap: 36px; padding: 30px 34px 0; background: linear-gradient(in oklab 160deg, #F3F0FB 0%, #F7F1F6 100%); }
.v9e-fs-k { display: flex; align-items: center; gap: 10px; font-size: 16px; color: var(--plum); }
.v9e-fs-h { margin-top: 16px; font-family: var(--serif); font-size: 50px; line-height: 1.02; letter-spacing: -.02em; color: var(--plum); }
.v9e-fs-p { margin-top: 16px; font-size: 16px; line-height: 1.5; color: #4F3B52; }
.v9e-fs-nums { margin-top: 26px; display: flex; gap: 46px; }
.v9e-fs-nums span { display: grid; font-size: 15px; color: #4F3B52; }
.v9e-fs-nums b { font-family: var(--serif); font-weight: 400; font-size: 52px; line-height: 1; color: var(--plum); }
.v9e-fs-open { display: inline-flex; margin-top: 26px; height: 46px; align-items: center; padding: 0 22px; border-radius: 999px; background: #FFFFFF; box-shadow: inset 0 0 0 1px #DDD6E0; font-size: 15px; }
.v9e-fs-prev { align-self: start; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 22px 36px 36px; border-radius: 24px; background: #FFFFFF; }
.v9e-fs-pill { padding: 7px 14px; border-radius: 999px; box-shadow: inset 0 0 0 1px #DDD6E0; font-size: 14px; margin-bottom: 34px; }
.v9e-fs-pill small { font-size: 14px; color: #6E5A70; margin-left: 4px; }
.v9e-fs-prev .ka-q { font-size: 30px; }
.v9e-fs-prev .ka-pair { margin-top: 26px; }
.v9e-fs-prev .ka-card { font-size: 26px; min-height: 70px; }
.v9e-mail { width: 900px; display: flex; flex-direction: column; border-radius: 20px; background: #FFFFFF; box-shadow: inset 0 0 0 1px rgba(58, 30, 60, .1); overflow: clip; }
.v9e-mbar { display: grid; grid-template-columns: 80px 1fr 80px; align-items: center; height: 50px; padding: 0 18px; background: #F6F3F7; border-bottom: 1px solid #ECE7EF; }
.v9e-mbar .dots { display: flex; gap: 8px; }
.v9e-mbar .dots i, .v9e-fold .dots i { width: 12px; height: 12px; border-radius: 50%; background: #DDD6E0; }
.v9e-mtitle { text-align: center; font-size: 15px; color: #4F3B52; }
.v9e-mhead { padding: 6px 36px; border-bottom: 1px solid #ECE7EF; }
.v9e-mhead p { display: flex; gap: 14px; align-items: baseline; padding: 12px 0; font-size: 16px; }
.v9e-mhead p + p { border-top: 1px solid #F1EDF3; }
.v9e-mhead span { width: 48px; color: #6E5A70; }
.v9e-mhead b { font-weight: 500; }
.v9e-mhead small { font-size: 14px; color: #6E5A70; }
.v9e-mbody { padding: 30px 36px 40px; font-size: 18px; line-height: 1.55; color: var(--plum); }
.v9e-msign { margin-top: 24px; color: #4F3B52; }
.v9e-unf { margin-top: 24px; display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 16px 18px; border-radius: 16px; background: #F6F4FA;
  transition: background-color .5s var(--ease-out), box-shadow .5s var(--ease-out); }
.v9e-unf.is-lit { background: #EFEBFA; box-shadow: inset 0 0 0 1.5px #8F83D6; }
.v9e-unf-t { display: grid; min-width: 0; line-height: 1.3; }
.v9e-unf-t b { font-family: var(--serif); font-weight: 400; font-size: 21px; }
.v9e-unf-t span { font-size: 15px; color: #4F3B52; }
.v9e-unf-t small { font-size: 14px; color: #6E5A70; }
.v9e-unf-go { height: 40px; padding: 0 18px; border-radius: 999px; background: var(--plum); color: #FFFFFF; display: inline-flex; align-items: center; font-size: 15px; font-weight: 500; }

/* ---------- 4 · Fan (8R) ---------- */
.v9e-fan { position: relative; width: 1200px; display: grid; grid-template-columns: 440px minmax(120px, 1fr) 520px; align-items: center; }
.v9e-fan-from { grid-column: 1; position: relative; z-index: 1; }
.v9e-fan-card { width: 100%; }
.v9e-fan-card .ka-made-in h5 { font-size: 28px; }
.v9e-fan-card .ka-made-steps span { font-size: 15px; }
.v9e-fan-svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.v9e-fan-svg path { fill: none; stroke: #7D70CB; stroke-width: 1.75; stroke-linecap: round; stroke-dasharray: 1 1; stroke-dashoffset: 1; transition: stroke-dashoffset .6s var(--ease-out); }
.v9e-fan-svg path.is-on { stroke-dashoffset: 0; }
.v9e-fan-svg circle { fill: #7D70CB; opacity: 0; transition: opacity .3s var(--ease-out); }
.v9e-fan-svg circle.is-on { opacity: 1; }
.v9e-fan-to { grid-column: 3; display: grid; gap: 14px; position: relative; z-index: 1; }
.v9e-to { padding: 12px 14px 14px; border-radius: 18px; background: #FFFFFF; opacity: 0; transform: translateX(-12px); transition: opacity .45s var(--ease-out), transform .55s var(--ease-out); }
.v9e-to.is-in { opacity: 1; transform: none; }
.v9e-to-how { display: flex; align-items: center; gap: 10px; font-size: 15px; line-height: 1.35; color: #5E4A60; }
.v9e-to-how b { font-weight: 500; color: var(--plum); }
.v9e-av { width: 26px; height: 26px; border-radius: 6px; display: grid; place-items: center; background: var(--t); color: var(--i); font-style: normal; font-size: 14px; font-weight: 500; flex: none; }
.v9e-unf--sm { margin-top: 8px; padding: 10px 12px; gap: 12px; grid-template-columns: 40px minmax(0, 1fr) auto; border-radius: 12px; }
.v9e-unf--sm .v9e-link-m { width: 40px; height: 40px; font-size: 19px; }
.v9e-unf--sm .v9e-unf-t b { font-size: 18px; }
.v9e-unf--sm .v9e-unf-t span { font-size: 14px; }
.v9e-st { justify-self: end; min-width: 112px; text-align: center; padding: 6px 12px; border-radius: 999px; font-size: 14px; line-height: 1.2; background: #FFFFFF; color: #5E4A60; box-shadow: inset 0 0 0 1px var(--hair); transition: background-color .4s var(--ease-out), color .4s var(--ease-out); }
.v9e-st.is-going { background: #E6E1F7; color: var(--plum); box-shadow: none; }
.v9e-st.is-done { background: #D7E7D6; color: #23412C; box-shadow: none; }

/* ---------- 5 · Results: rows land, tiles fill ---------- */
.v9e-res { width: 1160px; height: 720px; max-width: none; aspect-ratio: auto; border-radius: 16px; }
.v9e-res .ka-ans .ka-tiles i { transition: transform .35s var(--ease-out), background-color .3s var(--ease-out); }
.v9e-res .ka-ans:not(.is-in) .ka-tiles i { transform: scale(.2); }
.v9e-res .ka-ans .ka-tiles i:nth-child(2) { transition-delay: .08s; } .v9e-res .ka-ans .ka-tiles i:nth-child(3) { transition-delay: .16s; } .v9e-res .ka-ans .ka-tiles i:nth-child(4) { transition-delay: .24s; }
.v9e-res .ka-nums b { transition: color .3s var(--ease-out); }

/* ---------- 6 · Agents (8C) ---------- */
.v9e-ag-grid { width: 1240px; height: 660px; display: grid; grid-template-columns: minmax(0, 1fr) 430px; gap: 24px; text-align: left; }
.v9e-ag-col { min-width: 0; display: flex; flex-direction: column; }
.v9e-ag-col > .ka { flex: 1 1 0; min-height: 0; }
.v9e-who { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; font-size: 16px; line-height: 1.4; color: #5E4A60; white-space: nowrap; }
.v9e-who b { font-weight: 500; color: var(--plum); }
.v9e-who-mark { width: 22px; height: 22px; border-radius: 6px; flex: none; }
.v9e-who-mark--agent { background: #C96442; }
.v9e-who-mark--enc { background: var(--plum); color: #FFFFFF; display: grid; place-items: center; font-family: var(--serif); font-size: 14px; }
.v9e-chat { height: 100%; max-width: none; }
.v9e-chat .kc-main { min-height: 0; }
.v9e-chat-view { position: relative; flex: 1 1 0; min-height: 0; overflow: clip;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 56px, #000 100%); mask-image: linear-gradient(180deg, transparent 0, #000 56px, #000 100%); }
.v9e-chat-list { position: absolute; left: 0; right: 0; bottom: 0; padding-bottom: 8px; }
.v9e-chat .kc-col > [data-ag] { transition: opacity .5s var(--ease-out) .05s, transform .6s var(--ease-out) .05s; }
.v9e-chat .kc-col > [data-ag]:not(.is-in) { opacity: 0; transform: translateY(12px); }
.v9e-chat .kc-col > [data-ag].is-gone { display: none; }
.v9e-chat .kc-say p + p { margin-top: 10px; }
.v9e-chat .kc-link { text-decoration: underline; text-decoration-color: rgba(201, 100, 66, .5); text-underline-offset: 3px; }
.v9e-chat .kc-e { width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; flex: none; background: var(--plum); color: #FFFFFF; font-family: var(--serif); font-style: normal; font-size: 14px; }
.v9e-chat .kc-ph { min-height: 1.5em; }
.v9e-chat .kc-ph.is-typing { color: #141413; }
.v9e-chat .kc-ph.is-typing::after { content: ""; display: inline-block; width: 2px; height: 1.1em; margin-left: 2px; vertical-align: -.15em; background: #141413; animation: v9e-caret 1s steps(1) infinite; }
.v9e-chat .kc-btn svg { width: 16px; height: 16px; }
@keyframes v9e-caret { 50% { opacity: 0; } }
.v9e-agflow { height: 100%; aspect-ratio: auto; max-width: none; }
.v9e-agflow .ka-bar { padding: 0 22px; }
.v9e-agflow .ka-send { transition: background-color .4s var(--ease-out), color .4s var(--ease-out); }
.v9e-agflow-body { flex: 1 1 0; min-height: 0; padding: 30px 26px; display: flex; flex-direction: column; }
.v9e-agflow-k { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 500; }
.v9e-agflow-h { margin-top: 14px; font-family: var(--serif); font-weight: 400; font-size: 36px; line-height: 1.08; letter-spacing: -.015em; }
.v9e-agflow-steps { margin: 26px 0 8px; display: grid; gap: 10px; }
.v9e-fstep { display: grid; grid-template-columns: 22px 22px minmax(0, 1fr); align-items: center; column-gap: 12px; padding: 16px; border-radius: 16px; background: #F6F4FA; }
.v9e-fstep .n { font-size: 14px; color: #6E5A70; text-align: center; }
.v9e-fstep b { display: block; font-weight: 500; font-size: 16px; line-height: 1.3; }
.v9e-fstep small { display: block; margin-top: 3px; font-size: 14px; color: #6E5A70; }
.v9e-agflow-sent { margin-top: 14px; display: flex; align-items: center; gap: 12px; padding: 4px 16px; font-size: 15px; }
.v9e-agflow-sent + .v9e-agflow-sent { margin-top: 10px; }
.v9e-agflow-sent b { display: block; font-weight: 500; }
.v9e-agflow-sent small { display: block; font-size: 14px; color: #6E5A70; }
.v9e-dot { width: 10px; height: 10px; border-radius: 50%; background: #A197E1; flex: none; }
.v9e-dot--done { background: #3E8E68; }
.v9e-agflow [data-ag-flow] { transition: opacity .5s var(--ease-out), transform .6s var(--ease-out); }
.v9e-agflow [data-ag-flow]:not(.is-in) { opacity: 0; transform: translateY(10px); }

/* ---------- 7 · Why, and the Typeform/Tally difference ---------- */
.v9e-why { text-align: center; padding-block: max(120px, calc(var(--vw) * 10)) max(100px, calc(var(--vw) * 8)); }
.v9e-why-say { max-width: 20em; margin-inline: auto; font-family: var(--serif); font-weight: 400; font-size: max(30px, calc(var(--vw) * 2.5)); line-height: 1.24; letter-spacing: -.012em; color: var(--plum); text-wrap: balance; }
.v9e-vs { max-width: 34em; margin: max(32px, calc(var(--vw) * 2.6)) auto 0; font-size: 19px; line-height: 1.55; color: #5E4A60; text-wrap: balance; }

/* ---------- 8 · Pricing: the ladder steps up, then two plans ---------- */
.v9e-lad { position: relative; width: 1000px; height: 400px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; align-items: end; padding-top: 70px; }
.v9e-rung { position: relative; display: flex; flex-direction: column; justify-content: flex-end; padding: 20px 22px; border-radius: 18px; overflow: clip; isolation: isolate; color: var(--plum); }
.v9e-rung-b { position: absolute; inset: 0; z-index: -1; border-radius: inherit; transform-origin: 50% 100%; }
.v9e-rung--0 { height: 130px; color: #F6F3EE; } .v9e-rung--0 .v9e-rung-b { background: #3A1E3C; }
.v9e-rung--1 { height: 190px; } .v9e-rung--1 .v9e-rung-b { background: #7D70CB; }
.v9e-rung--2 { height: 250px; } .v9e-rung--2 .v9e-rung-b { background: #A99FE0; }
.v9e-rung--3 { height: 310px; } .v9e-rung--3 .v9e-rung-b { background: #C8C2F0; }
.v9e-rung--1 { color: #FFFFFF; }
.v9e-rung-p { font-family: var(--serif); font-size: 52px; line-height: 1; letter-spacing: -.02em; }
.v9e-rung-p small { font-family: var(--sans); font-size: 15px; letter-spacing: 0; opacity: .9; }
.v9e-rung-l { margin-top: 8px; font-size: 16px; opacity: .92; }
.v9e-lad-here { position: absolute; left: 0; top: 0; display: flex; gap: 8px; align-items: center; padding: 10px 16px; border-radius: 999px; background: #FFFFFF; font-size: 16px; color: #4F3B52; box-shadow: inset 0 0 0 1px rgba(58, 30, 60, .1); }
.v9e-lad-here b { font-weight: 500; color: var(--plum); }
.v9e-lad-here::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: #3E8E68; }
.v9e-plans-sec { padding-top: max(56px, calc(var(--vw) * 4.4)); }
.v9e-plans { max-width: 1080px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: var(--gap); }
.v9e-plan { display: flex; flex-direction: column; padding: 34px 34px 32px; border-radius: 28px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--hair); }
.v9e-plan--paid { background: linear-gradient(in oklab 160deg, #DCD6F8 0%, #EEDCEB 52%, #FBE6D9 100%); box-shadow: none; }
.v9e-plan-name { font-family: var(--serif); font-size: 30px; line-height: 1.1; letter-spacing: -.01em; }
.v9e-plan-price { margin-top: 18px; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.v9e-plan-price .amt { font-family: var(--serif); font-size: 80px; line-height: 1; letter-spacing: -.03em; }
.v9e-plan-price .per { font-size: 17px; color: #4F3B52; }
.v9e-incl { margin: 24px 0 28px; padding: 0; list-style: none; display: grid; gap: 12px; font-size: 17px; line-height: 1.45; }
.v9e-incl li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 12px; align-items: start; }
.v9e-incl svg { width: 18px; height: 18px; margin-top: 3px; color: var(--plum); }
.v9e-plan .btn { margin-top: auto; align-self: flex-start; }

/* ---------- 9, 10 · FAQ, close ---------- */
.v9e-h { font-family: var(--serif); font-weight: 400; font-size: max(36px, calc(var(--vw) * 3)); line-height: 1.08; letter-spacing: -.02em; color: var(--plum); text-wrap: balance; }
.v9e-faq { margin-top: var(--sec); }
.v9e-close { text-align: center; padding-bottom: var(--sec); }
.v9e-close-h { max-width: 16em; margin-inline: auto; font-family: var(--serif); font-weight: 400; font-size: max(44px, calc(var(--vw) * 4)); line-height: 1.04; letter-spacing: -.025em; color: var(--plum); text-wrap: balance; }
.v9e-close-acts { margin-top: 36px; display: flex; justify-content: center; }

@media (prefers-reduced-motion: reduce) {
  .v9e-chat .kc-col > [data-ag], .v9e-agflow [data-ag-flow], .v9e-to, .v9e-fan-svg path, .v9e-res .ka-ans .ka-tiles i { transition: none; }
  .v9e-chat .kc-ph.is-typing::after { animation: none; }
  .v9e-pp { display: none; }
}

/* ===================================== home v10a (2 Nov 2026) ===================================== */

/* ---------- 1 · Hero: the headline, then the role line, then the window ---------- */
.v10-hero .hx-roles-copy { text-align: center; }
.v10-h1 { max-width: 13em; margin-inline: auto; font-family: var(--serif); font-weight: 400; font-size: max(54px, min(calc(var(--vw) * 5.6), 108px)); line-height: 1; letter-spacing: -.03em;
  color: var(--cream); text-wrap: balance; }
.v10-hero .v10-pline { margin-top: max(22px, calc(var(--vw) * 1.8)); font-family: var(--serif); font-weight: 400; font-size: max(28px, min(calc(var(--vw) * 2.6), 48px)); line-height: 1.18;
  letter-spacing: -.015em; max-width: none; }
.v10-hero .hx-pk-btn { font: inherit; }
.v10-hero .hx-roles-vis { margin-top: max(44px, calc(var(--vw) * 3.4)); }

/* ---------- split fields: headline + one sentence beside one window (9A's quiet fields) ---------- */
.v10-split { display: grid; grid-template-columns: minmax(0, 3.7fr) minmax(0, 8.3fr); align-items: center; column-gap: max(36px, calc(var(--vw) * 3.2)); }
.v10-split .v9e-head { text-align: left; margin: 0; max-width: 30rem; }
.v10-split .v9e-say { font-size: max(40px, min(calc(var(--vw) * 3.5), 66px)); text-wrap: balance; }
.v10-split .v9e-quiet { font-size: max(18px, min(calc(var(--vw) * 1.32), 21px)); text-wrap: pretty; }
.v10-split .v9e-stage { margin-top: 0; }
.v10-split--l .v9e-head { order: 2; }
.v10-split--l .v9e-stage { order: 1; }
.v10-split--l { grid-template-columns: minmax(0, 8.3fr) minmax(0, 3.7fr); }
.v10-mo .v9e-quiet { max-width: 40em; margin-inline: auto; }
.v10-split .v9e-quiet { margin-inline: 0; }
.v9e-field--sky { background: radial-gradient(in oklab 130% 100% at 50% 0%, #C6DDF0 0%, #D6E6F4 34%, #E8F1F9 68%, #F6F9FC 100%); }
.v10-team { display: block; margin-top: 10px; }

/* the client's windows, drawn at a fixed size inside the fitted stage */
.v10-win { width: 100%; max-width: none; aspect-ratio: auto; border-radius: 16px; display: flex; flex-direction: column; background: #FFFFFF; }
.v10-win > .rv { flex: 1 1 0; min-height: 0; }
.v10-fwin { height: 700px; }
.v10-mbwin { height: 760px; }
.v10-cwin { height: 740px; }
.v10-ywin { height: 700px; }
.v10-win [data-name], .v10-win [data-mark] { transition: color .45s var(--ease-out), background-color .45s var(--ease-out); }

/* Forms */
.v10-form .rv-cont { transition: transform .2s var(--ease-out), background-color .3s var(--ease-out); }
.v10-form .rv-cont.hx-press { transform: scale(.96); }
.v10-form .ka-ballot span { transition: background-color .3s var(--ease-out), border-color .3s var(--ease-out), color .3s var(--ease-out); }
.v8h-text { position: relative; width: min(100%, 640px); min-height: 132px; margin-inline: auto; text-align: left; line-height: 1.55; color: var(--plum); font-size: 18px; }
.v8h-text .v8h-ph { color: rgba(110, 90, 112, .8); }
.v8h-text.is-typing .v8h-ph, .v8h-text.has-text .v8h-ph { display: none; }
.v8h-caret { display: none; width: 2px; height: 1.1em; margin-left: 1px; vertical-align: -.18em; background: var(--plum); }
.v8h-text.is-typing .v8h-caret { display: inline-block; animation: v10-blink 1s steps(1) infinite; }
@keyframes v10-blink { 50% { opacity: 0; } }

/* Moodboards */
.v10-mb .rv-scale span { transition: background-color .25s var(--ease-out), color .25s var(--ease-out); }
.v10-mb .rv-scale span.is-on { background: var(--acc); color: #FFFFFF; }
.v10-mb .rv-chips span { transition: background-color .25s var(--ease-out), color .25s var(--ease-out); }
.v10-mb .rv-chips span.is-on { background: var(--plum); color: #FFFFFF; }
.v10-mb .rv-btn.hx-press { transform: scale(.96); }
.v10-mb .rv-btn { transition: transform .2s var(--ease-out); }

/* Comparisons: the app draws the pictures flat, no lift */
.v10-cwin .rv-cmp { display: flex; flex-direction: column; }
.v10-cwin .rv-dir { --pair-h: 420px; }
.v10-cwin .rv-dir figure img { object-fit: cover; border-radius: 14px; filter: none; }
.v10-cwin .rv-dir.is-hover figure img { outline: 2px solid color-mix(in oklch, var(--acc) 50%, white); outline-offset: 3px; }

/* ---------- 2 · Yours: the name and the colour (9B) ---------- */
.v10-yours .v9e-field { min-height: 0; }
.v10-make { margin-top: 34px; }
.v10-lab { display: block; font-size: 16px; line-height: 1.4; color: #5E4A60; }
.v10-lab--acc { margin-top: 26px; }
.v10-input { margin-top: 10px; max-width: 460px; }
.v10-yname { color: var(--v10-acc, #5B478B); transition: color .45s var(--ease-out); }
body[style*="#FF8A5B"] .v10-yname { color: #C8592F; }
.v9m-input { display: flex; align-items: center; height: 64px; padding: 0 26px; border-radius: 999px; background: rgba(255, 255, 255, .62); cursor: text; transition: background-color .25s var(--ease-out); }
.v9m-input:hover { background: rgba(255, 255, 255, .78); }
.v9m-input:focus-within { background: #FFFFFF; }
.v9m-input input { flex: 1; min-width: 0; height: 100%; border: none; outline: none; box-shadow: none; background: transparent; padding: 0; margin: 0; font: 400 26px/1 var(--serif); letter-spacing: -.01em; color: var(--plum); }
.v9m-sw { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 10px 22px; }
.v9m-swb { display: inline-flex; align-items: center; gap: 10px; padding: 4px 2px; border: 0; background: none; cursor: pointer; font: 400 16px/1 var(--sans); color: #5E4A60; }
.v9m-swb i { width: 30px; height: 30px; border-radius: 50%; background: var(--c); outline: 2px solid transparent; outline-offset: 3px; transition: outline-color .25s var(--ease-out), transform .25s var(--ease-out); }
.v9m-swb:hover i { transform: scale(1.06); }
.v9m-swb[aria-checked="true"] { color: var(--plum); }
.v9m-swb[aria-checked="true"] i { outline-color: var(--c); }
.v9m-swb[data-acc="#FF8A5B"][aria-checked="true"] i { outline-color: #E2734A; }
.v9m-swb:focus-visible { outline: 2px solid #8F83D6; outline-offset: 4px; border-radius: 8px; }
.v10-wel .rv-wel { width: 600px; }
.v10-wel .rv-wel-wrap { padding-top: 24px; }
.v10-wel .rv-wt, .v10-wel .rv-from, .v10-wel .rv-begin, .v10-wel .rv-studio i, .v10-wel .rv-rule { transition: color .45s var(--ease-out), background-color .45s var(--ease-out); }

/* the studio's link mark follows the colour */
.v9e-link-m[data-v10-accbg] { background: var(--v10-acc, #5B478B); transition: background-color .45s var(--ease-out); }

/* ---------- 3 · What Encore does ---------- */
.v10-does { text-align: center; padding-block: max(120px, calc(var(--vw) * 9.4)) max(100px, calc(var(--vw) * 7.4)); }
.v10-kick { font-size: 16px; line-height: 1.4; color: #5E4A60; }
.v10-does-h { margin-top: 14px; font-family: var(--serif); font-weight: 400; font-size: max(48px, min(calc(var(--vw) * 4.8), 92px)); line-height: 1.02; letter-spacing: -.03em; color: var(--plum); text-wrap: balance; }
.v10-does-p { max-width: 34em; margin: 24px auto 0; font-size: max(19px, min(calc(var(--vw) * 1.45), 24px)); line-height: 1.5; color: #4F3B52; text-wrap: balance; }
.v10-does + .v10-mo { margin-top: 0; }

/* ---------- Sending: the app's Send a link + Who you asked ---------- */
.v10-sd { position: relative; width: 1240px; height: 700px; display: grid; grid-template-columns: 420px 1fr; column-gap: 110px; align-items: center; }
.v10-sd-svg path { stroke: var(--v10-acc, #7D70CB); }
.v10-sd-svg circle { fill: var(--v10-acc, #7D70CB); }
.v10-send { background: #FFFFFF; border-radius: 18px; padding: 30px 30px 26px; color: var(--plum); box-shadow: inset 0 0 0 1px rgba(58, 30, 60, .08); }
.v10-send-k { font-size: 14px; color: #6E5A70; }
.v10-send-h { margin-top: 6px; font-family: var(--serif); font-size: 32px; line-height: 1.1; letter-spacing: -.02em; }
.v10-send-p { margin-top: 12px; font-size: 16px; line-height: 1.5; color: #5E4A60; }
.v10-send-g { margin-top: 20px; font-size: 15px; font-weight: 500; }
.v10-send-row { margin-top: 12px; display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 15px; }
.v10-seg { display: inline-flex; padding: 3px; border-radius: 999px; background: #F1EEF3; font-size: 14px; }
.v10-seg > * { min-width: 52px; padding: 7px 0; text-align: center; border-radius: 999px; color: #6E5A70; font-weight: 400; }
.v10-seg b { background: #FFFFFF; color: var(--plum); font-weight: 500; }
.v10-send-acts { margin-top: 22px; display: flex; justify-content: flex-end; align-items: center; gap: 22px; font-size: 15px; }
.v10-send-no { color: #5E4A60; }
.v10-send-go { height: 42px; padding: 0 22px; border-radius: 999px; display: inline-flex; align-items: center; background: var(--plum); color: #FFFFFF; font-weight: 500; transition: transform .2s var(--ease-out), background-color .3s var(--ease-out); }
.v10-send-go.hx-press { transform: scale(.95); }
.v10-send-go.is-done { background: #4F3B52; }
.v10-send-link { margin-top: 18px; height: 50px; padding: 0 8px 0 18px; border-radius: 12px; display: flex; align-items: center; justify-content: space-between; background: #F5F2F7; font-size: 15px;
  opacity: 0; transform: translateY(6px); transition: opacity .35s var(--ease-out), transform .35s var(--ease-out); }
.v10-send-link.is-on { opacity: 1; transform: none; }
.v10-send-u { color: var(--plum); }
.v10-send-c { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border-radius: 999px; background: #E8F2EC; color: #2E6B4E; font-size: 14px; }
.v10-send-c svg { width: 14px; height: 14px; }
.v10-who { width: 710px; height: 700px; max-width: none; aspect-ratio: auto; border-radius: 16px; }
.v10-who .ka-tabs > span:not(.is-on):not(.sep) { display: none; }
.v10-person { transition: background-color .35s var(--ease-out); }
.v10-person .line i { transition: background-color .3s var(--ease-out), transform .3s var(--ease-out); }
.v10-person .line i:not(.k):not(.p) { background: #ECE8EE; }
.v10-person [data-v10-st] { transition: color .3s var(--ease-out); }
.v10-person:not(.is-in) [data-v10-st] { color: #8A7A8C; }

/* ---------- In conversation (9C, compact) ---------- */
.v10-talk .v9e-field { min-height: 0; justify-content: flex-start; padding-block: max(72px, calc(var(--vw) * 6)); }
.v10-talk-head { max-width: 1100px; }
.v10-talk-h { margin-top: 14px; max-width: 18em; font-family: var(--serif); font-weight: 400; font-size: max(34px, min(calc(var(--vw) * 3), 56px)); line-height: 1.1; letter-spacing: -.02em; color: var(--plum); text-wrap: balance; }
.v10-exs { margin-top: max(48px, calc(var(--vw) * 4)); display: grid; gap: max(40px, calc(var(--vw) * 3.2)); }
.v10-ex { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); column-gap: max(40px, calc(var(--vw) * 4)); align-items: start; }
.v10-ex-q { font-family: var(--serif); font-weight: 400; font-size: max(28px, min(calc(var(--vw) * 2.3), 42px)); line-height: 1.12; letter-spacing: -.016em; color: var(--plum); text-wrap: balance; }
.v10-ex-lead { font-family: var(--serif); font-size: max(22px, min(calc(var(--vw) * 1.6), 28px)); line-height: 1.25; color: var(--plum); }
.v10-ex-p { margin-top: 10px; font-size: 18px; line-height: 1.55; color: #4F3B52; max-width: 32em; }

/* ---------- FAQ in a field ---------- */
.v10-faq { margin-top: max(16px, calc(var(--vw) * 1.4)); }
.v10-faq .v9e-field { min-height: 0; padding-block: max(72px, calc(var(--vw) * 6)); }
.v10-faq-in { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: max(40px, calc(var(--vw) * 4)); align-items: start; }
.v10-faq-h { font-family: var(--serif); font-weight: 400; font-size: max(40px, min(calc(var(--vw) * 3.5), 66px)); line-height: 1.04; letter-spacing: -.025em; color: var(--plum); }
.v10-faq-card { background: #FFFFFF; border-radius: 22px; }

@media (prefers-reduced-motion: reduce) {
  .v10-send-link, .v10-person, .v10-person .line i, .v10-form .rv-cont, .v10-mb .rv-scale span, .v10-mb .rv-chips span { transition: none; }
  .v8h-text.is-typing .v8h-caret { animation: none; }
}
/* ===================================== home v10b (2 Nov 2026) ===================================== */
/* ---------- Flow: the real Flow studio (9B, copied) ---------- */

.v9b-fs { height: 780px; display: flex; flex-direction: column; background: #FFFFFF; border-radius: 18px; }
.v9b-fs .ka-bar { flex: none; }
.v9b-saved { display: inline-flex; align-items: center; gap: 8px; margin-left: 18px; font-size: 14px; color: #6E5A70; }
.v9b-saved i { width: 7px; height: 7px; border-radius: 50%; background: #7CCFB7; }
.v9b-act { font-size: 15px; color: var(--plum); padding: 0 8px; }
.ka-send.is-press { transform: scale(.95); }
.ka-send { transition: transform .2s var(--ease-out); }
.v9b-fhead { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 26px 36px 0; }
.v9b-fname { display: flex; align-items: center; gap: 12px; font-size: 16px; color: #6E5A70; }
.v9b-fname b { font-weight: 500; font-size: 18px; color: var(--plum); }
.v9b-lanes { display: inline-flex; gap: 26px; font-size: 16px; color: #6E5A70; }
.v9b-lanes .is-on { color: var(--plum); box-shadow: inset 0 -2px 0 var(--plum); padding-bottom: 6px; }
.v9b-stops { flex: none; display: grid; grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1.25fr) 22px minmax(0, 1.25fr) 22px minmax(0, 1.25fr) 22px minmax(0, 1fr);
  align-items: start; column-gap: 6px; padding: 26px 36px 24px; border-bottom: 1px solid rgba(58, 30, 60, .1); }
.v9b-stop { min-width: 0; display: grid; gap: 10px; transition: opacity .5s var(--ease-out), transform .6s var(--ease-out); }
.v9b-stop .l { display: flex; align-items: center; gap: 10px; min-width: 0; font-size: 16px; color: #5E4A60; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v9b-stop .l .ka-ico { flex: none; }
.v9b-stop .bar { position: relative; display: block; height: 3px; border-radius: 2px; background: rgba(58, 30, 60, .12); overflow: hidden; }
.v9b-stop .bar b { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--plum); }
.v9b-stop .c { font-size: 14px; color: #6E5A70; white-space: nowrap; }
.v9b-stop.is-on .l { color: var(--plum); font-weight: 500; }
.v9b-stop.is-off { opacity: 0; transform: translateY(14px); }
.v9b-plus { align-self: start; margin-top: 30px; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; color: #6E5A70; box-shadow: inset 0 0 0 1px rgba(58, 30, 60, .2); background: #FFFFFF; transition: opacity .5s var(--ease-out); }
.v9b-plus svg { width: 12px; height: 12px; }
.v9b-plus.is-off { opacity: 0; }
.v9b-fbody { flex: 1 1 0; min-height: 0; display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 32px; padding: 28px 36px 32px; background: linear-gradient(180deg, #F1EFFB 0%, #F6F4FB 100%); }
.v9b-fpanel { position: relative; min-width: 0; }
.v9b-pan { position: absolute; inset: 0; opacity: 0; transform: translateY(8px); transition: opacity .45s var(--ease-out), transform .5s var(--ease-out); }
.v9b-pan.is-on { opacity: 1; transform: none; }
.v9b-pan-k { display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 500; color: var(--plum); }
.v9b-pan-t { margin-top: 16px; font-family: var(--serif); font-size: 40px; line-height: 1.04; letter-spacing: -.02em; color: var(--plum); }
.v9b-pan-n { margin-top: 34px; display: flex; gap: 48px; }
.v9b-pan-n span { display: grid; gap: 4px; font-size: 16px; color: #5E4A60; }
.v9b-pan-n b { font-family: var(--serif); font-weight: 400; font-size: 48px; line-height: 1; color: var(--plum); }
.v9b-open { position: absolute; left: 0; bottom: 8px; display: inline-flex; align-items: center; height: 46px; padding: 0 22px; border-radius: 999px; background: #FFFFFF; box-shadow: inset 0 0 0 1px rgba(58, 30, 60, .16); font-size: 16px; color: var(--plum); }
.v9b-prev { position: relative; min-width: 0; border-radius: 20px; background: #FFFFFF; overflow: clip; box-shadow: inset 0 0 0 1px rgba(58, 30, 60, .08); }
.v9b-prev-in { position: absolute; left: 0; top: 0; width: 900px; height: 540px; transform-origin: 0 0; }
.v9b-ps { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .5s var(--ease-out), visibility 0s .5s; }
.v9b-ps.is-on { opacity: 1; visibility: visible; transition: opacity .5s var(--ease-out), visibility 0s; }
.v9b-ps > .rv { position: absolute; inset: 0; }
.v9b-ps .rv-mb .rv-title, .v9b-ps .rv-cmp .rv-title { font-size: 42px; }
.v9b-ps .rv-mason { margin: 26px 40px 0; }
.v9b-ps .rv-cmp { --pair-h: 240px; }
.v9b-ps .rv-cmp-body { padding-top: 18px; }
.v9b-ps .rv-dir figure img { object-fit: cover; border-radius: 14px; filter: none; }
.v9b-ps .rv-cont.is-press { transform: scale(.96); }
.v10b-fs { width: 1240px; }
.v9b-stop .bar b { width: 0; }
.v9b-stop.is-on .bar { background: rgba(58, 30, 60, .16); }
.v9b-prev .rv-mb .rv-mason figure img, .v9b-prev .rv-dir figure img { object-fit: cover; }
.v9b-prev .rv-mason { --cols: 4; }
.v9b-prev .rv-cont { transition: transform .2s var(--ease-out), background-color .3s var(--ease-out); }
.v9b-prev .rv-cont.hx-press { transform: scale(.96); }
.v9b-prev .ka-ballot span { transition: background-color .3s var(--ease-out), border-color .3s var(--ease-out), color .3s var(--ease-out); }
.v10b-copied { position: absolute; left: 50%; bottom: 22px; z-index: 3; display: inline-flex; align-items: center; gap: 8px; height: 46px; padding: 0 20px; border-radius: 999px;
  background: var(--plum); color: #FFFFFF; font-size: 15px; font-weight: 500; white-space: nowrap; opacity: 0; transform: translate(-50%, 10px); transition: opacity .4s var(--ease-out), transform .45s var(--ease-out); }
.v10b-copied.is-on { opacity: 1; transform: translate(-50%, 0); }
.v10b-copied svg { width: 16px; height: 16px; }

/* ---------- Moodboards: the client's Moodboard beside the studio's Results ---------- */
.v10b-md { width: 1240px; display: grid; grid-template-columns: 760px minmax(0, 1fr); gap: 24px; text-align: left; }
.v10b-md-col { min-width: 0; display: flex; flex-direction: column; }
.v10b-mbwin { height: 690px; }
.v10b-mres { flex: 1 1 0; width: 100%; height: 690px; max-width: none; aspect-ratio: auto; border-radius: 16px; }
.v10b-mres .ka-tabs { display: none; }
.v10b-mres .ka-ans .ka-tiles i { transition: transform .35s var(--ease-out), background-color .3s var(--ease-out); }
.v10b-mres .ka-ans:not(.is-in) .ka-tiles i { transform: scale(.2); }
.v10b-mres .ka-lhead b { font-weight: 500; }
.v10b-mark-client { display: grid; place-items: center; border-radius: 50%; background: var(--v10-acc, #5B478B); color: #F6F3EE; font-family: var(--serif); font-size: 13px; font-style: normal; transition: background-color .45s var(--ease-out); }
.v10b-mbwin .rv-mason figure img { object-fit: cover; }

/* ---------- Agents: "Works with [agent]", and four quiet chat surfaces ---------- */
.v10b-agw { position: relative; display: inline-block; vertical-align: bottom; overflow: clip; overflow-clip-margin: 0; padding-bottom: .16em; margin-bottom: -.16em; white-space: nowrap; color: #5B478B; }
.v10b-agw-in { display: inline-block; }
.v10b-agw-meas { position: absolute; left: -9999px; top: 0; visibility: hidden; white-space: nowrap; }
.v10b-ag-grid .v9e-who-mark--agent { display: none; }
.v10b-ag-grid { height: 610px; }
.v10b-chat { --bg: #FAF9F5; --side: #F3F1EA; --line: rgba(31, 30, 29, .1); --ink: #29261F; --mute: #6B6760; --ub: #EFEBE1; --ur: 14px; --send: #C96442; --box: 18px;
  flex: 1 1 0; min-height: 0; display: grid; grid-template-columns: 210px minmax(0, 1fr); border-radius: 16px; overflow: clip; background: var(--bg); color: var(--ink);
  box-shadow: inset 0 0 0 1px var(--line); font-size: 15px; transition: background-color .4s var(--ease-out); }
.v10b-chat .ch-side { display: flex; flex-direction: column; gap: 4px; padding: 18px 14px; background: var(--side); border-right: 1px solid var(--line); min-width: 0; transition: background-color .4s var(--ease-out); }
.v10b-chat .ch-brand { font-size: 18px; font-weight: 500; padding: 2px 8px 12px; }
.v10b-chat .ch-new { display: flex; align-items: center; gap: 8px; padding: 8px; border-radius: 8px; font-size: 15px; }
.v10b-chat .ch-new svg { width: 14px; height: 14px; }
.v10b-chat .ch-label { margin-top: 14px; padding: 4px 8px; font-size: 14px; color: var(--mute); }
.v10b-chat .ch-rec { padding: 7px 8px; border-radius: 8px; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ink); }
.v10b-chat .ch-rec.is-on { background: rgba(31, 30, 29, .06); }
.v10b-chat .ch-me { margin-top: auto; display: flex; align-items: center; gap: 10px; padding: 8px; font-size: 14px; }
.v10b-chat .ch-me i { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--v10-acc, #5B478B); color: #FFFFFF; font-style: normal; font-size: 13px; }
.v10b-chat .ch-main { min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.v10b-chat .ch-top { flex: none; display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; }
.v10b-chat .ch-title { font-size: 15px; font-weight: 500; }
.v10b-chat .ch-share { font-size: 14px; padding: 6px 12px; border-radius: 8px; box-shadow: inset 0 0 0 1px var(--line); }
.v10b-chat .ch-thread { flex: 1 1 0; min-height: 0; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; padding: 0 38px;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 60px); mask-image: linear-gradient(180deg, transparent 0, #000 60px); }
.v10b-chat .ch-col { display: flex; flex-direction: column; gap: 14px; padding-bottom: 14px; }
.v10b-chat [data-ag] { display: none; }
.v10b-chat [data-ag].is-in { display: block; animation: v10b-in .45s var(--ease-out) both; }
.v10b-chat .ch-tool[data-ag].is-in { display: flex; }
@keyframes v10b-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.v10b-chat .ch-user { align-self: flex-end; max-width: 82%; padding: 11px 15px; border-radius: var(--ur); background: var(--ub); line-height: 1.45; }
.v10b-chat .ch-tool { align-items: center; gap: 10px; padding: 9px 12px; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--line); font-size: 14px; color: var(--mute); }
.v10b-chat .ch-tool b { font-weight: 500; color: var(--ink); }
.v10b-chat .ch-e { width: 20px; height: 20px; border-radius: 5px; display: grid; place-items: center; background: #3A1E3C; color: #FFFFFF; font-family: var(--serif); font-size: 12px; font-style: normal; }
.v10b-chat .ch-say { line-height: 1.55; }
.v10b-chat .ch-say b { font-weight: 500; }
.v10b-chat .ch-link { text-decoration: underline; text-underline-offset: 3px; }
.v10b-chat .ch-compose { flex: none; padding: 6px 38px 22px; }
.v10b-chat .ch-box { padding: 14px 14px 12px; border-radius: var(--box); background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); }
.v10b-chat .ch-ph { min-height: 22px; color: var(--mute); }
.v10b-chat .ch-ph.is-typing { color: var(--ink); }
.v10b-chat .ch-row { margin-top: 12px; display: flex; align-items: center; gap: 12px; }
.v10b-chat .ch-btn { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; box-shadow: inset 0 0 0 1px var(--line); }
.v10b-chat .ch-btn svg { width: 14px; height: 14px; }
.v10b-chat .ch-conn { margin-left: auto; font-size: 14px; color: var(--mute); }
.v10b-chat .ch-send { width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; background: var(--send); color: #FFFFFF; transition: background-color .4s var(--ease-out), border-radius .4s var(--ease-out); }
.v10b-chat .ch-send svg { width: 15px; height: 15px; }
/* Claude: warm paper, the reply set in a serif */
.v10b-chat[data-agent="claude"] .ch-say { font-family: var(--serif); font-size: 17px; line-height: 1.5; }
.v10b-chat[data-agent="claude"] .ch-brand { font-family: var(--serif); font-weight: 400; font-size: 22px; }
/* ChatGPT: white, grey rail, round bubbles and a round composer */
.v10b-chat[data-agent="chatgpt"] { --bg: #FFFFFF; --side: #F9F9F9; --line: rgba(0, 0, 0, .1); --ink: #2B2B2B; --mute: #6B6B6B; --ub: #F1F1F1; --ur: 20px; --send: #3A3A3A; --box: 26px; }
.v10b-chat[data-agent="chatgpt"] .ch-send { border-radius: 50%; }
.v10b-chat[data-agent="chatgpt"] .ch-share { box-shadow: none; }
/* Codex: a task view */
.v10b-chat[data-agent="codex"] { --bg: #FFFFFF; --side: #FFFFFF; --line: rgba(0, 0, 0, .1); --ink: #262626; --mute: #6B6B6B; --ub: #F5F5F5; --ur: 12px; --send: #3A3A3A; --box: 14px; }
.v10b-chat[data-agent="codex"] .ch-user { align-self: stretch; max-width: none; }
.v10b-chat[data-agent="codex"] .ch-send { border-radius: 50%; }
/* Cursor: an editor's agent panel */
.v10b-chat[data-agent="cursor"] { --bg: #FCFCFC; --side: #F3F3F3; --line: rgba(0, 0, 0, .12); --ink: #1F1F1F; --mute: #666666; --ub: #FFFFFF; --ur: 8px; --send: #4A4A4A; --box: 10px; grid-template-columns: 190px minmax(0, 1fr); }
.v10b-chat[data-agent="cursor"] .ch-user { box-shadow: inset 0 0 0 1px var(--line); align-self: stretch; max-width: none; }
.v10b-chat[data-agent="cursor"] .ch-top { border-bottom: 1px solid var(--line); }
.v10b-chat[data-agent="cursor"] .ch-say { font-size: 15px; }

/* ---------- In conversation (9C's device, on white, more room) ---------- */
.v10b-talk { padding-block: max(140px, calc(var(--vw) * 11)) max(120px, calc(var(--vw) * 9)); }
.v10b-talk-head { text-align: center; max-width: 1100px; margin-inline: auto; }
.v10b-talk-h { margin-top: 16px; font-family: var(--serif); font-weight: 400; font-size: max(34px, min(calc(var(--vw) * 3.4), 60px)); line-height: 1.08; letter-spacing: -.02em; color: var(--plum); text-wrap: balance; }
.v10b-talk-p { margin: 22px auto 0; max-width: 34em; font-size: max(17px, min(calc(var(--vw) * 1.3), 20px)); line-height: 1.5; color: #4F3B52; text-wrap: balance; }
.v10b-exs { margin-top: max(96px, calc(var(--vw) * 8)); display: grid; gap: max(80px, calc(var(--vw) * 6.4)); }
.v10b-talk .v10-ex-q { font-size: max(30px, min(calc(var(--vw) * 3), 52px)); line-height: 1.08; }
.v10b-talk .v10-ex-lead { font-size: max(22px, min(calc(var(--vw) * 1.7), 30px)); }
.v10b-talk-more { margin-top: max(80px, calc(var(--vw) * 6)); text-align: center; }
.v10b-story { display: inline-flex; align-items: center; gap: 8px; height: 52px; padding: 0 26px; border-radius: 999px; box-shadow: inset 0 0 0 1px rgba(58, 30, 60, .22); font-size: 17px; color: var(--plum); transition: background-color .25s var(--ease-out); }
.v10b-story:hover { background: var(--plane); }
.v10b-story svg { width: 14px; height: 14px; }

/* ---------- Pricing: 8R's design, the real plans ---------- */
.v10b-price { padding-top: max(40px, calc(var(--vw) * 3)); }
.v10b-h2 { font-family: var(--serif); font-weight: 400; font-size: max(38px, min(calc(var(--vw) * 4), 72px)); line-height: 1.04; letter-spacing: -.025em; color: var(--plum); text-wrap: balance; max-width: 14em; margin-inline: auto; }
.v10b-lede { margin: 22px auto 0; max-width: 34em; font-size: var(--fs-lede); line-height: 1.5; color: #4F3B52; text-wrap: pretty; }
.v8d-price-head { text-align: center; }
.v8d-plans { margin-top: max(48px, calc(var(--vw) * 4.4)); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--gap); max-width: var(--vis-max); }
.v8d-plan { display: flex; flex-direction: column; padding: 40px 40px 38px; border-radius: 28px; color: var(--plum); }
.v8d-plan--free { background: var(--plane); }
.v8d-plan--paid { background: linear-gradient(in oklab 160deg, #DCD6F8 0%, #EEDCEB 52%, #FBE6D9 100%); }
.v8d-plan-top { display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 44px; }
.v8d-plan-name { font-family: var(--serif); font-size: 32px; line-height: 1.1; letter-spacing: -.01em; }
.v8d-seats { font-size: 15px; color: #4F3B52; }
.v8d-seats b { font-weight: 500; color: var(--plum); }
.v8d-plan-price { margin-top: 22px; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.v8d-plan-price .amt { font-family: var(--serif); font-weight: 400; font-size: 88px; line-height: 1; letter-spacing: -.03em; }
.v8d-plan-price .per { font-size: 17px; color: #4F3B52; }
.v10b-plan-who { margin-top: 18px; font-size: 16px; font-weight: 500; }
.v8d-incl { margin: 20px 0 34px; padding: 18px 0 0; list-style: none; display: grid; gap: 12px; font-size: 17px; line-height: 1.45; border-top: 1px solid rgba(58, 30, 60, .12); }
.v8d-incl li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 12px; align-items: start; }
.v8d-incl svg { width: 18px; height: 18px; margin-top: 3px; color: var(--plum); }
.v8d-plan .btn { margin-top: auto; align-self: flex-start; }
.v10b-bill { display: inline-flex; padding: 4px; border-radius: 999px; background: #FFFFFF; }
.v10b-bill button { min-width: 84px; height: 36px; padding: 0 14px; border: 0; border-radius: 999px; background: transparent; font: 400 15px/1 var(--sans); color: #5E4A60; cursor: pointer; transition: background-color .25s var(--ease-out), color .25s var(--ease-out); }
.v10b-bill button[aria-checked="true"] { background: var(--plum); color: #FFFFFF; }
.v10b-bill button:focus-visible { outline: 2px solid #8F83D6; outline-offset: 2px; }

/* ---------- FAQ: more room ---------- */
.v10b-faq .v9e-field { padding: max(110px, calc(var(--vw) * 9)) max(40px, calc(var(--vw) * 6)); }
.v10b-faq .v10-faq-in { max-width: 1240px; margin-inline: auto; width: 100%; column-gap: max(56px, calc(var(--vw) * 7)); }
.v10b-faq-p { margin-top: 22px; font-size: 17px; line-height: 1.5; color: #4F3B52; }
.v10b-faq .v10-faq-card { padding: 14px 44px; }
.v10b-faq .faq-card .qa h3 button { padding-block: 30px; }
.v10b-faq .faq-card .qa-a p { padding-bottom: 30px; max-width: 36em; }
.v10b-close-t { margin-top: 20px; font-size: 15px; line-height: 1.5; color: #5E4A60; text-align: center; }

/* ---------- narrow screens: nothing breaks, nothing scrolls sideways ---------- */
@media (max-width: 900px) {
  .v10-split, .v10-split--l { grid-template-columns: minmax(0, 1fr); row-gap: 32px; }
  .v10-split--l .v9e-head { order: 0; }
  .v10-split .v9e-head { max-width: none; }
  .v8d-plans, .v10-faq-in, .v10b-faq .v10-faq-in { grid-template-columns: minmax(0, 1fr); row-gap: 32px; }
  .v10-ex { grid-template-columns: minmax(0, 1fr); row-gap: 14px; }
  .v8d-plan { padding: 28px 24px; }
  .v8d-plan-top { flex-wrap: wrap; }
  .v8d-plan-price .amt { font-size: 64px; }
  .v10b-faq .v9e-field { padding: 56px 20px; }
  .v10b-faq .v10-faq-card { padding: 4px 20px; }
  .v9e-field { padding-inline: 20px; }
  .v9e-pp { right: 14px; bottom: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .v10b-copied, .v9b-prev .rv-cont, .v9b-prev .ka-ballot span, .v10b-chat, .v10b-chat .ch-send, .v10b-mres .ka-ans .ka-tiles i { transition: none; }
  .v10b-chat [data-ag].is-in { animation: none; }
}
.v10b-mres .ka-ans { transition: background-color .5s var(--ease-out); border-radius: 10px; }
.v10b-mres .ka-ans.is-new { background: #F3EFFA; box-shadow: 0 0 0 8px #F3EFFA; }
.v10b-mres .ka-ans .ka-tiles i:not(.p):not(.k) { background: #ECE8EE; }
.v10b-fs { position: relative; }
.v10b-fs .v10b-copied { left: auto; right: 24px; top: 68px; bottom: auto; transform: translateY(-6px); }
.v10b-fs .v10b-copied.is-on { transform: none; }
.v10b-fs .v10b-copied { top: 13px; right: 216px; height: 38px; padding: 0 16px; font-size: 14px; }
.v10b-faq { margin-top: max(80px, calc(var(--vw) * 7)); }
/* ===================================== home v10c (2 Nov 2026): the argument ===================================== */
.v10c-vs { padding-block: max(140px, calc(var(--vw) * 11)) max(120px, calc(var(--vw) * 9)); }
.v10c-kick { text-align: center; }
.v10c-ex { margin-top: max(48px, calc(var(--vw) * 4)); display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); column-gap: max(40px, calc(var(--vw) * 4)); align-items: start; }
.v10c-q { font-family: var(--serif); font-weight: 400; font-size: max(36px, min(calc(var(--vw) * 4), 72px)); line-height: 1.04; letter-spacing: -.025em; color: var(--plum); text-wrap: balance; }
.v10c-lead { font-family: var(--serif); font-size: max(24px, min(calc(var(--vw) * 1.9), 34px)); line-height: 1.2; letter-spacing: -.01em; color: var(--plum); text-wrap: balance; }
.v10c-p { margin-top: 16px; font-size: max(17px, min(calc(var(--vw) * 1.3), 20px)); line-height: 1.55; color: #4F3B52; max-width: 32em; text-wrap: pretty; }
.v10c-claim { margin-top: max(96px, calc(var(--vw) * 8)); text-align: center; font-family: var(--serif); font-weight: 400; font-size: max(34px, min(calc(var(--vw) * 4.4), 80px)); line-height: 1.06; letter-spacing: -.028em; color: var(--plum); }
.v10c-claim span { display: block; }
.v10c-claim span:last-child { color: #5B478B; }
.v10c-case { margin: max(56px, calc(var(--vw) * 4.4)) auto 0; max-width: var(--vis-max); display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--gap); }
.v10c-cost, .v10c-carry { border-radius: 28px; padding: max(28px, calc(var(--vw) * 2.8)); }
.v10c-cost { background: var(--plane); }
.v10c-carry { background: linear-gradient(in oklab 160deg, #DCD6F8 0%, #EEDCEB 52%, #FBE6D9 100%); }
.v10c-h { font-family: var(--serif); font-size: 30px; line-height: 1.1; letter-spacing: -.01em; color: var(--plum); }
.v10c-g { margin-top: 30px; font-size: 15px; font-weight: 500; color: #4F3B52; }
.v10c-bar { margin-top: 14px; display: grid; grid-template-columns: 150px minmax(0, 1fr); column-gap: 18px; row-gap: 4px; align-items: center; }
.v10c-bar-n { font-size: 16px; color: #4F3B52; white-space: nowrap; }
.v10c-bar-n b { font-weight: 500; color: var(--plum); }
.v10c-bar-t { position: relative; display: flex; align-items: center; gap: 12px; min-width: 0; height: 30px; }
.v10c-bar-t i { display: block; height: 100%; width: calc(var(--w) * 78%); border-radius: 6px; background: #C8C2F0; transform-origin: 0 50%; }
.v10c-bar.is-us .v10c-bar-t i { background: var(--plum); }
.v10c-bar-v { font-family: var(--serif); font-weight: 400; font-size: 26px; line-height: 1; color: var(--plum); }
.v10c-bar-s { grid-column: 2; font-size: 14px; line-height: 1.4; color: #5E4A60; }
.v10c-src { margin-top: 30px; padding-top: 16px; border-top: 1px solid rgba(58, 30, 60, .12); font-size: 14px; line-height: 1.5; color: #5E4A60; }
.v10c-cl { margin: 22px 0 0; padding: 0; list-style: none; display: grid; gap: 20px; }
.v10c-cl li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 16px; align-items: start; }
.v10c-ci { width: 44px; height: 44px; border-radius: 12px; background: rgba(255, 255, 255, .72); display: grid; place-items: center; }
.v10c-e { width: 24px; height: 24px; border-radius: 6px; display: grid; place-items: center; background: var(--plum); color: #FFFFFF; font-family: var(--serif); font-size: 14px; font-style: normal; }
.v10c-ct { display: grid; gap: 3px; padding-top: 2px; }
.v10c-ct b { font-size: 17px; font-weight: 500; color: var(--plum); }
.v10c-ct span { font-size: 16px; line-height: 1.45; color: #4F3B52; }
/* the pill: a real border and no underline, so it captures cleanly */
.v10c-story, .v10c-story:hover { text-decoration: none; box-shadow: none; border: 1px solid rgba(58, 30, 60, .24); }
@media (max-width: 900px) {
  .v10c-ex, .v10c-case { grid-template-columns: minmax(0, 1fr); row-gap: 20px; }
  .v10c-bar { grid-template-columns: minmax(0, 1fr); }
  .v10c-bar-s { grid-column: 1; }
  .v10c-cost, .v10c-carry { padding: 26px 22px; }
}
/* ===================================== home v10d (2 Nov 2026) ===================================== */
/* ---------- Agents: the word is a picker (the hero's underline + caret) ---------- */
.v10d-agpk-wrap { position: relative; display: inline-block; }
.v10d-agpk { font: inherit; letter-spacing: inherit; line-height: inherit; color: #5B478B; background: none; border: 0; padding: 0; cursor: pointer; display: inline-flex; align-items: baseline; }
.v10d-agpk .v10b-agw { padding-bottom: .2em; margin-bottom: -.2em; }
.v10d-agpk .v10b-agw-in { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .12em; text-decoration-color: rgba(91, 71, 139, .45); transition: text-decoration-color .25s var(--ease-out); }
.v10d-agpk:hover .v10b-agw-in, .v10d-agpk[aria-expanded="true"] .v10b-agw-in { text-decoration-color: var(--plum); }
.v10d-agpk:hover, .v10d-agpk[aria-expanded="true"] { color: var(--plum); }
.v10d-agpk .hx-chev { width: .3em; height: .3em; margin-left: .08em; align-self: center; transition: transform .3s var(--ease-out); }
.v10d-agpk[aria-expanded="true"] .hx-chev { transform: rotate(180deg); }
.v10d-agpk:focus-visible { outline: 2px solid #8F83D6; outline-offset: 6px; border-radius: 8px; }
.v10d-aglist { position: absolute; z-index: 40; left: 50%; top: calc(100% + 14px); transform: translateX(-50%); min-width: 280px; padding: 20px 14px 14px; border-radius: 22px; background: #FFFFFF;
  box-shadow: inset 0 0 0 1px rgba(58, 30, 60, .1); text-align: left; letter-spacing: normal; }
.v10d-aglist[hidden] { display: none; }
.v10d-aglist-h { display: block; padding: 0 14px 10px; font: 400 15px/1.4 var(--sans); color: #5E4A60; }
.v10d-aglist ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.v10d-aglist li { padding: 10px 14px; border-radius: 14px; font: 400 26px/1.15 var(--serif); letter-spacing: -.01em; color: var(--plum); cursor: pointer; transition: background-color .2s var(--ease-out); }
.v10d-aglist li:hover, .v10d-aglist li:focus-visible { background: #F3F0FA; outline: none; }
.v10d-aglist li[aria-selected="true"] { color: #5B478B; background: #F1EEFB; }

/* ---------- Agents: the tool calls the agent makes in Encore (8M), visible in every surface ---------- */
.v10b-chat .ch-tools[data-ag].is-in { display: block; }
.v10b-chat .ch-tools { border-radius: 12px; box-shadow: inset 0 0 0 1px var(--line); padding: 10px 12px 8px; font-size: 14px; color: var(--mute); }
.v10b-chat .ch-tools-h { display: flex; align-items: center; gap: 10px; }
.v10b-chat .ch-tools-h b { font-weight: 500; color: var(--ink); }
.v10b-chat .ch-tools-h span { margin-left: auto; }
.v10b-chat .ch-tl { margin: 8px 0 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.v10b-chat .ch-tl li { display: grid; grid-template-columns: auto minmax(0, 1fr) 16px; gap: 10px; align-items: center; padding: 5px 8px; border-radius: 8px; background: rgba(0, 0, 0, .025); }
.v10b-chat .ch-tl li[data-tc]:not(.is-in) { display: none; }
.v10b-chat .ch-tl li.is-in { animation: v10b-in .35s var(--ease-out) both; }
.v10b-chat .ch-tn { font-weight: 500; color: var(--ink); }
.v10b-chat .ch-td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v10b-chat .ch-ok { width: 16px; height: 16px; color: #2E6B4E; opacity: 0; transition: opacity .25s var(--ease-out); }
.v10b-chat .ch-ok svg { width: 16px; height: 16px; display: block; }
.v10b-chat .ch-tl li.is-done .ch-ok { opacity: 1; }
.v10b-chat .ch-col { gap: 12px; }

/* ---------- Our story, then the argument ---------- */
.v10d-story { text-align: center; max-width: 1100px; margin-inline: auto; }
.v10d-story-h { margin-top: 16px; font-family: var(--serif); font-weight: 400; font-size: max(36px, min(calc(var(--vw) * 4.2), 76px)); line-height: 1.04; letter-spacing: -.026em; color: var(--plum); text-wrap: balance; }
.v10d-story-p { margin: 24px auto 0; max-width: 30em; font-size: max(18px, min(calc(var(--vw) * 1.45), 24px)); line-height: 1.45; color: #4F3B52; text-wrap: balance; }
.v10d-story-more { margin-top: 34px; }
.v10d-ex { margin-top: max(120px, calc(var(--vw) * 10)); }
.v10d-ex .v10c-q { font-size: max(32px, min(calc(var(--vw) * 3.4), 60px)); }
.v10d-claim { font-size: max(34px, min(calc(var(--vw) * 4), 72px)); max-width: 15em; margin-inline: auto; text-wrap: balance; color: var(--plum); }

/* ---------- Pricing: the founding stair, built from the brand's pixel steps (PROPOSAL) ---------- */
.v10d-stair { margin: 26px 0 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; align-items: end; }
.v10d-step { display: grid; gap: 6px; align-content: end; }
.v10d-blocks { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3px; margin-bottom: 6px; }
.v10d-b { display: block; aspect-ratio: 1; border-radius: 2px; }
.v10d-b--0 { background: #3A1E3C; } .v10d-b--1 { background: #7D70CB; } .v10d-b--2 { background: #A99FE0; } .v10d-b--3 { background: #C8C2F0; }
.v10d-step > b { font-size: 18px; font-weight: 500; line-height: 1.2; color: #4F3B52; }
.v10d-step > b small { font-size: 14px; font-weight: 400; }
.v10d-step.is-now > b { color: var(--plum); }
.v10d-step > span:not(.v10d-blocks) { font-size: 14px; line-height: 1.3; color: #4F3B52; }
.v10d-solo .v10b-plan-who { margin-top: 22px; }
@media (max-width: 900px) { .v10d-stair { gap: 6px; } .v10d-aglist li { font-size: 22px; } }

/* ===================================== home v10e (2 Nov 2026) ===================================== */
.v10e-story { margin: 0 auto; max-width: 1080px; text-align: center; }
.v10e-story blockquote { margin: 0; }
.v10e-story-h { margin-top: 18px; font-family: var(--serif); font-weight: 400; font-size: max(32px, min(calc(var(--vw) * 3.6), 64px)); line-height: 1.08; letter-spacing: -.022em; color: var(--plum); text-wrap: balance; }
.v10e-story-p { margin: 28px auto 0; max-width: 34em; font-size: max(18px, min(calc(var(--vw) * 1.4), 23px)); line-height: 1.5; color: #4F3B52; text-wrap: pretty; }
.v10e-by { margin-top: 22px; font-size: 16px; color: #5E4A60; }
.v10e-case { margin: max(56px, calc(var(--vw) * 4.4)) auto 0; max-width: 760px; }
/* pricing, simplified: two calm cards, lots of air */
.v10e-price { padding-bottom: max(80px, calc(var(--vw) * 6)); }
.v10e-plans { max-width: 980px; margin-top: max(56px, calc(var(--vw) * 5)); gap: max(20px, calc(var(--vw) * 2)); }
.v10e-plan { padding: max(36px, calc(var(--vw) * 3.4)); }
.v10e-plan .v8d-plan-price { margin-top: 26px; }
.v10e-line { margin-top: 16px; font-size: 17px; line-height: 1.5; color: #4F3B52; min-height: 3em; }
.v10e-plan .v8d-incl { margin: 26px 0 40px; border-top: 0; padding-top: 0; gap: 14px; }
.v10e-found { display: block; margin-top: 4px; font-size: 15px; color: #5B478B; }

/* ===================================== home v10f (2 Nov 2026): 8P's pricing, lifted ===================================== */
.v10f-out { margin: 26px auto 0; max-width: 26em; font-family: var(--serif); font-size: max(22px, min(calc(var(--vw) * 1.8), 32px)); line-height: 1.25; letter-spacing: -.01em; color: var(--plum); text-wrap: balance; }
.z-h { font-family: var(--serif); font-weight: 400; font-size: max(36px, calc(var(--vw) * 3)); line-height: 1.08; letter-spacing: -.02em; color: var(--plum); text-wrap: balance; }
.z-price { padding: max(110px, calc(var(--vw) * 9)) 0 max(110px, calc(var(--vw) * 9)); }
.z-price-head { text-align: center; }
.z-plans { margin-top: max(44px, calc(var(--vw) * 3.6)); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: var(--gap); max-width: 1120px; }
.z-plan { display: flex; flex-direction: column; padding: 34px 34px 32px; border-radius: 28px; color: var(--plum); }
.z-plan--free { background: var(--plane); }
.z-plan--paid { background: linear-gradient(in oklab 160deg, #DCD6F8 0%, #EEDCEB 52%, #FBE6D9 100%); }
.z-plan-top { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.z-plan-name { font-family: var(--serif); font-size: 30px; line-height: 1.1; letter-spacing: -.01em; }
.z-seats { font-size: 15px; color: #4F3B52; }
.z-seats b { font-weight: 500; color: var(--plum); }
.z-plan-price { margin-top: 22px; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.z-plan-price .amt { font-family: var(--serif); font-weight: 400; font-size: 88px; line-height: 1; letter-spacing: -.03em; }
.z-plan-price .per { font-size: 17px; color: #4F3B52; }
.z-ladder { margin: 26px 0 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.z-rung { display: grid; gap: 8px; }
.z-tile { display: block; height: 14px; border-radius: 3px; }
.z-tile--0 { background: #3A1E3C; }
.z-tile--1 { background: #7D70CB; }
.z-tile--2 { background: #A99FE0; }
.z-tile--3 { background: #C8C2F0; }
.z-rung-p { font-size: 18px; font-weight: 500; line-height: 1.2; }
.z-rung-p small { font-size: 14px; font-weight: 400; color: #4F3B52; }
.z-rung-l { font-size: 14px; line-height: 1.3; color: #4F3B52; }
.z-rung:not(.is-now) .z-rung-p { color: #4F3B52; }
.z-incl { margin: 24px 0 28px; padding: 0; list-style: none; display: grid; gap: 12px; font-size: 17px; line-height: 1.45; }
.z-incl li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 12px; align-items: start; }
.z-incl svg { width: 18px; height: 18px; margin-top: 3px; color: var(--plum); }
.z-plan .btn { margin-top: auto; align-self: flex-start; }
.v10f-teams { margin-top: 32px; text-align: center; font-size: 17px; line-height: 1.5; color: #4F3B52; }
.v10f-teams a { color: var(--plum); text-decoration: underline; text-decoration-color: rgba(58, 30, 60, .35); text-underline-offset: 4px; }
.v10f-teams a:hover { text-decoration-color: var(--plum); }
.z-price + .v10b-faq { margin-top: 0; }
@media (max-width: 900px) { .z-plans { grid-template-columns: minmax(0, 1fr); } .z-plan { padding: 28px 24px; } .z-plan-top { flex-wrap: wrap; } .z-plan-price .amt { font-size: 64px; } }
.v10f-page .v10e-vs { padding-bottom: max(40px, calc(var(--vw) * 3)); }

/* still tier: the reduced-motion rules above */
html.mo-still .v9e-chat .kc-col > [data-ag],html.mo-still .v9e-agflow [data-ag-flow],html.mo-still .v9e-to,html.mo-still .v9e-fan-svg path,html.mo-still .v9e-res .ka-ans .ka-tiles i{transition: none;}html.mo-still .v9e-chat .kc-ph.is-typing::after{animation: none;}html.mo-still .v9e-pp{display: none;}
html.mo-still .v10-send-link,html.mo-still .v10-person,html.mo-still .v10-person .line i,html.mo-still .v10-form .rv-cont,html.mo-still .v10-mb .rv-scale span,html.mo-still .v10-mb .rv-chips span{transition: none;}html.mo-still .v8h-text.is-typing .v8h-caret{animation: none;}
html.mo-still .v10b-copied,html.mo-still .v9b-prev .rv-cont,html.mo-still .v9b-prev .ka-ballot span,html.mo-still .v10b-chat,html.mo-still .v10b-chat .ch-send,html.mo-still .v10b-mres .ka-ans .ka-tiles i{transition: none;}html.mo-still .v10b-chat [data-ag].is-in{animation: none;}