/* Reference direction: immersive opening, product-led scenes, scroll narrative. */
:root { --studio-dark:#071f17; --studio-lime:#b6f36b; --studio-paper:#f7f8f2; }
.topbar { background:var(--studio-lime); color:#142d20; font-size:12px; }
.nav { background:rgba(7,31,23,.97); border-bottom:1px solid #ffffff18; }
.nav .logo { background:transparent; padding-left:0; }
.nav .nav-links a,.nav .btn-ghost { color:#e1eddf; }
.nav .btn-ghost { border-color:#ffffff35; }
.nav-toggle span { background:#e7f5e5; }
.btn { border-radius:100px; gap:16px; }
.btn-primary { background:var(--studio-lime); border-color:var(--studio-lime); color:#16301d; }
.btn-primary:hover { background:#cbff8f; }
.btn span[aria-hidden] { font-size:22px; line-height:1; }
.launch-hero { background:var(--studio-dark); color:#f5f8ef; padding:72px 0 32px; overflow:clip; }
.launch-grid { display:block; perspective:1800px; position:relative; z-index:1; }
.launch-hero .hero-copy { text-align:center; position:relative; z-index:2; animation:none; }
.eyebrow { display:inline-flex; gap:10px; align-items:center; font-size:11px; line-height:1.5; font-weight:600; letter-spacing:.13em; margin-bottom:23px; }
.eyebrow i,.live-badge i { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--studio-lime); }
.launch-hero .eyebrow { color:#c3d2bf; }
.launch-hero h1 { max-width:1000px; margin:0 auto; font-size:clamp(52px,6.9vw,94px); font-weight:600; line-height:1.04; letter-spacing:-.064em; }
.launch-hero h1 span { color:var(--studio-lime); display:inline-block; }
.launch-hero .lead { max-width:650px; margin:25px auto 27px; color:#bbcdc2; font-size:17px; line-height:1.65; }
.launch-hero .hero-cta { justify-content:center; margin-bottom:56px; }
.launch-hero .btn-ghost { color:#edf4e9; border-color:#ffffff38; }
.hero-orbits { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.hero-orbits i { position:absolute; display:block; border:1px solid #b6f36b14; border-radius:50%; width:1100px; height:1100px; left:calc(50% - 550px); top:90px; }
.hero-orbits i:nth-child(2) { width:1400px; height:1400px; left:calc(50% - 700px); top:-60px; }
.hero-orbits i:nth-child(3) { width:1700px; height:1700px; left:calc(50% - 850px); top:-210px; }
.product-scene { padding:0; border-radius:15px; border:1px solid #62816d; background:#f5f7f3; color:#203b2b; box-shadow:0 35px 80px #0005; transform:none; animation:studio-arrive .9s cubic-bezier(.16,1,.3,1) both; }
.product-scene::before,.product-scene::after { display:none; }
.scene-top { padding:17px 22px; margin:0; border-bottom:1px solid #d9e3dc; background:#fff; border-radius:15px 15px 0 0; }
.scene-brand { display:flex; gap:10px; align-items:center; }
.scene-brand strong { font-size:16px; color:#183c28; letter-spacing:-.04em; }
.scene-brand > span { color:#728578; font-size:11px; margin-left:12px; }
.live-badge { font-size:10px; display:flex; align-items:center; gap:6px; color:#58705f; }
.live-badge i { background:#20a661; }
.workspace-demo { display:grid; grid-template-columns:25% 46% 29%; min-height:370px; }
.demo-inbox { border-right:1px solid #d9e3dc; background:#fff; padding:20px 14px; }
.inbox-title { display:flex; align-items:center; justify-content:space-between; font-size:13px; font-weight:700; margin-bottom:17px; }
.inbox-title > span { font-size:11px; color:#6f8172; }
.demo-search { font-size:11px; color:#8c978e; background:#f5f7f3; padding:10px; border-radius:7px; margin-bottom:15px; }
.inbox-person { display:flex; align-items:center; gap:9px; padding:13px 8px; border-bottom:1px solid #edf0eb; position:relative; }
.inbox-person > div { min-width:0; }
.inbox-person.selected { border-radius:8px; background:#eaf5e8; border-color:transparent; }
.inbox-person strong { font-size:10px; display:block; font-weight:600; }
.inbox-person small { font-size:9px; color:#738376; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:5px; }
.inbox-person .avatar { flex-shrink:0; width:30px; height:30px; font-size:11px; }
.inbox-person i { width:5px; height:5px; background:#19aa60; border-radius:50%; position:absolute; right:7px; top:10px; }
.avatar.sand { background:#f2ebd9; }.avatar.violet { background:#e9e6f4; }
.inbox-team { margin-top:24px; padding:0 8px; }
.inbox-team > span { color:#738376; font-size:10px; display:block; }
.inbox-team > strong { font-size:11px; display:block; margin:5px 0 12px; }
.team-avatars { display:flex; align-items:center; padding-left:3px; }
.team-avatars i { width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:#e7ecdf; font:normal 9px Inter,sans-serif; margin-left:-3px; border:2px solid white; }
.team-avatars small { color:#728578; font-size:9px; margin-left:8px; }
.scene-window,.motion-running .scene-window { transform:none; animation:none; border:0; border-radius:0; display:flex; flex-direction:column; }
.window-bar { min-height:68px; padding:12px 18px; }
.window-menu { margin-left:auto; font-size:20px; }
.chat-space { padding:22px 24px 16px; min-height:265px; flex:1; background:#f1f5ee; }
.chat-day { display:block; font-size:8px; letter-spacing:.07em; text-align:center; color:#758775; margin-bottom:20px; }
.bubble { font-size:12px; max-width:90%; margin-bottom:15px; box-shadow:0 2px 2px #13291704; }
.bubble small { display:block; text-align:right; font-size:8px; color:#93a092; margin-top:5px; }
#demoReply { min-height:61px; background:#d8f5bc; }
#demoTask { font-size:10px; min-height:30px; }
.demo-compose { border-top:1px solid #e3eae5; display:flex; justify-content:space-between; align-items:center; padding:15px 20px; color:#81917f; font-size:10px; }
.demo-compose > span:last-child { font-size:20px; color:#218b4a; }
.demo-crm { padding:22px 18px; background:#fbfcf8; border-left:1px solid #d9e3dc; }
.demo-crm > p { font-size:11px; color:#738376; margin:-7px 0 22px; }
.deal-card { background:#173e2a; margin:0; min-height:93px; padding:16px; gap:10px; }
.deal-card strong { display:block; font-size:14px; margin-top:5px; }
.deal-card small { font-size:9px; }
.deal-path { display:flex; gap:5px; margin:14px 0 24px; }
.deal-path i { display:block; flex:1; height:4px; border-radius:5px; background:#dfe9d8; transition:background-color .3s; }
.deal-path i.active { background:#79bb43; }
.deal-detail { display:grid; gap:6px; }
.deal-detail small { font-size:8px; letter-spacing:.05em; color:#7c8a7c; margin-top:7px; }
.deal-detail strong { font-size:11px; font-weight:500; }
.context-badge { display:flex; align-items:center; gap:8px; color:#527553; font-size:9px; margin-top:24px; }
.context-badge span { width:20px; height:20px; border-radius:50%; background:#eaf4e0; display:grid; place-items:center; }
.demo-footer { display:flex; align-items:center; gap:20px; padding:12px 18px; border-top:1px solid #d9e3dc; padding-right:230px; min-height:64px; }
.demo-footer > span { font-size:10px; color:#6a7e6b; }
.demo-controls { margin:0; flex:1; gap:4px; }
.demo-controls button { font-size:10px; padding:11px 8px; border-radius:6px; }
.motion-toggle { position:absolute; bottom:15px; right:18px; margin:0; border-color:#cbd9c5; font-size:10px; }
.explore-cue { display:flex; justify-content:center; align-items:center; gap:14px; margin:28px auto 0; font-size:11px; color:#b9c9ba; }
.explore-cue span { font-size:20px; }
.platform-ribbon { display:flex; justify-content:center; align-items:center; gap:38px; padding:28px 24px; background:var(--studio-lime); color:#133b25; }
.platform-ribbon > span { font-size:11px; }.platform-ribbon strong { font-family:Sora,sans-serif; font-size:18px; letter-spacing:-.035em; }.platform-ribbon i { font-size:23px; font-style:normal; color:#487c36; }
.product-story { background:var(--studio-paper); padding:110px 0 75px; border:0; }
.product-story .section-heading { max-width:780px; margin-bottom:60px; }
.section-heading h2 { font-size:clamp(36px,4.4vw,60px); font-weight:600; line-height:1.12; }
.muted-heading { color:#7f9783; }
.product-story .eyebrow { color:#54725c; margin-bottom:20px; }
.journey-layout { display:grid; grid-template-columns:43% 57%; gap:0; align-items:start; }
.journey-copy { padding-right:55px; }
.journey-step { min-height:510px; display:flex; flex-direction:column; justify-content:center; padding:35px 0 60px; border-bottom:1px solid #dde4d9; }
.journey-step:last-child { border:0; }
.step-index { font-size:11px; color:#628167; letter-spacing:.1em; margin-bottom:20px; }
.journey-step h3 { font-size:30px; font-weight:600; line-height:1.2; letter-spacing:-.05em; margin-bottom:20px; }
.journey-step p { color:#627563; font-size:15px; line-height:1.8; }
.journey-step ul { padding:0; list-style:none; margin:22px 0; }
.journey-step li { font-size:12px; color:#486149; margin:10px 0; }
.journey-step li::before { content:'↗'; margin-right:10px; color:#308d45; }
.journey-step a { align-self:start; font-size:13px; font-weight:600; border-bottom:1px solid #9aac97; padding-bottom:7px; }
.journey-step a span { margin-left:12px; }
.journey-sticky { position:sticky; top:115px; padding-top:25px; }
.journey-tabs { display:flex; gap:4px; padding:5px; border:1px solid #dce6d6; border-radius:100px; width:max-content; max-width:100%; margin-bottom:18px; }
.journey-tabs button { background:transparent; border:0; padding:10px 17px; font:500 11px Inter,sans-serif; color:#5a7259; border-radius:100px; cursor:pointer; }
.journey-tabs button[aria-pressed=true] { background:#183d29; color:#eafaeb; }
.journey-screen { background:#e8eee2; border:1px solid #d6dfce; border-radius:22px; padding:26px; min-height:400px; overflow:hidden; position:relative; }
.journey-panel { background:#fff; border:1px solid #dfe8d8; border-radius:14px; min-height:346px; overflow:hidden; box-shadow:0 16px 40px #2040150c; }
.journey-panel[hidden] { display:none; }
.mini-top { padding:17px 18px; border-bottom:1px solid #ecf0e7; display:flex; align-items:center; gap:9px; font-size:11px; color:#385737; }
.mini-top i { font-style:normal; color:#318749; margin-left:auto; }
.handoff-people { display:flex; justify-content:center; align-items:center; gap:15px; padding:24px 25px 35px; }
.person-circle { width:44px; height:44px; display:grid; place-items:center; border-radius:50%; background:#f0ebd9; color:#716544; position:relative; font-size:17px; }
.person-circle.green { background:#dcf1cf; color:#4b7b30; }
.person-circle small { position:absolute; top:53px; font-size:8px; width:120px; text-align:center; color:#70816a; white-space:nowrap; }
.connection-track { height:1px; background:#d0e0c4; width:140px; position:relative; }
.connection-track i { position:absolute; width:7px; height:7px; background:#5bac42; border-radius:50%; top:-3px; left:0; }
.connection-track span { position:absolute; top:-17px; width:100%; text-align:center; font-size:8px; color:#789069; }
.context-message { margin:16px 20px 10px; padding:12px 15px; border:1px solid #e1e7db; border-radius:11px 11px 11px 0; max-width:85%; background:#fafbf8; }
.context-message small { font-size:7px; color:#6f846b; letter-spacing:.07em; }
.context-message p { font-size:11px; line-height:1.6; margin-top:5px; color:#375132; }
.context-message.answer { margin-left:45px; background:#e6f6d7; border-color:transparent; border-radius:11px 11px 0 11px; }
.context-bottom { display:flex; gap:15px; justify-content:center; font-size:8px; color:#5c7c4c; padding:16px 12px; }
.mini-kanban { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; padding:22px 15px; min-height:224px; background:#fafbf8; }
.mini-kanban > div > span { display:block; font-size:8px; color:#6d8162; margin-bottom:16px; }
.ghost-card { border:1px dashed #d8e3d0; background:#f1f5eb; height:68px; border-radius:7px; margin-bottom:8px; }.ghost-card.short { height:43px; }
.opportunity-card { background:white; padding:12px 10px; border:1px solid #9fc879; border-radius:8px; box-shadow:0 10px 20px #365d1215; transform:rotate(-3deg); }
.opportunity-card small { font-size:6px; color:#6b8d51; }.opportunity-card strong { display:block; font-size:11px; line-height:1.4; margin-top:8px; }.opportunity-card p { font-size:8px; color:#748768; margin:9px 0; }.opportunity-card > div { border-top:1px solid #e8eede; padding-top:8px; font-size:8px; color:#488c35; }
.task-toast { display:flex; gap:10px; align-items:center; margin:2px 16px 20px; padding:16px 12px; border-radius:9px; background:#1d432c; color:#e0f3d7; }
.task-toast > span { color:var(--studio-lime); font-size:20px; }.task-toast strong { font-size:10px; display:block; }.task-toast small { font-size:8px; color:#a5c19c; display:block; margin-top:5px; }
.knowledge-docs { display:flex; justify-content:center; gap:12px; padding:25px 10px 0; }.knowledge-docs span { border:1px solid #dce6d3; padding:12px; border-radius:7px; color:#658453; font-size:10px; }
.ai-connector { text-align:center; color:#b2cba0; font-size:24px; padding:10px; }
.draft-card { padding:18px; border:1px solid #bed0ad; margin:0 24px; border-radius:10px; background:#f8fbf4; }.draft-label { font-size:8px; letter-spacing:.05em; color:#4b8030; }.draft-card p { font-size:12px; color:#38522d; line-height:1.8; margin:12px 0; }.draft-line { height:5px; background:#e2ecd8; border-radius:4px; margin:8px 0; width:90%; }.draft-line.short { width:60%; }.review-tag { display:inline-block; font-size:8px; margin-top:10px; color:#608047; }
.journey-caption { font-size:10px; color:#809178; margin-top:14px; text-align:center; }
.journey-screen.playing[data-step="0"] .connection-track i { animation:connect-packet 2.2s ease-in-out 2; }
.journey-screen.instant-change * { animation:none!important; }
.journey-screen.playing[data-step="1"] .opportunity-card { animation:opportunity-enter .65s cubic-bezier(.16,1,.3,1) both; }
.journey-screen.playing[data-step="1"] .task-toast { animation:toast-enter .55s .3s cubic-bezier(.16,1,.3,1) backwards; }
.journey-screen.playing[data-step="2"] .draft-line { transform-origin:left; animation:line-write .8s cubic-bezier(.16,1,.3,1) both; }
.journey-screen.playing[data-step="2"] .draft-line.short { animation-delay:.15s; }
.cost-section { background:#0d2b1e; position:relative; padding:100px 0; }
.cost-section .date-note { border:1px solid #8cad7040; border-radius:100px; padding:9px 14px; color:#c9e6b0; font-size:11px; }
.cost-section .section-heading { max-width:900px; }.cost-section .section-heading h2 { font-size:clamp(36px,4.6vw,63px); }
.calculator { border-radius:22px; border:1px solid #b5c5aa; box-shadow:0 25px 80px #0002; }.calculator .results { background:#eaf3df; }.saving { color:#27552c; letter-spacing:-.065em; }.bar.mixed > span { background:#68a942; }
.carousel-section { padding:100px 0; background:#f7f8f2; }
.cost-slide { border-radius:22px; }.carousel-head h2 { font-size:clamp(32px,3.7vw,50px); font-weight:600; letter-spacing:-.05em; }
.legal-section { padding:95px 0; background:#e9eedf; }.legal-grid { gap:80px; }.legal-grid img { border-radius:22px; box-shadow:0 20px 50px #24461915; }.legal-grid h2 { font-size:clamp(32px,3.6vw,48px); letter-spacing:-.055em; font-weight:600; }
.faq-section { background:#f7f8f2; }.cta-band { background:#082418; }.contact-pitch h2 { font-size:clamp(34px,4vw,52px); font-weight:600; letter-spacing:-.05em; }
@keyframes studio-arrive { from { opacity:0; transform:translateY(60px) rotateX(7deg); } to { opacity:1; transform:translateY(0) rotateX(0); } }
@keyframes connect-packet { 0%,10% { transform:translateX(0); opacity:0; } 20% { opacity:1; } 80% { opacity:1; } 100% { transform:translateX(133px); opacity:0; } }
@keyframes opportunity-enter { from { opacity:0; transform:translateX(-75px) rotate(-6deg); } to { opacity:1; transform:translateX(0) rotate(-3deg); } }
@keyframes toast-enter { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
@keyframes line-write { from { transform:scaleX(.15); } to { transform:scaleX(1); } }
@media(hover:hover) and (pointer:fine) { .journey-tabs button:hover { background:#dae9ce; color:#294626; }.journey-tabs button[aria-pressed=true]:hover { background:#245134; }.explore-cue:hover span { transform:translateY(4px); }.explore-cue span { transition:transform .2s; } }
@media(min-width:901px) and (prefers-reduced-motion:no-preference) {
  @supports(animation-timeline:view()) {
    .product-scene { animation:studio-scroll linear both; animation-timeline:view(); animation-range:entry 0% cover 45%; }
    @keyframes studio-scroll { from { transform:translateY(45px) rotateX(9deg) scale(.94); } to { transform:translateY(0) rotateX(0) scale(1); } }
  }
}
@media(max-width:1000px) {
  .workspace-demo { grid-template-columns:23% 49% 28%; }.demo-inbox { padding:18px 9px; }.demo-crm { padding:20px 12px; }.inbox-person .avatar { display:none; }.scene-brand > span { display:none; }.demo-footer > span { display:none; }.journey-copy { padding-right:32px; }.journey-step h3 { font-size:27px; }.journey-screen { padding:16px; }.journey-tabs button { padding:10px 12px; }
}
@media(min-width:701px) {
  .journey-screen { min-height:460px; }.journey-panel { min-height:406px; }
  .mini-top { font-size:12px; }.context-message p { font-size:13px; }.context-message small { font-size:9px; }.context-bottom { font-size:10px; }
  .mini-kanban > div > span { font-size:10px; }.opportunity-card strong { font-size:14px; }.opportunity-card small { font-size:8px; }.opportunity-card p,.opportunity-card > div { font-size:10px; }
  .task-toast strong { font-size:12px; }.task-toast small { font-size:10px; }.draft-card p { font-size:14px; }.draft-label,.review-tag { font-size:10px; }
}
@media(max-width:700px) {
  .nav.open .nav-links { background:#0c2d20; }.nav-cta .btn-ghost { display:none; }
  .launch-hero { padding:46px 0 27px; }.launch-hero .eyebrow { font-size:8px; letter-spacing:.07em; margin-bottom:22px; }.launch-hero h1 { font-size:clamp(38px,10vw,60px); letter-spacing:-.06em; }.launch-hero .lead { font-size:14px; margin:22px auto; }.launch-hero .lead br { display:none; }.launch-hero .hero-cta { margin-bottom:32px; gap:10px; }.launch-hero .hero-cta .btn { font-size:12px; padding:14px 18px; width:auto; }.launch-hero .hero-cta .btn-ghost { border:0; }.hero-orbits i { opacity:.5; }
  .product-scene { margin:0; border-radius:12px; }.scene-top { padding:12px; border-radius:12px 12px 0 0; }.scene-brand strong { font-size:13px; }.scene-brand img { width:22px; }.live-badge { font-size:7px; gap:4px; }.workspace-demo { grid-template-columns:1fr; }.demo-inbox,.demo-crm { display:none; }.window-bar { min-height:60px; font-size:11px; }.chat-space { min-height:250px; padding:20px; }.chat-day { font-size:7px; }.bubble { font-size:11px; }#demoReply { min-height:68px; }.demo-compose { padding:12px 17px; font-size:8px; }.demo-footer { display:block; padding:10px 8px 48px; }.demo-controls button { font-size:9px; padding:11px 3px; }.motion-toggle { font-size:9px; bottom:12px; right:50%; transform:translateX(50%); white-space:nowrap; }.explore-cue { font-size:9px; gap:10px; }
  .platform-ribbon { padding:22px 16px; gap:13px; flex-wrap:wrap; }.platform-ribbon > span { width:100%; text-align:center; font-size:10px; }.platform-ribbon strong { font-size:13px; }.platform-ribbon i { font-size:17px; }
  .product-story { padding:60px 0 35px; }.product-story .section-heading { margin-bottom:30px; }.section-heading h2 { font-size:35px; }.section-heading p { font-size:14px; }.eyebrow { font-size:9px; }.journey-layout { display:flex; flex-direction:column; }.journey-copy { padding:0; order:2; }.journey-sticky { position:relative; top:auto; padding:0; width:100%; order:1; }.journey-tabs { margin:0 auto 15px; }.journey-tabs button { padding:10px 12px; font-size:9px; }.journey-screen { padding:12px; min-height:365px; border-radius:15px; }.journey-panel { min-height:335px; }.mini-top { font-size:9px; padding:14px 12px; }.mini-top img { width:23px; height:23px; }.handoff-people { padding:23px 12px 33px; gap:10px; }.connection-track { width:105px; }.context-message { margin:16px 12px 10px; padding:10px 12px; }.context-message.answer { margin-left:30px; }.context-message p { font-size:10px; }.context-bottom { font-size:7px; gap:10px; }.journey-caption { font-size:8px; }.journey-step { min-height:auto; padding:35px 0; }.journey-step h3 { font-size:28px; }.journey-step p { font-size:14px; }.step-index { font-size:9px; margin-bottom:15px; }.journey-step ul { margin:15px 0; }.journey-step li { font-size:11px; }.journey-step a { font-size:12px; }.journey-copy.mobile-panels .journey-step:not(.selected-step) { display:none; }.mini-kanban { gap:6px; padding:20px 10px; }.mini-kanban > div > span { font-size:7px; }.opportunity-card { padding:10px 7px; }.opportunity-card strong { font-size:9px; }.opportunity-card small { font-size:5px; }.opportunity-card p { font-size:7px; }.task-toast strong { font-size:8px; }.task-toast small { font-size:7px; }.knowledge-docs { gap:7px; }.knowledge-docs span { font-size:8px; padding:10px; }.draft-card { margin:0 14px; padding:14px; }.draft-card p { font-size:11px; }
  .cost-section { padding:60px 0; }.cost-section .section-heading h2 { font-size:36px; }.cost-section .date-note { font-size:9px; }.calculator { border-radius:17px; }.calculator form,.calculator .results { padding:24px; }.carousel-section { padding:55px 0; }.legal-section { padding:55px 0; }.legal-grid { gap:30px; }.legal-grid h2 { font-size:33px; }.legal-grid img { max-height:450px; }.contact-pitch h2 { font-size:34px; }
}
@media(prefers-reduced-motion:reduce) {
  .product-scene,.journey-screen .journey-panel,.journey-screen * { animation:none!important; transform:none; }
  .motion-toggle { display:none; }.demo-footer { padding-right:18px; }.connection-track i { left:50%; }
}
@media(max-width:700px) {
  .journey-tabs button { font-size:11px; padding:11px 12px; }
  .platform-ribbon { gap:8px; }.platform-ribbon strong { font-size:12px; }.platform-ribbon i { font-size:13px; }
}