.zf-home {
  color-scheme: light;
  --ink: #1a1e23;
  --ink-soft: #31363b;
  --paper: #ffffff;
  --warm: #f3f1f0;
  --warm-deep: #e8e3e1;
  --line: #dedad7;
  --line-strong: #c9c3bf;
  --muted: #65696d;
  --coral: #ff9780;
  --coral-deep: #a94731;
  --coral-soft: #f8e6e1;
  --green: #278260;
  --green-bright: #8be4b8;
  --green-soft: #e7f0eb;
  --blue: #2f6f91;
  --blue-soft: #e7eef2;
  --focus: #0b5c9e;
  --content: 1120px;
  --radius-control: 7px;
  --radius-media: 8px;
  --ease-out: cubic-bezier(0.2, 0.75, 0.24, 1);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --fast: 180ms;
  --normal: 300ms;
  --scene: 520ms;
  --ease: var(--ease-out);
  --coral-text: var(--coral-deep);
  --success: var(--green);
  font-family: "Segoe UI Variable", "Microsoft YaHei UI", "Segoe UI", sans-serif;
}

.zf-public {
  color-scheme: light;
  --ink: #1a1e23;
  --ink-soft: #31363b;
  --paper: #ffffff;
  --warm: #f3f1f0;
  --warm-deep: #e8e3e1;
  --line: #dedad7;
  --line-strong: #c9c3bf;
  --muted: #65696d;
  --coral: #ff9780;
  --coral-deep: #a94731;
  --coral-soft: #f8e6e1;
  --green: #278260;
  --focus: #0b5c9e;
  --content: 1120px;
  --radius-control: 7px;
  min-height: 100vh;
  overflow: clip;
  background: var(--paper);
  color: var(--ink);
  font-family: "Segoe UI Variable", "Microsoft YaHei UI", "Segoe UI", sans-serif;
}

body.has-marketing-home {
  min-width: 0;
  margin: 0;
  overflow-x: hidden;
  background: #ffffff;
  color: #1a1e23;
  font-family: "Segoe UI Variable", "Microsoft YaHei UI", "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
}

body.has-marketing-home .zf-home {
  letter-spacing: 0;
  overflow: clip;
  background: var(--paper);
  color: var(--ink);
}

body.has-public-site {
  --ink: #1a1e23;
  --ink-soft: #31363b;
  --paper: #ffffff;
  --soft: #f3f1f0;
  --line: #dedad7;
  --line-strong: #c9c3bf;
  --muted: #65696d;
  --coral: #ff9780;
  --coral-deep: #a94731;
  --coral-soft: #f8e6e1;
  --focus: #0b5c9e;
  --page: #f3f1f0;
  --surface: #ffffff;
  --surface-subtle: #faf9f8;
  --surface-hover: #f3f1f0;
  --text: #1a1e23;
  --text-soft: #3f4347;
  --brand: #a94731;
  --brand-hover: #8f3827;
  --brand-soft: #f8e6e1;
  --brand-line: #edb6a8;
  min-width: 0;
  color: var(--ink);
  font-family: "Segoe UI Variable", "Microsoft YaHei UI", "Segoe UI", sans-serif;
  font-size: 16px;
  letter-spacing: 0;
}

body.has-marketing-home .zf-home,
body.has-marketing-home .zf-home *,
body.has-marketing-home .zf-home *::before,
body.has-marketing-home .zf-home *::after,
body.has-public-site .zf-public,
body.has-public-site .zf-public *,
body.has-public-site .zf-public *::before,
body.has-public-site .zf-public *::after {
  box-sizing: border-box;
  letter-spacing: 0;
}

body.has-marketing-home .zf-home [hidden],
body.has-public-site .zf-public [hidden] {
  display: none !important;
}

:where(body.has-marketing-home .zf-home button, body.has-marketing-home .zf-home a),
:where(body.has-public-site .zf-public button, body.has-public-site .zf-public a) {
  color: inherit;
  font-family: inherit;
  -webkit-tap-highlight-color: transparent;
}

:where(body.has-marketing-home .zf-home button) {
  border: 0;
  cursor: pointer;
}

:where(
  body.has-marketing-home .zf-home h1,
  body.has-marketing-home .zf-home h2,
  body.has-marketing-home .zf-home h3,
  body.has-marketing-home .zf-home p,
  body.has-marketing-home .zf-home dl,
  body.has-marketing-home .zf-home dd,
  body.has-marketing-home .zf-home ol,
  body.has-marketing-home .zf-home ul,
  body.has-public-site .zf-public h1,
  body.has-public-site .zf-public h2,
  body.has-public-site .zf-public h3,
  body.has-public-site .zf-public p
) {
  margin: 0;
}

body.has-marketing-home .zf-home section[id] {
  scroll-margin-top: 104px;
}

body.has-marketing-home .zf-home :focus-visible {
  outline: 2px solid #0b5c9e;
  outline-offset: 3px;
  box-shadow: 0 0 0 2px #ffffff;
}

body.has-marketing-home .zf-home [data-anchor-heading]:focus-visible {
  outline: 0;
  box-shadow: none;
}

body.has-public-site .zf-public :focus-visible,
body.has-public-site .auth-page :focus-visible {
  outline: 2px solid #0b5c9e;
  outline-offset: 3px;
  box-shadow: 0 0 0 2px #ffffff;
}

body.has-marketing-home .zf-home ::selection,
body.has-public-site .zf-public ::selection {
  background: var(--coral-soft);
  color: var(--ink);
}

.home-shell {
  width: min(var(--content), calc(100% - 64px));
  margin-inline: auto;
}

.no-break {
  white-space: nowrap;
}

/* Shared public navigation and controls */

.floating-nav {
  position: fixed;
  z-index: 100;
  top: 24px;
  left: 50%;
  display: grid;
  width: min(var(--content), calc(100% - 48px));
  height: 70px;
  grid-template-columns: minmax(176px, 1fr) auto minmax(176px, 1fr);
  align-items: center;
  gap: 24px;
  padding: 0 18px;
  border: 1px solid rgba(26, 30, 35, 0.08);
  border-radius: 38px;
  background: rgba(250, 250, 249, 0.94);
  box-shadow: 0 4px 18px rgba(26, 30, 35, 0.1);
  backdrop-filter: blur(15px);
  transform: translateX(-50%);
  transition: transform var(--normal) var(--ease-out), background-color var(--fast) var(--ease-standard), border-color var(--fast) var(--ease-standard), box-shadow var(--fast) var(--ease-standard);
}

.floating-nav.is-scrolled {
  border-color: rgba(26, 30, 35, 0.13);
  background: rgba(250, 250, 249, 0.86);
  box-shadow: 0 9px 26px rgba(26, 30, 35, 0.12);
  transform: translate(-50%, -5px);
}

.zf-brand {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 11px;
  justify-self: start;
  text-decoration: none;
  white-space: nowrap;
}

.zf-brand strong {
  font-size: 16px;
  font-weight: 650;
  line-height: 1.2;
}

.zf-brand-mark {
  position: relative;
  display: inline-block;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
}

.zf-brand-mark i {
  position: absolute;
  width: 19px;
  height: 19px;
  border: 2px solid currentColor;
  border-radius: 4px;
}

.zf-brand-mark i:first-child {
  top: 1px;
  left: 1px;
}

.zf-brand-mark i:last-child {
  right: 1px;
  bottom: 1px;
}

.floating-nav nav {
  display: flex;
  align-items: center;
  gap: 22px;
  justify-self: center;
}

.floating-nav nav a,
.nav-login {
  position: relative;
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  color: #34383c;
  font-size: 14px;
  font-weight: 550;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}

.floating-nav nav a::after,
.nav-login::after {
  position: absolute;
  right: 0;
  bottom: 6px;
  left: 0;
  height: 1px;
  background: var(--ink);
  content: "";
  opacity: 0;
  transform: scaleX(0.35);
  transform-origin: center;
  transition: opacity var(--fast) var(--ease-out), transform var(--fast) var(--ease-out);
}

.floating-nav nav a:hover::after,
.floating-nav nav a:focus-visible::after,
.floating-nav nav a[aria-current="page"]::after,
.nav-login:hover::after,
.nav-login:focus-visible::after {
  opacity: 1;
  transform: scaleX(1);
}

.nav-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  justify-self: end;
}

.zf-button {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  border: 1px solid transparent;
  border-radius: var(--radius-control);
  font-size: 16px;
  font-weight: 650;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  transition: color var(--fast) var(--ease-standard), background-color var(--fast) var(--ease-standard), border-color var(--fast) var(--ease-standard), transform var(--fast) var(--ease-out), box-shadow var(--fast) var(--ease-standard);
}

.zf-button:hover:not(:disabled) {
  transform: translateY(-2px);
}

.zf-button:active:not(:disabled) {
  transform: translateY(0);
}

.zf-button:disabled,
.zf-button[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.52;
  transform: none;
}

.zf-button-nav {
  min-height: 42px;
  padding: 0 17px;
  font-size: 14px;
}

.zf-button-dark {
  background: var(--ink);
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(26, 30, 35, 0.13);
}

.zf-button-dark:hover:not(:disabled) {
  background: #30353a;
  box-shadow: 0 7px 18px rgba(26, 30, 35, 0.16);
}

.zf-button-light {
  border-color: #ffffff;
  background: #ffffff;
  color: var(--ink);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.13);
}

.zf-button-light:hover:not(:disabled) {
  border-color: var(--coral);
  background: var(--coral-soft);
}

.zf-button-ghost {
  border-color: rgba(255, 255, 255, 0.5);
  background: rgba(17, 21, 25, 0.28);
  color: #ffffff;
  backdrop-filter: blur(8px);
}

.zf-button-ghost:hover:not(:disabled) {
  border-color: rgba(255, 255, 255, 0.84);
  background: rgba(17, 21, 25, 0.58);
}

.text-link {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  color: var(--ink-soft);
  font-size: 16px;
  font-weight: 600;
  text-underline-offset: 5px;
  transition: color var(--fast) var(--ease-standard), transform var(--fast) var(--ease-out);
}

.text-link:hover {
  color: var(--coral-deep);
  transform: translateX(3px);
}

.motion-toggle {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: #ffffff;
  color: var(--ink);
  box-shadow: 0 4px 14px rgba(26, 30, 35, 0.08);
  font-size: 16px;
  line-height: 1;
  transition: color var(--fast) var(--ease-standard), background-color var(--fast) var(--ease-standard), border-color var(--fast) var(--ease-standard), box-shadow var(--fast) var(--ease-standard), transform var(--fast) var(--ease-out);
}

.motion-toggle > span {
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
}

.motion-toggle:hover:not(:disabled) {
  border-color: rgba(169, 71, 49, 0.5);
  background: var(--coral-soft);
  transform: translateY(-2px);
}

.motion-toggle:active:not(:disabled) {
  transform: scale(0.96);
}

.motion-toggle[aria-pressed="true"] {
  border-color: var(--ink);
  background: var(--ink);
  color: #ffffff;
}

.motion-toggle:disabled,
.motion-toggle[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.5;
  box-shadow: none;
  transform: none;
}

/* Homepage typography and reference-backed labels */

.zf-home .scene-kicker {
  color: var(--coral-deep);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;
}

.zf-home .download-copy h2 {
  margin: 0;
  font-size: 42px;
  font-weight: 430;
  line-height: 1.24;
  text-wrap: balance;
}

/* Hero: one bright, full-screen focal statement */

.zf-home .home-hero {
  position: relative;
  height: calc(100svh - 18px);
  min-height: 700px;
  max-height: 1020px;
  overflow: hidden;
  background-color: #c7f5ec;
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02) 0%, rgba(255, 255, 255, 0.1) 62%, #ffffff 100%),
    linear-gradient(112deg, #ddfaef 0%, #d7f3f7 34%, #e6f0fb 66%, #fff0eb 100%);
  color: #102b3b;
  isolation: isolate;
}

.zf-home .hero-backdrop-canvas {
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0.94;
  pointer-events: none;
}

.zf-home .hero-shell {
  position: relative;
  z-index: 2;
  display: grid;
  height: 100%;
  grid-template-columns: minmax(0, 1fr);
  place-items: center;
  padding-top: 112px;
  padding-bottom: 72px;
  text-align: center;
}

.zf-home .hero-copy {
  display: grid;
  width: min(960px, 100%);
  justify-items: center;
  align-content: center;
  gap: 18px;
}

.zf-home .hero-copy h1 {
  margin: 0;
  color: #102b3b;
  font-size: 72px;
  font-weight: 520;
  line-height: 1.08;
  text-wrap: balance;
}

.zf-home .hero-claim {
  max-width: 860px;
  color: rgba(16, 43, 59, 0.82);
  font-size: 30px;
  font-weight: 430;
  line-height: 1.35;
  text-wrap: balance;
}

.zf-home .hero-actions {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 20px;
}

.zf-home .home-hero .hero-actions .zf-button {
  min-height: 58px;
  min-width: 188px;
  padding: 0 30px;
  border-radius: 999px;
  font-size: 16px;
  transition: background-color var(--fast) var(--ease-out), border-color var(--fast) var(--ease-out), box-shadow var(--fast) var(--ease-out), transform var(--fast) var(--ease-out);
}

.zf-home .home-hero .hero-action-primary {
  border-color: rgba(255, 151, 128, 0.9);
  background: var(--coral);
  color: #1a1e23;
  box-shadow: 0 12px 30px rgba(169, 71, 49, 0.18);
}

.zf-home .home-hero .hero-action-primary:hover:not(:disabled) {
  border-color: #ff866d;
  background: #ff866d;
  box-shadow: 0 16px 34px rgba(169, 71, 49, 0.24);
  transform: translateY(-1px);
}

.zf-home .home-hero .hero-action-secondary {
  border-color: rgba(16, 43, 59, 0.2);
  background: rgba(255, 255, 255, 0.94);
  color: #102b3b;
  box-shadow: 0 12px 30px rgba(29, 84, 110, 0.11);
  backdrop-filter: blur(10px);
}

.zf-home .home-hero .hero-action-secondary:hover:not(:disabled) {
  border-color: rgba(16, 43, 59, 0.36);
  background: #ffffff;
  color: #0a2536;
  box-shadow: 0 16px 34px rgba(29, 84, 110, 0.17);
  transform: translateY(-1px);
}

.zf-home .hero-scroll-cue {
  position: absolute;
  right: 50%;
  bottom: 24px;
  display: grid;
  justify-items: center;
  gap: 8px;
  color: rgba(16, 43, 59, 0.66);
  font-size: 14px;
  transform: translateX(50%);
}

.zf-home .hero-scroll-cue i {
  width: 1px;
  height: 28px;
  background: rgba(16, 43, 59, 0.3);
}

/* The product canvas now belongs to the bridge, not the poster */

.zf-home .bridge .hero-product-stage {
  position: relative;
  width: min(860px, calc(100% - 64px));
  aspect-ratio: 720 / 500;
  margin: 58px auto 0;
  overflow: hidden;
  border: 1px solid #dce7eb;
  border-radius: var(--radius-media);
  background: #ffffff;
  box-shadow: 0 18px 48px rgba(33, 74, 92, 0.08);
}

.zf-home .bridge .hero-canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.zf-home .home-hero .motion-toggle-hero {
  position: absolute;
  z-index: 3;
  top: 104px;
  right: clamp(24px, 4vw, 64px);
  border-color: rgba(16, 43, 59, 0.18);
  background: rgba(255, 255, 255, 0.72);
  color: #102b3b;
  box-shadow: 0 8px 24px rgba(29, 84, 110, 0.1);
  backdrop-filter: blur(10px);
}

.zf-home .home-hero .motion-toggle-hero:hover:not(:disabled) {
  border-color: rgba(16, 43, 59, 0.34);
  background: rgba(255, 255, 255, 0.96);
}

.zf-home .home-hero .motion-toggle-hero[aria-pressed="true"] {
  border-color: #102b3b;
  background: #102b3b;
  color: #ffffff;
}
.zf-home .pill-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: max-content;
  min-height: 28px;
  padding: 0 13px;
  border: 1px solid rgba(255, 151, 128, 0.68);
  border-radius: 999px;
  color: #3d3f43;
  font-size: 14px;
  font-weight: 500;
}

.zf-home .pill-label > i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}

.zf-home .bridge {
  position: relative;
  min-height: auto;
  overflow: hidden;
  padding: 124px 0 112px;
  border-bottom: 1px solid var(--line);
  background: var(--paper);
}

.zf-home .bridge-copy {
  display: grid;
  width: min(760px, calc(100% - 64px));
  justify-items: center;
  gap: 15px;
  margin: 0 auto;
  padding-top: 0;
  text-align: center;
}

.zf-home .bridge h2 {
  font-size: 44px;
  font-weight: 400;
  line-height: 1.2;
}

.zf-home .bridge-copy > p:last-child {
  color: var(--muted);
  font-size: 17px;
}

.zf-home .capability-field {
  position: absolute;
  right: 50%;
  bottom: 48px;
  width: min(var(--content), calc(100% - 64px));
  height: 240px;
  transform: translateX(50%);
}

.zf-home .capability-word {
  position: absolute;
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  padding: 0 12px;
  color: #393c40;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
}

.zf-home .field-plus {
  position: absolute;
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border: 1px solid #bab4b0;
  border-radius: 50%;
  color: #77736f;
  font-size: 14px;
}

.zf-home .word-one { top: 26px; left: 2%; }
.zf-home .plus-one { top: 8px; left: 19%; }
.zf-home .word-two { top: 104px; left: 18%; }
.zf-home .plus-two { top: 78px; left: 35%; }
.zf-home .word-three { top: 19px; left: 40%; }
.zf-home .plus-three { top: 124px; left: 51%; }
.zf-home .word-four { top: 148px; left: 58%; }
.zf-home .plus-four { top: 28px; left: 67%; }
.zf-home .word-five { top: 82px; left: 75%; }
.zf-home .plus-five { top: 154px; left: 86%; }
.zf-home .word-six { top: 24px; right: 0; }

.zf-home .section-heading {
  display: grid;
  gap: 15px;
}

.zf-home .section-heading h2 {
  max-width: 880px;
  font-size: 46px;
  font-weight: 400;
  line-height: 1.22;
}

.zf-home .section-heading > p:last-child {
  max-width: 720px;
  color: var(--muted);
  font-size: 17px;
}

.zf-home .align-center {
  justify-items: center;
  text-align: center;
}

.zf-home .product-section {
  width: min(var(--content), calc(100% - 64px));
  margin: 0 auto;
  padding: 124px 0 72px;
}

.zf-home .bento-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-areas:
    "flow flow context"
    "quality after after";
  gap: 14px;
  margin-top: 62px;
  overflow: visible;
  padding: 0;
  border: 0;
  background: transparent;
}

.zf-home .bento-panel {
  position: relative;
  display: grid;
  min-height: 460px;
  align-content: space-between;
  gap: 30px;
  padding: 34px;
  overflow: hidden;
  border: 1px solid #dfe5e4;
  border-radius: 8px;
  background: #fbfcfc;
  box-shadow: none;
}

.zf-home .bento-panel > * {
  position: relative;
  z-index: 1;
}

.zf-home .bento-panel header {
  display: grid;
  max-width: 520px;
  gap: 8px;
}

.zf-home .bento-panel h3 {
  font-size: 28px;
  font-weight: 400;
  line-height: 1.3;
}

.zf-home .bento-panel header p {
  max-width: 520px;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.65;
}

.zf-home .panel-flow { grid-area: flow; background: linear-gradient(135deg, #fbfcfc 62%, #fff0ec 100%); }
.zf-home .panel-context { grid-area: context; background: #f8fbfa; }
.zf-home .panel-quality { grid-area: quality; background: #fdf9f8; }
.zf-home .panel-after-sales { grid-area: after; background: linear-gradient(135deg, #fbfcfc 64%, #edf7f4 100%); }

/* Reference-backed Bento media: three timelines and one calm proof stack. */

.zf-home .bento-flow-stage {
  position: relative;
  width: min(660px, 100%);
  min-height: 270px;
  margin: 0 auto 4px;
}

.zf-home .bento-flow-stage::before,
.zf-home .bento-after-dialogue::before {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 151, 128, 0.14);
  filter: blur(38px);
  content: "";
  pointer-events: none;
}

.zf-home .bento-flow-stage::before {
  inset: 24% 12% 2%;
}

.zf-home .bento-guide-window,
.zf-home .bento-conversation-window {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  overflow: hidden;
  border: 1px solid rgba(26, 30, 35, 0.13);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(45, 39, 36, 0.09);
  will-change: transform, opacity;
}

.zf-home .bento-guide-window {
  --bento-guide-static-x: -90%;
  z-index: 1;
  width: 372px;
  min-height: 238px;
  grid-template-rows: auto auto 1fr auto;
  transform: translate(var(--bento-guide-static-x), -49%);
}

.zf-home .bento-conversation-window {
  --bento-conversation-static-x: 12%;
  z-index: 2;
  width: 300px;
  min-height: 230px;
  align-content: start;
  transform: translate(var(--bento-conversation-static-x), -43%);
}

.zf-home .bento-window-bar {
  display: flex;
  min-height: 40px;
  align-items: center;
  gap: 8px;
  padding: 0 13px;
  border-bottom: 1px solid var(--line);
}

.zf-home .bento-window-bar strong {
  margin-right: auto;
  font-size: 14px;
  font-weight: 650;
}

.zf-home .bento-window-bar span {
  padding: 3px 7px;
  border: 1px solid var(--line);
  border-radius: 5px;
  color: var(--muted);
  font-size: 14px;
}

.zf-home .bento-window-bar > i {
  position: relative;
  width: 13px;
  height: 13px;
}

.zf-home .bento-window-bar > i::before,
.zf-home .bento-window-bar > i::after {
  position: absolute;
  top: 6px;
  left: 1px;
  width: 11px;
  height: 1px;
  background: #77736f;
  content: "";
}

.zf-home .bento-window-bar > i::before { transform: rotate(45deg); }
.zf-home .bento-window-bar > i::after { transform: rotate(-45deg); }

.zf-home .bento-guide-window > p {
  padding: 14px 16px 9px;
  font-size: 16px;
  font-weight: 650;
  line-height: 1.45;
}

.zf-home .bento-guide-rules {
  display: grid;
  gap: 6px;
  padding: 0 16px 11px;
}

.zf-home .bento-guide-rules > div {
  display: grid;
  min-height: 38px;
  grid-template-columns: 28px 90px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 0 9px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: #f7f8f8;
}

.zf-home .bento-guide-rules span,
.zf-home .bento-guide-rules small {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.35;
}

.zf-home .bento-guide-rules span {
  font-variant-numeric: tabular-nums;
}

.zf-home .bento-guide-rules b {
  font-size: 14px;
  font-weight: 650;
}

.zf-home .bento-guide-window footer {
  display: flex;
  min-height: 34px;
  align-items: center;
  gap: 7px;
  padding: 0 16px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 14px;
}

.zf-home .bento-guide-window footer i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--success);
}

.zf-home .bento-buyer-message,
.zf-home .bento-answer-state {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 9px;
  padding: 14px;
}

.zf-home .bento-buyer-message b,
.zf-home .bento-answer-state b {
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  border-radius: 50%;
  background: #eef2f3;
  color: #5d646b;
  font-size: 14px;
  font-weight: 650;
}

.zf-home .bento-answer-state b {
  background: linear-gradient(145deg, #ffb7a7, #ff8068);
  color: #fff;
}

.zf-home .bento-buyer-message p,
.zf-home .bento-answer-state p {
  font-size: 14px;
  line-height: 1.65;
}

.zf-home .bento-thinking-state {
  display: flex;
  min-height: 34px;
  align-items: center;
  gap: 8px;
  margin: 0 13px;
  color: var(--muted);
  font-size: 14px;
  opacity: 0;
}

.zf-home .bento-thinking-state i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--coral);
  box-shadow: 12px 0 0 rgba(255, 151, 128, 0.52), 24px 0 0 rgba(255, 151, 128, 0.26);
  margin-right: 24px;
}

.zf-home .bento-answer-state {
  margin: 0 8px 8px;
  border-radius: 7px;
  background: var(--coral-soft);
}

.zf-home .bento-pointer-close {
  position: absolute;
  z-index: 3;
  top: 49px;
  left: calc(50% + 202px);
  width: 12px;
  height: 18px;
  background: #1a1e23;
  clip-path: polygon(0 0, 100% 58%, 58% 66%, 76% 100%, 56% 100%, 39% 69%, 0 100%);
  opacity: 0;
  transform: translate3d(-60px, 42px, 0) rotate(-12deg);
}

.zf-home .bento-orbit-stage {
  position: relative;
  width: 286px;
  min-height: 286px;
  margin: 0 auto 2px;
}

.zf-home .bento-orbit-ring,
.zf-home .bento-orbit-core,
.zf-home .bento-orbit-node {
  position: absolute;
  top: 50%;
  left: 50%;
}

.zf-home .bento-orbit-ring {
  border: 1px dashed rgba(94, 87, 83, 0.28);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  will-change: transform, opacity;
}

.zf-home .bento-orbit-ring.ring-inner { width: 112px; height: 112px; }
.zf-home .bento-orbit-ring.ring-outer { width: 218px; height: 218px; }

.zf-home .bento-orbit-core {
  z-index: 2;
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  border: 1px solid rgba(255, 151, 128, 0.45);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 10px 25px rgba(70, 52, 46, 0.1);
  transform: translate(-50%, -50%);
}

.zf-home .bento-orbit-core i {
  width: 16px;
  height: 16px;
  border: 1.5px solid var(--coral-deep);
  border-radius: 4px;
  box-shadow: 4px 4px 0 -1px #fff, 4px 4px 0 0 var(--coral-deep);
}

.zf-home .bento-orbit-node {
  z-index: 3;
  display: grid;
  width: 58px;
  justify-items: center;
  transform: translate(-50%, -50%) translate(var(--node-x), var(--node-y));
  will-change: transform, opacity;
}

.zf-home .bento-orbit-node i {
  position: relative;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(26, 30, 35, 0.16);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 5px 13px rgba(26, 30, 35, 0.07);
  color: var(--ink);
  font-style: normal;
}

.zf-home .bento-orbit-node i::before,
.zf-home .bento-orbit-node i::after {
  position: absolute;
  content: "";
}

.zf-home .node-knowledge i::before {
  top: 15px;
  left: 14px;
  width: 15px;
  height: 12px;
  border: 1.5px solid #293e48;
  border-radius: 2px;
}

.zf-home .node-knowledge i::after {
  top: 16px;
  left: 21px;
  width: 1px;
  height: 10px;
  background: #293e48;
}

.zf-home .node-product i::before {
  top: 14px;
  left: 14px;
  width: 15px;
  height: 15px;
  border: 1.5px solid #293e48;
  border-radius: 2px;
}

.zf-home .node-product i::after {
  top: 18px;
  left: 18px;
  width: 7px;
  height: 1px;
  background: #293e48;
  box-shadow: 0 4px 0 #293e48;
}

.zf-home .node-order i::before {
  top: 13px;
  left: 15px;
  width: 13px;
  height: 17px;
  border: 1.5px solid #293e48;
  border-radius: 2px;
}

.zf-home .node-order i::after {
  top: 18px;
  left: 18px;
  width: 7px;
  height: 1px;
  background: #293e48;
  box-shadow: 0 4px 0 #293e48, 0 8px 0 #293e48;
}

.zf-home .node-dialogue i::before {
  top: 14px;
  left: 13px;
  width: 17px;
  height: 13px;
  border: 1.5px solid #293e48;
  border-radius: 6px;
}

.zf-home .node-dialogue i::after {
  top: 25px;
  left: 18px;
  width: 5px;
  height: 5px;
  border-bottom: 1.5px solid #293e48;
  border-left: 1.5px solid #293e48;
  transform: skewY(-35deg);
}

.zf-home .node-policy i::before {
  top: 12px;
  left: 14px;
  width: 16px;
  height: 19px;
  background: #293e48;
  clip-path: polygon(50% 0, 92% 18%, 82% 72%, 50% 100%, 18% 72%, 8% 18%);
}

.zf-home .node-policy i::after {
  top: 14px;
  left: 16px;
  width: 12px;
  height: 14px;
  background: #fff;
  clip-path: polygon(50% 0, 90% 18%, 80% 70%, 50% 100%, 20% 70%, 10% 18%);
}

.zf-home .node-result i::before {
  top: 13px;
  left: 13px;
  width: 17px;
  height: 17px;
  border: 1.5px solid #293e48;
  border-radius: 50%;
}

.zf-home .node-result i::after {
  top: 16px;
  left: 19px;
  width: 5px;
  height: 9px;
  border-right: 1.5px solid #293e48;
  border-bottom: 1.5px solid #293e48;
  transform: rotate(45deg);
}

.zf-home .node-knowledge { --node-x: 0px; --node-y: -106px; --node-delay: 0ms; }
.zf-home .node-product { --node-x: 92px; --node-y: -53px; --node-delay: 140ms; }
.zf-home .node-order { --node-x: 92px; --node-y: 53px; --node-delay: 280ms; }
.zf-home .node-dialogue { --node-x: 0px; --node-y: 106px; --node-delay: 420ms; }
.zf-home .node-policy { --node-x: -92px; --node-y: 53px; --node-delay: 560ms; }
.zf-home .node-result { --node-x: -92px; --node-y: -53px; --node-delay: 700ms; }

.zf-home .quality-proof-stack {
  display: grid;
  width: min(255px, 100%);
  gap: 9px;
  margin: 0 auto 18px;
}

.zf-home .quality-proof-stack > div {
  display: grid;
  min-height: 68px;
  grid-template-columns: 32px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  border: 1px solid rgba(26, 30, 35, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 8px 20px rgba(45, 39, 36, 0.06);
}

.zf-home .quality-proof-stack > div:nth-child(2) { transform: translateX(8px); }

.zf-home .quality-proof-stack > div > span {
  color: #aaa39e;
  font-size: 14px;
}

.zf-home .quality-proof-stack p {
  display: grid;
  gap: 2px;
}

.zf-home .quality-proof-stack strong {
  font-size: 14px;
  font-weight: 650;
}

.zf-home .quality-proof-stack small {
  color: var(--muted);
  font-size: 14px;
}

.zf-home .quality-proof-stack > div > i,
.zf-home .bento-after-confirm > i {
  position: relative;
  width: 22px;
  height: 22px;
  border: 1px solid #9cd5bf;
  border-radius: 50%;
  background: #eaf7f1;
}

.zf-home .quality-proof-stack > div > i::after,
.zf-home .bento-after-confirm > i::after {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 8px;
  height: 4px;
  border-bottom: 1.5px solid var(--success);
  border-left: 1.5px solid var(--success);
  content: "";
  transform: rotate(-45deg);
}

.zf-home .bento-after-dialogue {
  position: relative;
  width: min(660px, 100%);
  min-height: 390px;
  margin: 0 auto 2px;
}

.zf-home .bento-after-dialogue::before {
  inset: 18% 6% 0 32%;
}

.zf-home .bento-after-buyer,
.zf-home .bento-after-reply,
.zf-home .bento-after-confirm,
.zf-home .bento-after-context > div {
  border: 1px solid rgba(26, 30, 35, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 8px 22px rgba(45, 39, 36, 0.06);
  will-change: transform, opacity;
}

.zf-home .bento-after-buyer {
  position: absolute;
  z-index: 2;
  top: 6px;
  right: 22px;
  width: 286px;
  padding: 12px 14px;
}

.zf-home .bento-after-buyer small,
.zf-home .bento-after-reply small,
.zf-home .bento-after-confirm small,
.zf-home .bento-after-context small {
  color: var(--muted);
  font-size: 14px;
}

.zf-home .bento-after-buyer p,
.zf-home .bento-after-reply p {
  margin-top: 4px;
  font-size: 14px;
  line-height: 1.5;
}

.zf-home .bento-after-context {
  position: absolute;
  z-index: 3;
  top: 90px;
  right: 36px;
  display: grid;
  width: 310px;
  gap: 7px;
}

.zf-home .bento-after-context > div {
  --after-shift: 0px;
  display: grid;
  min-height: 54px;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  padding: 8px 11px;
  transform: translate3d(var(--after-shift), 0, 0);
}

.zf-home .bento-after-context > div:nth-child(2) { --after-shift: -12px; }
.zf-home .bento-after-context > div:nth-child(3) { --after-shift: 5px; }

.zf-home .bento-after-context i {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 7px;
  background: #f0f4f5;
  color: #4f5960;
  font-size: 14px;
  font-style: normal;
  font-weight: 650;
}

.zf-home .bento-after-context span {
  display: grid;
  gap: 1px;
}

.zf-home .bento-after-context b {
  font-size: 14px;
  font-weight: 650;
}

.zf-home .bento-after-reply {
  position: absolute;
  z-index: 4;
  right: 18px;
  bottom: 4px;
  width: 336px;
  padding: 12px 14px;
  border-color: rgba(255, 151, 128, 0.46);
  background: rgba(255, 241, 237, 0.97);
}

.zf-home .bento-after-reply small {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--coral-deep);
  font-weight: 650;
}

.zf-home .bento-after-reply small i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--coral);
}

.zf-home .bento-after-confirm {
  position: absolute;
  z-index: 2;
  bottom: 42px;
  left: 34px;
  display: grid;
  width: 190px;
  min-height: 68px;
  grid-template-columns: 24px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  border-color: #b9ddcf;
  background: rgba(241, 250, 246, 0.96);
}

.zf-home .bento-after-confirm span {
  display: grid;
  gap: 2px;
}

.zf-home .bento-after-confirm b {
  font-size: 14px;
  font-weight: 650;
}

/* Bento motion: each product lens uses its own state language. */

.zf-home.has-motion-reveal .bento-guide-window {
  opacity: 1;
  transform: translate(-50%, -49%) scale(1);
}

.zf-home.has-motion-reveal .bento-guide-rules > div {
  opacity: 0.72;
}

.zf-home.has-motion-reveal .bento-conversation-window {
  opacity: 0;
  transform: translate(70%, -43%) scale(0.96);
}

.zf-home.has-motion-reveal .bento-thinking-state {
  opacity: 0;
  transform: translate3d(0, 6px, 0);
}

.zf-home.has-motion-reveal .bento-answer-state {
  opacity: 0;
  transform: translate3d(0, 10px, 0) scale(0.985);
}

.zf-home.has-motion-reveal .bento-orbit-ring {
  opacity: 0.28;
  transform: translate(-50%, -50%) scale(0.56);
}

.zf-home.has-motion-reveal .bento-orbit-core {
  box-shadow: 0 8px 20px rgba(70, 52, 46, 0.08);
  transform: translate(-50%, -50%) scale(0.92);
}

.zf-home.has-motion-reveal .bento-orbit-node {
  opacity: 0;
  transform: translate(-50%, -50%) translate(0, 0) scale(0.64);
}

.zf-home.has-motion-reveal .bento-after-dialogue {
  min-height: 270px;
}

.zf-home.has-motion-reveal .bento-after-context {
  top: 70px;
}

.zf-home.has-motion-reveal .bento-after-context > div {
  opacity: 0;
  transform: translate3d(var(--after-shift, 0px), 14px, 0) scale(0.97);
}

.zf-home.has-motion-reveal .bento-after-reply {
  opacity: 0;
  transform: translate3d(0, 12px, 0) scale(0.98);
}

.zf-home.has-motion-reveal .bento-after-confirm {
  opacity: 0;
  transform: translate3d(-12px, 0, 0) scale(0.96);
}

.zf-home .bento-grid.is-motion-active .bento-guide-window {
  animation: bento-guide-window 7.68s var(--ease-standard) infinite both;
}

.zf-home .bento-grid.is-motion-active .bento-guide-rules > div {
  animation: bento-rule-highlight 7.68s var(--ease-standard) infinite both;
}

.zf-home .bento-grid.is-motion-active .bento-guide-rules > div:nth-child(2) { animation-delay: 180ms; }
.zf-home .bento-grid.is-motion-active .bento-guide-rules > div:nth-child(3) { animation-delay: 360ms; }

.zf-home .bento-grid.is-motion-active .bento-conversation-window {
  animation: bento-conversation-window 7.68s var(--ease-standard) infinite both;
}

.zf-home .bento-grid.is-motion-active .bento-thinking-state {
  animation: bento-thinking-state 7.68s var(--ease-standard) infinite both;
}

.zf-home .bento-grid.is-motion-active .bento-answer-state {
  animation: bento-answer-state 7.68s var(--ease-standard) infinite both;
}

.zf-home .bento-grid.is-motion-active .bento-pointer-close {
  animation: bento-pointer-close 7.68s var(--ease-standard) infinite both;
}

.zf-home .bento-grid.is-motion-active .bento-orbit-ring {
  animation: bento-orbit-ring 8.9s var(--ease-standard) infinite both;
}

.zf-home .bento-grid.is-motion-active .bento-orbit-ring.ring-inner { animation-delay: 160ms; }

.zf-home .bento-grid.is-motion-active .bento-orbit-core {
  animation: bento-orbit-core 8.9s var(--ease-standard) infinite both;
}

.zf-home .bento-grid.is-motion-active .bento-orbit-node {
  animation: bento-orbit-node 8.9s var(--ease-standard) var(--node-delay) infinite both;
}

.zf-home .bento-grid.is-motion-active .bento-after-buyer {
  animation: bento-after-buyer 6.47s var(--ease-standard) infinite both;
}

.zf-home .bento-grid.is-motion-active .bento-after-context > div {
  animation: bento-after-context 6.47s var(--ease-standard) infinite both;
}

.zf-home .bento-grid.is-motion-active .bento-after-context > div:nth-child(2) { animation-delay: 140ms; }
.zf-home .bento-grid.is-motion-active .bento-after-context > div:nth-child(3) { animation-delay: 280ms; }

.zf-home .bento-grid.is-motion-active .bento-after-reply {
  animation: bento-after-reply 6.47s var(--ease-standard) infinite both;
}

.zf-home .bento-grid.is-motion-active .bento-after-confirm {
  animation: bento-after-confirm 6.47s var(--ease-standard) infinite both;
}

.zf-home .scene-section {
  padding: 104px 0 84px;
  border-top: 1px solid var(--line);
  background: #fbfaf8;
}

.zf-home .scene-section > .section-heading {
  width: min(920px, calc(100% - 64px));
  margin: 0 auto;
}

.zf-home .scene-rail {
  position: relative;
  margin-top: 68px;
}

.zf-home .scene-window {
  position: relative;
  width: min(1440px, calc(100% - 64px));
  height: 620px;
  overflow: hidden;
  margin: 0 auto;
  border-radius: 8px;
  background: #ff8f78;
}

.zf-home .scene-track {
  position: relative;
  width: 100%;
  height: 100%;
}

.zf-home .scene-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  opacity: 0;
  transform: scale(1.018);
  visibility: hidden;
  transition: opacity 520ms var(--ease-out), transform 920ms var(--ease-out), visibility 0s linear 520ms;
}

.zf-home .scene-slide.is-active {
  z-index: 1;
  opacity: 1;
  transform: scale(1);
  visibility: visible;
  transition-delay: 0s;
}

.zf-home .scene-concurrency {
  background: #ff8f78;
}

.zf-home .scene-accuracy {
  background: #2468d7;
}

.zf-home .scene-aftersales {
  background: #b8efda;
}

.zf-home .scene-slide::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(20, 24, 28, 0.72) 0%, rgba(20, 24, 28, 0.2) 48%, rgba(20, 24, 28, 0) 74%);
  content: "";
  pointer-events: none;
}

.zf-home .scene-accuracy::after {
  background: linear-gradient(90deg, rgba(8, 24, 59, 0.78) 0%, rgba(8, 24, 59, 0.18) 50%, rgba(8, 24, 59, 0) 76%);
}

.zf-home .scene-aftersales::after {
  background: linear-gradient(90deg, rgba(18, 39, 33, 0.76) 0%, rgba(18, 39, 33, 0.16) 48%, rgba(18, 39, 33, 0) 74%);
}

.zf-home .scene-artwork {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform 1.2s var(--ease-out), filter 520ms var(--ease-out);
}

.zf-home .scene-slide.is-active .scene-artwork {
  transform: scale(1.015);
}

.zf-home .scene-concurrency .scene-artwork { object-position: 50% 50%; }
.zf-home .scene-accuracy .scene-artwork { object-position: 52% 50%; }
.zf-home .scene-aftersales .scene-artwork { object-position: 50% 46%; }

.zf-home .scene-photo-ui {
  position: absolute;
  z-index: 3;
  top: 50%;
  right: 64px;
  display: grid;
  width: 320px;
  gap: 16px;
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 24px 70px rgba(12, 23, 32, 0.18);
  color: var(--ink);
  transform: translate3d(0, -50%, 0);
  backdrop-filter: blur(18px);
  pointer-events: none;
}

.zf-home .scene-photo-ui > span,
.zf-home .scene-photo-ui > small {
  display: flex;
  align-items: center;
  gap: 9px;
}

.zf-home .scene-photo-ui > span {
  color: rgba(26, 30, 35, 0.68);
  font-size: 14px;
  font-weight: 620;
}

.zf-home .scene-photo-ui > span > i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2b9a72;
  box-shadow: 0 0 0 5px rgba(43, 154, 114, 0.12);
}

.zf-home .scene-photo-ui > small {
  color: rgba(26, 30, 35, 0.58);
  font-size: 14px;
  line-height: 1.45;
}

.zf-home .scene-message-stack {
  display: grid;
  gap: 8px;
}

.zf-home .scene-message-stack b {
  position: relative;
  display: flex;
  min-height: 42px;
  align-items: center;
  padding: 0 14px 0 38px;
  border-top: 1px solid rgba(26, 30, 35, 0.12);
  color: var(--ink);
  font-size: 16px;
  font-weight: 560;
}

.zf-home .scene-message-stack b::before {
  position: absolute;
  left: 13px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #2468d7;
  box-shadow: 0 0 0 5px rgba(36, 104, 215, 0.1);
  content: "";
}

.zf-home .scene-accuracy-visual,
.zf-home .scene-aftersales-visual {
  position: relative;
  z-index: 2;
  width: 56%;
  height: 100%;
  margin-left: auto;
  overflow: hidden;
}

.zf-home .scene-accuracy-visual::before {
  position: absolute;
  top: 50%;
  right: 16%;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 50%;
  content: "";
  transform: translateY(-50%);
}

.zf-home .accuracy-source {
  position: absolute;
  left: 7%;
  display: flex;
  width: 112px;
  align-items: center;
  gap: 12px;
  color: rgba(255, 255, 255, 0.88);
  font-size: 16px;
  font-weight: 620;
}

.zf-home .accuracy-source::after {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 22px;
  width: 330px;
  height: 1px;
  background: rgba(255, 255, 255, 0.34);
  content: "";
  transform: rotate(var(--line-angle)) scaleX(1);
  transform-origin: left center;
}

.zf-home .accuracy-source > i {
  width: 12px;
  height: 12px;
  flex: 0 0 auto;
  border: 3px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  background: var(--source-color);
  box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.1);
}

.zf-home .source-knowledge { --line-angle: 27deg; --source-color: #c7f5ec; top: 18%; }
.zf-home .source-product { --line-angle: 10deg; --source-color: #ff9a83; top: 39%; }
.zf-home .source-order { --line-angle: -10deg; --source-color: #fff1db; top: 61%; }
.zf-home .source-dialogue { --line-angle: -27deg; --source-color: #9fe4ff; top: 82%; }

.zf-home .accuracy-focus {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 16%;
  display: grid;
  width: 164px;
  height: 164px;
  place-content: center;
  gap: 8px;
  border: 1px solid rgba(255, 255, 255, 0.56);
  border-radius: 50%;
  background: rgba(12, 29, 69, 0.3);
  box-shadow: 0 0 0 26px rgba(255, 255, 255, 0.06), 0 28px 80px rgba(6, 18, 45, 0.26);
  color: #fff;
  text-align: center;
  transform: translateY(-50%);
  backdrop-filter: blur(10px);
}

.zf-home .accuracy-focus > i {
  width: 22px;
  height: 22px;
  justify-self: center;
  border: 6px solid #c7f5ec;
  border-radius: 50%;
  box-shadow: 0 0 24px rgba(199, 245, 236, 0.52);
}

.zf-home .accuracy-focus strong { font-size: 18px; font-weight: 620; }
.zf-home .accuracy-focus small { color: rgba(255, 255, 255, 0.68); font-size: 14px; }

.zf-home .scene-aftersales-visual::before {
  position: absolute;
  top: 50%;
  right: 8%;
  left: 8%;
  height: 2px;
  background: rgba(19, 51, 41, 0.3);
  content: "";
}

.zf-home .aftersales-actions {
  position: absolute;
  top: 22%;
  left: 8%;
  display: flex;
  gap: 22px;
}

.zf-home .aftersales-actions span {
  display: grid;
  width: 92px;
  height: 92px;
  place-items: center;
  border: 1px solid rgba(19, 51, 41, 0.34);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.26);
  color: #173d31;
  font-size: 17px;
  font-weight: 620;
}

.zf-home .aftersales-route {
  position: absolute;
  top: 50%;
  right: 8%;
  left: 8%;
  container-type: inline-size;
}

.zf-home .aftersales-route > i {
  position: absolute;
  z-index: 2;
  left: 0;
  width: 15px;
  height: 15px;
  border: 3px solid #b8efda;
  border-radius: 50%;
  background: #2468d7;
  box-shadow: 0 0 0 6px rgba(36, 104, 215, 0.13), 0 0 24px rgba(36, 104, 215, 0.44);
  transform: translate3d(-50%, -50%, 0);
}

.zf-home .aftersales-route > b {
  position: absolute;
  left: 63%;
  width: 34px;
  height: 34px;
  border: 8px solid #ff8f78;
  border-radius: 50%;
  background: #b8efda;
  box-shadow: 0 0 0 1px rgba(19, 51, 41, 0.34);
  transform: translate3d(-50%, -50%, 0);
}

.zf-home .aftersales-state {
  position: absolute;
  right: 9%;
  bottom: 18%;
  display: grid;
  justify-items: end;
  gap: 7px;
  color: #173d31;
  text-align: right;
}

.zf-home .aftersales-state small { color: rgba(23, 61, 49, 0.62); font-size: 14px; }
.zf-home .aftersales-state strong { font-size: 30px; font-weight: 520; }
.zf-home .aftersales-state span { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.zf-home .aftersales-state span > i { width: 8px; height: 8px; border-radius: 50%; background: #2b9a72; }

.zf-home .scene-rail.is-motion-active .scene-concurrency.is-active .scene-message-stack b {
  animation: scene-message-arrival 5.8s var(--ease-standard) infinite both;
}

.zf-home .scene-rail.is-motion-active .scene-concurrency.is-active .scene-message-stack b:nth-child(2) { animation-delay: 260ms; }
.zf-home .scene-rail.is-motion-active .scene-concurrency.is-active .scene-message-stack b:nth-child(3) { animation-delay: 520ms; }

.zf-home .scene-rail.is-motion-active .scene-accuracy.is-active .accuracy-source::after {
  animation: accuracy-line-arrival 6.1s var(--ease-standard) infinite both;
}

.zf-home .scene-rail.is-motion-active .scene-accuracy.is-active .source-product::after { animation-delay: 180ms; }
.zf-home .scene-rail.is-motion-active .scene-accuracy.is-active .source-order::after { animation-delay: 360ms; }
.zf-home .scene-rail.is-motion-active .scene-accuracy.is-active .source-dialogue::after { animation-delay: 540ms; }

.zf-home .scene-rail.is-motion-active .scene-accuracy.is-active .accuracy-focus {
  animation: accuracy-focus-pulse 6.1s var(--ease-standard) 620ms infinite both;
}

.zf-home .scene-rail.is-motion-active .scene-aftersales.is-active .aftersales-route > i {
  animation: aftersales-route-dot 6.2s cubic-bezier(0.16, 1, 0.3, 1) infinite both;
}

.zf-home .scene-rail.is-motion-active .scene-aftersales.is-active .aftersales-route > b {
  animation: aftersales-gate 6.2s var(--ease-standard) infinite both;
}

.zf-home .slide-copy {
  position: absolute;
  z-index: 3;
  bottom: 68px;
  left: 76px;
  width: min(540px, calc(100% - 152px));
  color: #fff;
}

.zf-home .slide-copy > span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 650;
}

.zf-home .slide-copy > span::before {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
  content: "";
}

.zf-home .slide-copy h3 {
  margin-top: 18px;
  font-size: 54px;
  font-weight: 430;
  line-height: 1.16;
}

.zf-home .slide-copy p {
  max-width: 420px;
  margin-top: 20px;
  color: rgba(255, 255, 255, 0.86);
  font-size: 18px;
  line-height: 1.65;
}

.zf-home .rail-button {
  position: absolute;
  z-index: 5;
  top: 50%;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(26, 30, 35, 0.14);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 8px 20px rgba(26, 30, 35, 0.06);
  font-size: 20px;
  transform: translateY(-50%);
  transition: background var(--fast) var(--ease), transform var(--fast) var(--ease);
}

.zf-home .rail-button:hover {
  background: var(--coral-soft);
  transform: translateY(-50%) scale(1.03);
}

.zf-home .rail-prev { left: max(24px, calc((100vw - 1440px) / 2 + 24px)); }
.zf-home .rail-next { right: max(24px, calc((100vw - 1440px) / 2 + 24px)); }

.zf-home .scene-controls {
  display: grid;
  min-height: 40px;
  grid-template-columns: 40px auto 40px;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 22px;
}

.zf-home .scene-dots {
  display: flex;
  grid-column: 2;
  justify-content: center;
  gap: 9px;
}

.zf-home .motion-toggle-carousel {
  grid-column: 3;
  border-color: rgba(26, 30, 35, 0.2);
  background: rgba(255, 255, 255, 0.94);
}

.zf-home .motion-toggle-carousel:hover:not(:disabled) {
  border-color: rgba(169, 71, 49, 0.52);
  background: var(--coral-soft);
}

.zf-home .motion-toggle-carousel[aria-pressed="true"] {
  border-color: var(--ink);
  background: var(--ink);
  color: #fff;
}

.zf-home .scene-dots button {
  position: relative;
  width: 24px;
  height: 24px;
  padding: 0;
  background: transparent;
}

.zf-home .scene-dots button::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #b9b5b2;
  box-shadow: 0 0 0 0 rgba(26, 30, 35, 0);
  content: "";
  transform: translate(-50%, -50%);
  transition: background var(--fast) var(--ease), box-shadow var(--fast) var(--ease), transform var(--fast) var(--ease);
}

.zf-home .scene-dots button.is-active::before {
  background: var(--ink);
  box-shadow: 0 0 0 5px rgba(26, 30, 35, 0.09);
  transform: translate(-50%, -50%) scale(1.08);
}

.zf-home .scene-transition {
  width: min(1200px, calc(100% - 64px));
  height: 80px;
  margin: 22px auto 0;
}

.zf-home .scene-transition-line {
  position: relative;
  display: grid;
  height: 100%;
  grid-template-columns: 34fr 33fr 33fr;
  align-items: center;
  container-type: inline-size;
}

.zf-home .scene-transition-line > span {
  height: 3px;
}

.zf-home .scene-transition-line > span:nth-child(1) { background: #ff8f78; }
.zf-home .scene-transition-line > span:nth-child(2) { background: #2468d7; }
.zf-home .scene-transition-line > span:nth-child(3) { background: #73d8ba; }

.zf-home .scene-transition-line > span + span {
  margin-left: -1px;
}

.zf-home .scene-transition-line::before,
.zf-home .scene-transition-line::after {
  position: absolute;
  top: 50%;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--ink);
  content: "";
  transform: translateY(-50%);
}

.zf-home .scene-transition-line::before { left: 0; }
.zf-home .scene-transition-line::after { right: 0; }

.zf-home .scene-transition-line > i {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 0;
  width: 12px;
  height: 12px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: #2468d7;
  box-shadow: 0 0 0 5px rgba(36, 104, 215, 0.15), 0 0 24px rgba(36, 104, 215, 0.7);
  transform: translate3d(-50%, -50%, 0);
}

.zf-home .scene-rail.is-motion-active .scene-transition-line > i {
  animation: scene-transition-dot 6.2s cubic-bezier(0.16, 1, 0.3, 1) infinite both;
}

.zf-home .evidence-shot {
  display: grid;
  width: min(var(--content), calc(100% - 64px));
  min-height: 620px;
  grid-template-columns: minmax(0, 1fr);
  margin: 96px auto 0;
  padding-top: 44px;
  border-top: 1px solid var(--line);
}

.zf-home .evidence-shot[data-evidence-state="unavailable"] {
  display: none;
}

.zf-home .evidence-column {
  display: none;
  align-content: start;
}

.zf-home .evidence-shot.has-evidence {
  grid-template-columns: 286px minmax(0, 1fr);
  gap: 54px;
}

.zf-home .evidence-shot.has-evidence .evidence-column {
  display: grid;
}

.zf-home .evidence-column h3 {
  margin-top: 20px;
  font-size: 28px;
  font-weight: 400;
  line-height: 1.35;
}

.zf-home .evidence-intro {
  margin-top: 16px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
}

.zf-home .evidence-column dl {
  display: none;
  margin-top: 35px;
  border-top: 1px solid var(--line-strong);
}

.zf-home .evidence-shot.has-evidence .evidence-column dl {
  display: block;
}

.zf-home .evidence-column dl > div {
  display: grid;
  min-height: 88px;
  align-content: center;
  gap: 8px;
  border-bottom: 1px solid var(--line);
}

.zf-home .evidence-column dt {
  color: var(--muted);
  font-size: 14px;
}

.zf-home .evidence-column dd {
  display: flex;
  align-items: center;
  gap: 12px;
}

.zf-home .evidence-column dd > span {
  width: 74px;
  height: 10px;
  border-radius: 999px;
  background: #e4e0dd;
}

.zf-home .evidence-column dd small {
  color: #94908c;
  font-size: 14px;
}

.zf-home .evidence-note {
  margin-top: 19px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.65;
}

.zf-home .evidence-media {
  position: relative;
  width: 100%;
  min-height: 540px;
  overflow: hidden;
  border-radius: var(--radius-media);
  background: #eee9e6;
}

.zf-home .evidence-media::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.08) 20%, rgba(255, 151, 128, 0.2) 100%);
  content: "";
  pointer-events: none;
}

.zf-home .evidence-media canvas {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
}

.zf-home .evidence-stage {
  position: absolute;
  z-index: 2;
  inset: 0;
}

.zf-home .evidence-node {
  position: absolute;
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  padding: 0 13px;
  border: 1px solid rgba(26, 30, 35, 0.13);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.8);
  box-shadow: 0 8px 24px rgba(26, 30, 35, 0.06);
  font-size: 14px;
}

.zf-home .node-incoming { top: 70px; left: 62px; }
.zf-home .node-context { top: 190px; left: 142px; }
.zf-home .node-quality { top: 92px; right: 76px; }
.zf-home .node-confirmed { right: 118px; bottom: 78px; border-color: #a9d3c3; color: var(--success); }

.zf-home .evidence-reply {
  position: absolute;
  top: 220px;
  right: 150px;
  display: grid;
  width: 320px;
  gap: 12px;
  padding: 22px;
  border: 1px solid rgba(26, 30, 35, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 18px 50px rgba(26, 30, 35, 0.08);
}

.zf-home .evidence-reply small {
  color: var(--muted);
  font-size: 14px;
}

.zf-home .evidence-reply p {
  font-size: 14px;
  line-height: 1.7;
}

.zf-home .auto-section {
  position: relative;
  overflow: hidden;
  padding: 132px 0 118px;
  background: #ff8f78;
  color: var(--ink);
}

.zf-home .capability-shell {
  display: grid;
  width: min(1320px, calc(100% - 64px));
  grid-template-columns: minmax(360px, 0.76fr) minmax(0, 1.24fr);
  align-items: center;
  gap: 72px;
  margin: 0 auto;
}

.zf-home .capability-copy {
  display: grid;
  align-content: center;
  gap: 22px;
}

.zf-home .capability-copy h2 {
  max-width: 540px;
  font-size: 54px;
  font-weight: 390;
  line-height: 1.16;
}

.zf-home .capability-copy > p:not(.pill-label) {
  max-width: 500px;
  color: rgba(26, 30, 35, 0.72);
  font-size: 17px;
  line-height: 1.72;
}

.zf-home .capability-modes {
  display: grid;
  margin-top: 14px;
  border-top: 1px solid rgba(26, 30, 35, 0.35);
  border-bottom: 1px solid rgba(26, 30, 35, 0.35);
}

.zf-home .capability-modes > div {
  display: grid;
  min-height: 88px;
  grid-template-columns: 14px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
}

.zf-home .capability-modes > div + div {
  border-top: 1px solid rgba(26, 30, 35, 0.2);
}

.zf-home .capability-modes > div > i {
  width: 11px;
  height: 11px;
  border: 2px solid rgba(26, 30, 35, 0.72);
  border-radius: 50%;
  background: transparent;
}

.zf-home .capability-modes > div:first-child > i {
  border-color: #fff;
  background: #2468d7;
  box-shadow: 0 0 0 5px rgba(36, 104, 215, 0.12);
}

.zf-home .capability-modes span {
  display: grid;
  gap: 5px;
}

.zf-home .capability-modes strong {
  font-size: 17px;
  font-weight: 620;
}

.zf-home .capability-modes small {
  color: rgba(26, 30, 35, 0.64);
  font-size: 14px;
  line-height: 1.45;
}

.zf-home .capability-motion {
  position: relative;
  display: grid;
  height: 520px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: end;
  gap: 32px;
  overflow: hidden;
  padding: 58px 20px 44px;
  border-top: 1px solid rgba(26, 30, 35, 0.34);
  border-bottom: 1px solid rgba(26, 30, 35, 0.34);
}

.zf-home .capability-motion::before {
  position: absolute;
  top: 44%;
  right: 7%;
  left: 7%;
  height: 1px;
  background: rgba(26, 30, 35, 0.36);
  content: "";
}

.zf-home .capability-motion-line {
  position: absolute;
  top: 44%;
  right: 7%;
  left: 7%;
  container-type: inline-size;
}

.zf-home .capability-motion-line > i {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: #2468d7;
  transform: translateY(-50%) scaleX(0);
  transform-origin: left center;
}

.zf-home .capability-motion-line > b {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 16px;
  height: 16px;
  border: 3px solid #ff8f78;
  border-radius: 50%;
  background: #2468d7;
  box-shadow: 0 0 0 7px rgba(36, 104, 215, 0.14), 0 0 30px rgba(36, 104, 215, 0.46);
  transform: translate3d(-50%, -50%, 0);
}

.zf-home .capability-motion-step {
  position: relative;
  display: grid;
  min-width: 0;
  gap: 8px;
  padding-top: 48px;
}

.zf-home .capability-motion-step::before {
  position: absolute;
  top: -198px;
  left: 0;
  width: 11px;
  height: 11px;
  border: 3px solid #ff8f78;
  border-radius: 50%;
  background: var(--ink);
  box-shadow: 0 0 0 5px rgba(26, 30, 35, 0.1);
  content: "";
}

.zf-home .capability-motion-step > span {
  color: rgba(26, 30, 35, 0.64);
  font-size: 14px;
  font-weight: 620;
}

.zf-home .capability-motion-step > strong {
  font-size: 56px;
  font-weight: 430;
  line-height: 1;
}

.zf-home .capability-motion-step > small {
  color: rgba(26, 30, 35, 0.68);
  font-size: 14px;
  line-height: 1.5;
}

.zf-home .auto-section.is-motion-active .capability-motion-line > i {
  animation: capability-line-progress 6.4s cubic-bezier(0.16, 1, 0.3, 1) infinite both;
}

.zf-home .auto-section.is-motion-active .capability-motion-line > b {
  animation: capability-route-dot 6.2s cubic-bezier(0.16, 1, 0.3, 1) infinite both;
}

.zf-home .auto-section.is-motion-active .capability-motion-step::before {
  animation: capability-step-pulse 6.4s var(--ease-standard) infinite both;
}

.zf-home .auto-section.is-motion-active .capability-motion-step:nth-of-type(3)::before { animation-delay: 360ms; }
.zf-home .auto-section.is-motion-active .capability-motion-step:nth-of-type(4)::before { animation-delay: 720ms; }

/* Windows download: release-aware action and one desktop object */

.zf-home .download-section {
  padding: 124px 0 128px;
  border-bottom: 1px solid var(--line);
  background: #f7fafc;
}

.zf-home .download-shell {
  display: grid;
  grid-template-columns: minmax(320px, 0.72fr) minmax(0, 1.28fr);
  align-items: center;
  gap: 78px;
}

.zf-home .download-copy {
  display: grid;
  align-content: center;
  gap: 18px;
}

.zf-home .download-copy h2 {
  margin-top: 2px;
}

.zf-home .download-copy [data-desktop-release-copy] {
  max-width: 430px;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.72;
}

.zf-home .download-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
  min-height: 46px;
  margin-top: 8px;
}

.zf-home .download-visual {
  position: relative;
  min-height: 430px;
  overflow: visible;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  box-shadow: none;
}

.zf-home .download-visual::before {
  display: none;
}

.zf-home .windows-mark {
  position: absolute;
  top: 44px;
  right: 34px;
  display: grid;
  width: 154px;
  height: 154px;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 6px;
  transform: perspective(520px) rotateY(-12deg) rotateX(3deg);
}

.zf-home .windows-mark i {
  display: block;
  background: #248fc4;
  transform-origin: center;
  will-change: transform, opacity, filter, box-shadow;
}

.zf-home .windows-mark i:nth-child(1) { --pane-x: -18px; --pane-y: -14px; --pane-delay: 0ms; }
.zf-home .windows-mark i:nth-child(2) { --pane-x: 18px; --pane-y: -14px; --pane-delay: 70ms; }
.zf-home .windows-mark i:nth-child(3) { --pane-x: -18px; --pane-y: 14px; --pane-delay: 140ms; }
.zf-home .windows-mark i:nth-child(4) { --pane-x: 18px; --pane-y: 14px; --pane-delay: 210ms; }

.zf-home .install-route {
  position: absolute;
  right: 0;
  bottom: 140px;
  left: 0;
  height: 24px;
}

.zf-home .install-route::before {
  position: absolute;
  top: 11px;
  right: 16.666%;
  left: 16.666%;
  height: 1px;
  background: #cadce4;
  content: "";
}

.zf-home .install-dot {
  position: absolute;
  top: 3px;
  left: 0;
  width: 33.333%;
  height: 18px;
  transform: translate3d(0, 0, 0);
  will-change: transform;
}

.zf-home .install-dot::before,
.zf-home .install-dot::after {
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  content: "";
  transform: translate(-50%, -50%);
}

.zf-home .install-dot::before {
  z-index: 1;
  width: 7px;
  height: 7px;
  background: #2a91d2;
  box-shadow: 0 0 0 4px rgba(42, 145, 210, 0.1), 0 0 10px 3px rgba(42, 145, 210, 0.52), 0 0 22px 5px rgba(42, 145, 210, 0.22);
}

.zf-home .install-dot::after {
  width: 30px;
  height: 9px;
  background: rgba(42, 145, 210, 0.34);
  filter: blur(6px);
  opacity: 0.86;
}

.zf-home .install-steps {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}

.zf-home .install-steps li {
  display: grid;
  min-width: 0;
  min-height: 128px;
  align-content: center;
  gap: 6px;
  padding: 20px 24px;
  border-left: 1px solid #dbe4e8;
}

.zf-home .install-steps li:first-child {
  border-left: 0;
}

.zf-home .install-steps b {
  color: #1c83b8;
  font-size: 25px;
  font-weight: 430;
}

.zf-home .install-steps strong {
  color: var(--ink);
  font-size: 16px;
  font-weight: 620;
}

.zf-home .install-steps span {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.55;
}

.zf-home .download-visual.is-motion-active .install-dot {
  animation: install-dot-route 6.4s var(--ease-standard) infinite both;
}

.zf-home .download-visual.is-motion-active .windows-mark {
  animation: windows-mark-sync 6.4s var(--ease-standard) infinite both;
  will-change: transform, opacity;
}

.zf-home .download-visual.is-motion-active .windows-mark i {
  animation: windows-pane-sync 6.4s var(--ease-standard) var(--pane-delay) infinite both;
}

.zf-home .download-visual.is-motion-active .install-steps li:nth-child(1) {
  animation: install-step-one 6.4s var(--ease-standard) infinite both;
}

.zf-home .download-visual.is-motion-active .install-steps li:nth-child(2) {
  animation: install-step-two 6.4s var(--ease-standard) infinite both;
}

.zf-home .download-visual.is-motion-active .install-steps li:nth-child(3) {
  animation: install-step-three 6.4s var(--ease-standard) infinite both;
}

.zf-home .download-section[data-desktop-release-state="ready"] .install-dot::before {
  background: #2a91d2;
}

.zf-home .download-section[data-desktop-release-state="unpublished"] .windows-mark i,
.zf-home .download-section[data-desktop-release-state="unavailable"] .windows-mark i {
  background: #b8c6cd;
}

.zf-home .trust-section {
  overflow: hidden;
  padding: 132px 0 0;
  border-top: 0;
  background: #c7f5ec;
  color: var(--ink);
}

.zf-home .trust-shell {
  width: min(1320px, calc(100% - 64px));
  margin: 0 auto;
}

.zf-home .trust-section > .trust-shell > .section-heading {
  width: 100%;
  max-width: 980px;
  justify-items: start;
  margin: 0;
  text-align: left;
}

.zf-home .heading-dark h2 {
  max-width: 920px;
}

.zf-home .heading-dark > p:last-child {
  color: var(--muted);
}

.zf-home .pill-dark {
  border-color: rgba(255, 151, 128, 0.72);
  color: var(--ink);
}

.zf-home .trust-composition {
  position: relative;
  display: grid;
  min-height: 640px;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, 0.82fr);
  align-items: center;
  gap: 74px;
  margin-bottom: 74px;
}

.zf-home .trust-decision-stage {
  position: relative;
  height: 640px;
  overflow: hidden;
  border-radius: 8px;
  background: #ff8f78;
  color: var(--ink);
}

.zf-home .trust-decision-stage::before {
  position: absolute;
  top: 48%;
  right: -12%;
  left: -12%;
  height: 168px;
  background: rgba(255, 255, 255, 0.22);
  content: "";
  transform: translateY(-50%) rotate(-3deg);
}

.zf-home .trust-decision {
  position: absolute;
  z-index: 2;
  display: grid;
  gap: 8px;
}

.zf-home .trust-decision-reply {
  top: 88px;
  left: 58px;
}

.zf-home .trust-decision-risk {
  top: 294px;
  right: 58px;
  text-align: right;
}

.zf-home .trust-decision small {
  color: rgba(26, 30, 35, 0.62);
  font-size: 14px;
  font-weight: 620;
}

.zf-home .trust-decision > strong {
  font-size: 46px;
  font-weight: 420;
  line-height: 1.04;
}

.zf-home .trust-decision-route {
  position: absolute;
  z-index: 2;
  top: 48%;
  right: 58px;
  left: 58px;
  height: 2px;
  background: rgba(26, 30, 35, 0.34);
  transform: rotate(-3deg);
  container-type: inline-size;
}

.zf-home .trust-decision-route > i {
  position: absolute;
  top: 50%;
  left: 0;
  width: 17px;
  height: 17px;
  border: 3px solid #ff8f78;
  border-radius: 50%;
  background: #2468d7;
  box-shadow: 0 0 0 7px rgba(36, 104, 215, 0.14), 0 0 28px rgba(36, 104, 215, 0.52);
  transform: translate3d(-50%, -50%, 0);
}

.zf-home .trust-decision-route > b {
  position: absolute;
  top: 50%;
  left: 68%;
  width: 42px;
  height: 42px;
  border: 10px solid #c7f5ec;
  border-radius: 50%;
  background: #ff8f78;
  box-shadow: 0 0 0 1px rgba(26, 30, 35, 0.28);
  transform: translate3d(-50%, -50%, 0);
}

.zf-home .trust-confirmation {
  position: absolute;
  right: 58px;
  bottom: 56px;
  left: 58px;
  display: flex;
  min-height: 88px;
  align-items: center;
  gap: 16px;
  border-top: 1px solid rgba(26, 30, 35, 0.3);
}

.zf-home .trust-confirmation > i {
  width: 13px;
  height: 13px;
  border: 3px solid #ff8f78;
  border-radius: 50%;
  background: #2b9a72;
  box-shadow: 0 0 0 7px rgba(43, 154, 114, 0.14), 0 0 24px rgba(43, 154, 114, 0.42);
}

.zf-home .trust-confirmation > span {
  display: grid;
  gap: 4px;
}

.zf-home .trust-confirmation small {
  color: rgba(26, 30, 35, 0.6);
  font-size: 14px;
}

.zf-home .trust-confirmation strong {
  font-size: 18px;
  font-weight: 620;
}

.zf-home .trust-copy {
  display: grid;
  align-content: center;
  gap: 22px;
}

.zf-home .trust-copy h2 {
  max-width: 520px;
  color: var(--ink);
  font-size: 52px;
  font-weight: 390;
  line-height: 1.16;
}

.zf-home .trust-copy > p:not(.pill-label) {
  max-width: 520px;
  color: rgba(26, 30, 35, 0.7);
  font-size: 17px;
  line-height: 1.72;
}

.zf-home .trust-section.is-motion-active .trust-decision-route > i {
  animation: trust-decision-dot 6.8s cubic-bezier(0.16, 1, 0.3, 1) infinite both;
}

.zf-home .trust-section.is-motion-active .trust-decision-route > b {
  animation: trust-decision-gate 6.8s var(--ease-standard) infinite both;
}

.zf-home .trust-section.is-motion-active .trust-confirmation > i {
  animation: trust-confirmation-pulse 6.8s var(--ease-standard) infinite both;
}

.zf-home .trust-guardrails {
  display: flex;
  min-height: 88px;
  align-items: center;
  justify-content: center;
  gap: 24px;
  border-top: 1px solid rgba(26, 30, 35, 0.2);
  border-bottom: 1px solid rgba(26, 30, 35, 0.2);
}

.zf-home .trust-guardrails span {
  color: rgba(26, 30, 35, 0.78);
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}

.zf-home .trust-guardrails > i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(26, 30, 35, 0.38);
}

.zf-home .closing-media {
  position: relative;
  display: grid;
  width: 100vw;
  min-height: 560px;
  place-items: center;
  overflow: hidden;
  margin-top: 96px;
  margin-left: calc(50% - 50vw);
  padding: 96px max(32px, calc((100vw - var(--content)) / 2));
  border-top: 1px solid rgba(169, 71, 49, 0.12);
  border-radius: 0;
  background: #f8e6e1;
}

.zf-home .closing-media::before {
  position: absolute;
  top: 0;
  left: 50%;
  width: 112px;
  height: 3px;
  border-radius: 0 0 999px 999px;
  background: var(--coral);
  content: "";
  transform: translateX(-50%);
  pointer-events: none;
}

.zf-home .closing-copy {
  position: relative;
  z-index: 2;
  display: grid;
  width: min(820px, 100%);
  justify-items: center;
  gap: 18px;
  text-align: center;
}

.zf-home .closing-kicker {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: #7b4c43;
  font-size: 14px;
  font-weight: 650;
}

.zf-home .closing-kicker i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--coral);
  box-shadow: 0 0 0 5px rgba(255, 151, 128, 0.14);
}

.zf-home .closing-copy h2 {
  max-width: 820px;
  color: var(--ink);
  font-size: 54px;
  font-weight: 520;
  line-height: 1.18;
  text-wrap: balance;
}

.zf-home .closing-summary {
  max-width: 620px;
  color: rgba(26, 30, 35, 0.72);
  font-size: 18px;
  line-height: 1.7;
}

.zf-home .closing-actions {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 10px;
}

.zf-home .closing-actions .zf-button {
  min-width: 192px;
  min-height: 56px;
  padding-inline: 28px;
  border-radius: 999px;
  transition: background-color var(--fast) var(--ease-out), border-color var(--fast) var(--ease-out), box-shadow var(--fast) var(--ease-out), transform var(--fast) var(--ease-out);
}

.zf-home .closing-media .closing-action-primary {
  border-color: var(--coral);
  background: var(--coral);
  color: var(--ink);
  box-shadow: 0 10px 24px rgba(169, 71, 49, 0.18);
}

.zf-home .closing-media .closing-action-primary:hover:not(:disabled) {
  border-color: #ff866d;
  background: #ff866d;
  box-shadow: 0 14px 30px rgba(169, 71, 49, 0.24);
  transform: translateY(-1px);
}

.zf-home .closing-media .closing-action-secondary {
  border-color: rgba(26, 30, 35, 0.62);
  background: transparent;
  color: var(--ink);
}

.zf-home .closing-media .closing-action-secondary:hover:not(:disabled) {
  border-color: var(--ink);
  background: rgba(255, 255, 255, 0.54);
  transform: translateY(-1px);
}

/* Scroll reveals play once; the unenhanced page remains at the readable end state. */

.zf-home.has-motion-reveal [data-motion-zone="capabilities"],
.zf-home.has-motion-reveal [data-motion-zone="trust"] {
  transition: opacity 240ms var(--ease-out), transform 420ms var(--ease-out);
}

.zf-home.has-motion-reveal [data-motion-zone="capabilities"]:not(.is-revealed),
.zf-home.has-motion-reveal [data-motion-zone="trust"]:not(.is-revealed) {
  opacity: 0;
  transform: translate3d(0, 12px, 0);
}

.zf-home.has-motion-reveal [data-motion-zone="closing"] .closing-copy {
  opacity: 0;
  transform: translate3d(0, 12px, 0);
}

.zf-home [data-motion-zone="capabilities"].is-revealed .capability-copy,
.zf-home [data-motion-zone="trust"].is-revealed .trust-copy {
  animation: section-copy-reveal 420ms var(--ease-out) both;
}

.zf-home [data-motion-zone="capabilities"].is-revealed .capability-motion,
.zf-home [data-motion-zone="trust"].is-revealed .trust-decision-stage {
  animation: section-media-reveal 620ms var(--ease-out) 100ms both;
}

.zf-home [data-motion-zone="trust"].is-revealed .trust-guardrails {
  animation: section-copy-reveal 440ms var(--ease-out) 420ms both;
}

.zf-home [data-motion-zone="closing"].is-revealed .closing-copy {
  animation: closing-copy-reveal 420ms var(--ease-out) both;
}

.zf-home .section-heading h2 span,
.zf-home .download-copy h2 span {
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

.zf-site-footer {
  display: grid;
  width: 100%;
  grid-template-columns: minmax(280px, 1.5fr) repeat(3, minmax(120px, 0.7fr));
  gap: 48px;
  margin: 0;
  padding: 76px max(32px, calc((100% - var(--content)) / 2)) 38px;
  background: var(--ink);
  color: #ffffff;
}

.zf-brand-light {
  color: #ffffff;
}

.zf-site-footer .footer-brand > p {
  max-width: 310px;
  margin-top: 20px;
  color: rgba(255, 255, 255, 0.62);
  font-size: 16px;
  line-height: 1.65;
}

.zf-site-footer nav {
  display: grid;
  align-content: start;
  gap: 11px;
}

.zf-site-footer nav strong {
  margin-bottom: 6px;
  font-size: 14px;
  font-weight: 650;
}

.zf-site-footer nav a {
  color: rgba(255, 255, 255, 0.68);
  font-size: 14px;
  line-height: 1.7;
  text-decoration: none;
  transition: color var(--fast) var(--ease-standard), transform var(--fast) var(--ease-out);
}

.zf-site-footer nav a:hover {
  color: var(--coral);
  transform: translateX(2px);
}

.zf-site-footer .footer-bottom {
  display: flex;
  grid-column: 1 / -1;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  color: rgba(255, 255, 255, 0.56);
  font-size: 14px;
}

.zf-site-footer .footer-legal {
  display: inline-flex;
  align-items: center;
  gap: 20px;
}

.zf-site-footer .footer-legal button {
  min-height: 34px;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.68);
  font-size: 14px;
  transition: color var(--fast) var(--ease-standard);
}

.zf-site-footer .footer-legal button:hover {
  color: var(--coral);
}

body.has-marketing-home .zf-home .contact-fab,
body.has-public-site .zf-public .contact-fab {
  position: fixed;
  z-index: 111;
  right: 24px;
  bottom: 24px;
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  gap: 9px;
  padding: 0 18px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  background: rgba(26, 30, 35, 0.94);
  color: #ffffff;
  box-shadow: 0 10px 26px rgba(26, 30, 35, 0.18);
  font-size: 14px;
  font-weight: 650;
  line-height: 1;
  backdrop-filter: blur(10px);
  transition: background-color var(--fast) var(--ease-standard), box-shadow var(--fast) var(--ease-standard), transform var(--fast) var(--ease-out);
}

body.has-marketing-home .zf-home .contact-fab > span,
body.has-public-site .zf-public .contact-fab > span {
  position: relative;
  width: 15px;
  height: 12px;
  border: 1.5px solid currentColor;
  border-radius: 5px;
}

body.has-marketing-home .zf-home .contact-fab > span::after,
body.has-public-site .zf-public .contact-fab > span::after {
  position: absolute;
  right: 1px;
  bottom: -4px;
  width: 5px;
  height: 5px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  content: "";
  transform: skewY(35deg);
}

body.has-marketing-home .zf-home .contact-fab:hover,
body.has-public-site .zf-public .contact-fab:hover {
  background: #30363b;
  box-shadow: 0 13px 30px rgba(26, 30, 35, 0.22);
  transform: translateY(-2px);
}

body.has-marketing-home .zf-home .contact-fab:active,
body.has-public-site .zf-public .contact-fab:active {
  transform: translateY(0);
}

body.has-marketing-home .zf-home .contact-fab:focus-visible,
body.has-public-site .zf-public .contact-fab:focus-visible,
body.has-marketing-home .zf-home .contact-dialog :focus-visible,
body.has-public-site .zf-public .contact-dialog :focus-visible {
  outline: 3px solid rgba(255, 255, 255, 0.92);
  outline-offset: 3px;
}

body.has-marketing-home .zf-home .contact-dialog,
body.has-public-site .zf-public .contact-dialog {
  position: fixed;
  z-index: 110;
  right: 24px;
  bottom: 84px;
  display: grid;
  width: 392px;
  height: clamp(420px, calc(100svh - 112px), 680px);
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  border: 1px solid rgba(124, 60, 46, 0.14);
  border-radius: 18px;
  background: linear-gradient(148deg, #ffc0b2 0%, #ff9b84 48%, #ffb6a6 100%);
  color: #1a1e23;
  box-shadow: 0 24px 64px rgba(60, 38, 33, 0.22), 0 4px 14px rgba(60, 38, 33, 0.1);
  opacity: 0;
  pointer-events: none;
  transform: translate3d(0, 16px, 0) scale(0.985);
  transform-origin: right bottom;
  visibility: hidden;
  transition: opacity 180ms var(--ease-standard), transform 220ms cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 220ms;
}

body.has-marketing-home .zf-home .contact-dialog::before,
body.has-public-site .zf-public .contact-dialog::before {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(115deg, rgba(255, 255, 255, 0.24), transparent 34%),
    repeating-linear-gradient(90deg, transparent 0 31px, rgba(255, 255, 255, 0.055) 31px 32px);
  content: "";
  pointer-events: none;
}

body.has-marketing-home .zf-home .contact-dialog.is-open,
body.has-public-site .zf-public .contact-dialog.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0, 0, 0) scale(1);
  visibility: visible;
  transition-delay: 0s;
}

.contact-dialog-header,
.contact-dialog-body,
.contact-composer {
  position: relative;
  z-index: 1;
}

.contact-dialog-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 22px 16px;
}

.contact-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.contact-brand .zf-brand-mark {
  width: 38px;
  height: 38px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: inset 0 0 0 1px rgba(26, 30, 35, 0.08);
}

.contact-brand > span:last-child {
  display: grid;
  gap: 2px;
}

.contact-brand strong {
  font-size: 19px;
  line-height: 1.25;
}

.contact-brand small {
  color: rgba(26, 30, 35, 0.62);
  font-size: 14px;
}

.contact-close {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  place-items: center;
  border: 1px solid rgba(26, 30, 35, 0.08);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.68);
  color: #1a1e23;
  font-size: 26px;
  font-weight: 300;
  line-height: 1;
  transition: background-color var(--fast) var(--ease-standard), transform var(--fast) var(--ease-out);
}

.contact-close:hover {
  background: #ffffff;
  transform: rotate(4deg);
}

.contact-dialog-body {
  display: flex;
  min-height: 0;
  flex-direction: column;
  padding: 0 22px 12px;
}

.contact-intro {
  max-width: 310px;
  margin: 0 0 16px;
  color: rgba(26, 30, 35, 0.72);
  font-size: 16px;
  line-height: 1.6;
}

.contact-topics {
  display: grid;
  justify-items: start;
  gap: 10px;
  margin: 0;
  padding: 0;
  border: 0;
}

.contact-topics label {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  cursor: pointer;
}

.contact-topics input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
}

.contact-topics span {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  padding: 0 17px;
  border: 1px solid rgba(26, 30, 35, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.62);
  box-shadow: 0 4px 12px rgba(87, 47, 39, 0.07);
  color: #24292e;
  font-size: 16px;
  transition: background-color var(--fast) var(--ease-standard), border-color var(--fast) var(--ease-standard), box-shadow var(--fast) var(--ease-standard), transform var(--fast) var(--ease-out);
}

.contact-topics label:hover span {
  background: rgba(255, 255, 255, 0.86);
  transform: translateX(3px);
}

.contact-topics input:checked + span {
  border-color: rgba(26, 30, 35, 0.5);
  background: #ffffff;
  box-shadow: 0 7px 18px rgba(87, 47, 39, 0.12);
}

.contact-topics input:focus-visible + span {
  outline: 3px solid rgba(255, 255, 255, 0.92);
  outline-offset: 3px;
}

.contact-thread {
  display: flex;
  min-height: 58px;
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: flex-end;
  gap: 10px;
  overflow: auto;
  margin-top: 14px;
  padding: 4px 2px;
  scrollbar-width: thin;
  scrollbar-color: rgba(26, 30, 35, 0.25) transparent;
}

.contact-thread-empty {
  margin: 0;
  color: rgba(26, 30, 35, 0.54);
  font-size: 14px;
}

.contact-message {
  width: fit-content;
  max-width: 86%;
  margin-left: auto;
  padding: 11px 13px 9px;
  border: 1px solid rgba(26, 30, 35, 0.08);
  border-radius: 14px 14px 4px 14px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 6px 18px rgba(87, 47, 39, 0.08);
}

.contact-message p {
  margin: 0;
  color: #20252a;
  font-size: 16px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.contact-message small {
  display: block;
  margin-top: 5px;
  color: rgba(26, 30, 35, 0.52);
  font-size: 14px;
  text-align: right;
}

.contact-test-note {
  margin: 8px 0 0;
  color: rgba(26, 30, 35, 0.62);
  font-size: 14px;
}

.contact-composer {
  margin: 0 12px 12px;
  padding: 12px;
  border: 1px solid rgba(26, 30, 35, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 8px 24px rgba(87, 47, 39, 0.1);
  backdrop-filter: blur(12px);
}

.contact-composer textarea {
  display: block;
  width: 100%;
  min-height: 68px;
  max-height: 130px;
  resize: vertical;
  border: 0;
  outline: 0;
  background: transparent;
  color: #1a1e23;
  font: inherit;
  font-size: 16px;
  line-height: 1.55;
}

.contact-composer textarea::placeholder {
  color: rgba(26, 30, 35, 0.46);
}

.contact-consent {
  display: flex;
  min-height: 32px;
  align-items: center;
  gap: 5px;
  color: rgba(26, 30, 35, 0.66);
  font-size: 14px;
}

.contact-consent input {
  width: 16px;
  height: 16px;
  margin: 0 2px 0 0;
  accent-color: #1a1e23;
}

.contact-consent button {
  min-height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #1a1e23;
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.contact-composer-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 10px;
}

.contact-feedback {
  min-height: 20px;
}

.contact-feedback p {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
}

.contact-feedback [role="alert"] {
  color: #8f2f27;
}

.contact-feedback [role="status"] {
  color: #176746;
}

.contact-send {
  min-width: 70px;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid #1a1e23;
  border-radius: 999px;
  background: #1a1e23;
  color: #ffffff;
  font-size: 14px;
  font-weight: 650;
  transition: background-color var(--fast) var(--ease-standard), transform var(--fast) var(--ease-out);
}

.contact-send:hover:not(:disabled) {
  background: #343a40;
  transform: translateY(-1px);
}

.contact-send:disabled {
  border-color: rgba(26, 30, 35, 0.1);
  background: rgba(26, 30, 35, 0.12);
  color: rgba(26, 30, 35, 0.42);
  cursor: not-allowed;
}

/* Secondary public pages retain the same shell and type system */

.zf-public-main {
  min-height: 720px;
  padding-top: 118px;
  background: #ffffff;
}

.zf-public-page-header,
.zf-public .public-content {
  width: min(var(--content), calc(100% - 64px));
  margin-inline: auto;
}

.zf-public-page-header {
  display: grid;
  gap: 14px;
  padding: 76px 0 48px;
  border-bottom: 1px solid var(--line);
}

.zf-public-page-header > span {
  color: var(--coral-deep);
  font-size: 14px;
  font-weight: 700;
}

.zf-public-page-header h1 {
  font-size: 48px;
  font-weight: 430;
  line-height: 1.2;
}

.zf-public-page-header p {
  max-width: 760px;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.72;
}

.zf-public .public-content {
  padding: 42px 0 88px;
}

.zf-public .primary-button,
body.has-public-site .auth-submit {
  border-color: var(--ink);
  background: var(--ink);
  color: #ffffff;
}

.zf-public .primary-button:not(:disabled):hover,
body.has-public-site .auth-submit:not(:disabled):hover {
  border-color: var(--ink-soft);
  background: var(--ink-soft);
}

body.has-public-site .zf-public small,
body.has-public-site .zf-public .inline-notice strong,
body.has-public-site .zf-public .comparison-table thead th span,
body.has-public-site .zf-public .section-heading > div > span,
body.has-public-site .zf-public .section-heading > small,
body.has-public-site .zf-public .step-index {
  font-size: 14px;
}

body.has-public-site .zf-public .inline-notice small,
body.has-public-site .zf-public .download-band em {
  font-size: 16px;
  line-height: 1.65;
}

/* Authentication keeps the shared palette while remaining task-focused */

body.has-public-site .auth-page {
  background: #ffffff;
  color: var(--text);
  font-size: 16px;
}

body.has-public-site .auth-value-panel {
  border-right-color: var(--line);
  background: var(--soft);
}

body.has-public-site .auth-value-panel > div > span,
body.has-public-site .auth-value-panel li b {
  color: var(--coral-deep);
  font-size: 14px;
}

body.has-public-site .auth-value-panel h1 {
  max-width: 640px;
  font-size: 42px;
  font-weight: 430;
  line-height: 1.25;
}

body.has-public-site .auth-value-panel p,
body.has-public-site .auth-heading p {
  font-size: 16px;
}

body.has-public-site .auth-value-panel li strong,
body.has-public-site .auth-brand strong,
body.has-public-site .auth-form-shell > header strong,
body.has-public-site .auth-field label,
body.has-public-site .auth-form > label:not(.agreement-row) {
  font-size: 16px;
}

body.has-public-site .auth-value-panel li small,
body.has-public-site .auth-brand small,
body.has-public-site .auth-form-shell > header small,
body.has-public-site .auth-form-shell > footer,
body.has-public-site .agreement-row,
body.has-public-site .field-error,
body.has-public-site .form-alert span {
  font-size: 14px;
}

body.has-public-site .auth-tabs button.active,
body.has-public-site .auth-back:hover,
body.has-public-site .password-field button,
body.has-public-site .agreement-row button {
  color: var(--coral-deep);
}

body.has-public-site .auth-tabs button.active::after {
  background: var(--coral);
}

@keyframes install-dot-route {
  0%, 8%, 100% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
  }
  12% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
  }
  36% {
    opacity: 1;
    transform: translate3d(100%, 0, 0);
  }
  40% {
    opacity: 1;
    transform: translate3d(100%, 0, 0);
    animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
  }
  70%, 82% {
    opacity: 1;
    transform: translate3d(200%, 0, 0);
  }
  90% {
    opacity: 0;
    transform: translate3d(200%, 0, 0);
  }
  96% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes windows-mark-sync {
  0%, 7%, 100% {
    opacity: 0.72;
    transform: perspective(520px) rotateY(-12deg) rotateX(3deg) translate3d(0, 12px, 0) scale(0.92);
  }
  18%, 66% {
    opacity: 1;
    transform: perspective(520px) rotateY(-12deg) rotateX(3deg) translate3d(0, 0, 0) scale(1);
  }
  72%, 82% {
    opacity: 1;
    transform: perspective(520px) rotateY(-12deg) rotateX(3deg) translate3d(0, -3px, 0) scale(1.045);
  }
  92% {
    opacity: 0.82;
    transform: perspective(520px) rotateY(-12deg) rotateX(3deg) translate3d(0, 0, 0) scale(0.985);
  }
}

@keyframes windows-pane-sync {
  0%, 7%, 100% {
    opacity: 0.34;
    filter: saturate(0.64) brightness(1.16);
    box-shadow: 0 0 0 rgba(89, 126, 143, 0);
    transform: translate3d(var(--pane-x), var(--pane-y), 0) scale(0.76);
  }
  17%, 66% {
    opacity: 1;
    filter: saturate(1) brightness(1);
    box-shadow: 0 0 0 rgba(89, 126, 143, 0);
    transform: translate3d(0, 0, 0) scale(1);
  }
  72%, 82% {
    opacity: 1;
    filter: saturate(1.08) brightness(1.18);
    box-shadow: 0 0 24px rgba(89, 126, 143, 0.24);
    transform: translate3d(0, 0, 0) scale(1.06);
  }
  92% {
    opacity: 0.84;
    filter: saturate(0.88) brightness(1.04);
    box-shadow: 0 0 0 rgba(89, 126, 143, 0);
    transform: translate3d(0, 0, 0) scale(0.985);
  }
}

@keyframes install-step-one {
  0%, 8%, 100% { opacity: 0.58; transform: translate3d(0, 4px, 0); }
  12%, 30% { opacity: 1; transform: translate3d(0, -5px, 0); }
  38%, 94% { opacity: 0.64; transform: translate3d(0, 0, 0); }
}

@keyframes install-step-two {
  0%, 28%, 100% { opacity: 0.58; transform: translate3d(0, 4px, 0); }
  36%, 56% { opacity: 1; transform: translate3d(0, -5px, 0); }
  64%, 94% { opacity: 0.64; transform: translate3d(0, 0, 0); }
}

@keyframes install-step-three {
  0%, 56%, 100% { opacity: 0.58; transform: translate3d(0, 4px, 0); }
  64%, 84% { opacity: 1; transform: translate3d(0, -5px, 0); }
  92%, 94% { opacity: 0.72; transform: translate3d(0, 0, 0); }
}

@keyframes bento-guide-window {
  0%, 12%, 100% {
    opacity: 1;
    transform: translate(-50%, -49%) scale(1);
  }
  24%, 70% {
    opacity: 1;
    transform: translate(-68%, -49%) scale(1);
  }
  84%, 92% {
    opacity: 1;
    transform: translate(-50%, -49%) scale(1);
  }
}

@keyframes bento-rule-highlight {
  0%, 14%, 100% {
    border-color: transparent;
    background-color: #f7f8f8;
    opacity: 0.72;
    transform: translate3d(0, 0, 0);
  }
  24%, 46% {
    border-color: rgba(255, 151, 128, 0.38);
    background-color: rgba(255, 228, 221, 0.58);
    opacity: 1;
    transform: translate3d(3px, 0, 0);
  }
  62%, 88% {
    border-color: transparent;
    background-color: #f7f8f8;
    opacity: 0.84;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bento-conversation-window {
  0%, 16%, 100% {
    opacity: 0;
    transform: translate(70%, -43%) scale(0.96);
  }
  21% {
    opacity: 0;
    transform: translate(70%, -43%) scale(0.96);
  }
  22% {
    opacity: 1;
    transform: translate(70%, -43%) scale(0.96);
  }
  28%, 72% {
    opacity: 1;
    transform: translate(8%, -43%) scale(1);
  }
  82% {
    opacity: 1;
    transform: translate(18%, -43%) scale(0.985);
  }
  88% {
    opacity: 1;
    transform: translate(70%, -43%) scale(0.96);
  }
  92% {
    opacity: 0;
    transform: translate(70%, -43%) scale(0.96);
  }
}

@keyframes bento-thinking-state {
  0%, 28%, 100% {
    opacity: 0;
    transform: translate3d(0, 6px, 0);
  }
  35%, 46% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  54%, 90% {
    opacity: 0;
    transform: translate3d(0, -3px, 0);
  }
}

@keyframes bento-answer-state {
  0%, 44%, 100% {
    opacity: 0;
    transform: translate3d(0, 10px, 0) scale(0.985);
  }
  53%, 70% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
  81%, 92% {
    opacity: 0;
    transform: translate3d(0, -5px, 0) scale(0.99);
  }
}

@keyframes bento-pointer-close {
  0%, 68%, 100% {
    opacity: 0;
    transform: translate3d(-60px, 42px, 0) rotate(-12deg);
  }
  74% {
    opacity: 1;
    transform: translate3d(-60px, 42px, 0) rotate(-12deg);
  }
  82% {
    opacity: 1;
    transform: translate3d(0, 0, 0) rotate(-12deg);
  }
  90% {
    opacity: 0;
    transform: translate3d(8px, -5px, 0) rotate(-12deg);
  }
}

@keyframes bento-orbit-ring {
  0%, 8%, 100% {
    opacity: 0.28;
    transform: translate(-50%, -50%) scale(0.56);
  }
  18% {
    opacity: 0.7;
    transform: translate(-50%, -50%) scale(1.04);
  }
  42% {
    opacity: 0.48;
    transform: translate(-50%, -50%) scale(0.86);
  }
  62% {
    opacity: 0.72;
    transform: translate(-50%, -50%) scale(1);
  }
  84% {
    opacity: 0.34;
    transform: translate(-50%, -50%) scale(0.66);
  }
}

@keyframes bento-orbit-core {
  0%, 8%, 100% {
    transform: translate(-50%, -50%) scale(0.92);
    box-shadow: 0 8px 20px rgba(70, 52, 46, 0.08);
  }
  22%, 68% {
    transform: translate(-50%, -50%) scale(1);
    box-shadow: 0 13px 30px rgba(255, 122, 97, 0.16);
  }
  86% {
    transform: translate(-50%, -50%) scale(0.94);
    box-shadow: 0 8px 20px rgba(70, 52, 46, 0.08);
  }
}

@keyframes bento-orbit-node {
  0%, 12%, 100% {
    opacity: 0;
    transform: translate(-50%, -50%) translate(0, 0) scale(0.64);
  }
  25%, 64% {
    opacity: 1;
    transform: translate(-50%, -50%) translate(var(--node-x), var(--node-y)) scale(1);
  }
  78% {
    opacity: 0.7;
    transform: translate(-50%, -50%) translate(var(--node-x), var(--node-y)) scale(0.92);
  }
  90% {
    opacity: 0;
    transform: translate(-50%, -50%) translate(0, 0) scale(0.68);
  }
}

@keyframes bento-after-buyer {
  0%, 8%, 100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
  76% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
  90% {
    opacity: 0.58;
    transform: translate3d(0, -5px, 0) scale(0.99);
  }
}

@keyframes bento-after-context {
  0%, 14%, 100% {
    opacity: 0;
    transform: translate3d(var(--after-shift, 0px), 14px, 0) scale(0.97);
  }
  25%, 60% {
    opacity: 1;
    transform: translate3d(var(--after-shift, 0px), 0, 0) scale(1);
  }
  74% {
    opacity: 0.68;
    transform: translate3d(var(--after-shift, 0px), -3px, 0) scale(0.99);
  }
  86% {
    opacity: 0;
    transform: translate3d(var(--after-shift, 0px), -8px, 0) scale(0.98);
  }
}

@keyframes bento-after-reply {
  0%, 42%, 100% {
    opacity: 0;
    transform: translate3d(0, 12px, 0) scale(0.98);
  }
  51%, 76% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
  87% {
    opacity: 0.48;
    transform: translate3d(0, -4px, 0) scale(0.99);
  }
  94% {
    opacity: 0;
    transform: translate3d(0, -8px, 0) scale(0.98);
  }
}

@keyframes bento-after-confirm {
  0%, 62%, 100% {
    opacity: 0;
    transform: translate3d(-12px, 0, 0) scale(0.96);
  }
  71%, 86% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
  95% {
    opacity: 0;
    transform: translate3d(6px, 0, 0) scale(0.98);
  }
}

@keyframes section-copy-reveal {
  from {
    opacity: 0;
    transform: translate3d(0, 18px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes section-step-reveal {
  from {
    opacity: 0;
    transform: translate3d(0, 12px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes closing-copy-reveal {
  from {
    opacity: 0;
    transform: translate3d(0, 12px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes section-media-reveal {
  from {
    opacity: 0;
    transform: translate3d(22px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes scene-transition-dot {
  0% {
    opacity: 0;
    transform: translate3d(-50%, -50%, 0) scale(0.72);
  }
  8% {
    opacity: 1;
  }
  34% {
    transform: translate3d(calc(68cqw - 50%), -50%, 0) scale(1);
  }
  72% {
    transform: translate3d(calc(94cqw - 50%), -50%, 0) scale(0.94);
  }
  88% {
    opacity: 1;
    transform: translate3d(calc(100cqw - 50%), -50%, 0) scale(0.86);
  }
  100% {
    opacity: 0;
    transform: translate3d(calc(100cqw - 50%), -50%, 0) scale(0.72);
  }
}

@keyframes scene-message-arrival {
  0%, 8%, 100% { opacity: 0.42; transform: translate3d(18px, 0, 0); }
  18%, 72% { opacity: 1; transform: translate3d(0, 0, 0); }
  88% { opacity: 0.62; transform: translate3d(-4px, 0, 0); }
}

@keyframes accuracy-line-arrival {
  0%, 12%, 100% { opacity: 0; transform: rotate(var(--line-angle)) scaleX(0); }
  34%, 78% { opacity: 1; transform: rotate(var(--line-angle)) scaleX(1); }
  92% { opacity: 0.28; transform: rotate(var(--line-angle)) scaleX(1); }
}

@keyframes accuracy-focus-pulse {
  0%, 24%, 100% { box-shadow: 0 0 0 18px rgba(255, 255, 255, 0.04), 0 28px 80px rgba(6, 18, 45, 0.22); transform: translateY(-50%) scale(0.96); }
  42%, 76% { box-shadow: 0 0 0 34px rgba(255, 255, 255, 0.09), 0 28px 80px rgba(6, 18, 45, 0.3); transform: translateY(-50%) scale(1); }
}

@keyframes aftersales-route-dot {
  0%, 8%, 100% { opacity: 0; transform: translate3d(-50%, -50%, 0) scale(0.72); }
  17% { opacity: 1; }
  54%, 68% { opacity: 1; transform: translate3d(calc(63cqw - 50%), -50%, 0) scale(1); }
  88% { opacity: 1; transform: translate3d(calc(100cqw - 50%), -50%, 0) scale(0.9); }
  96% { opacity: 0; transform: translate3d(calc(100cqw - 50%), -50%, 0) scale(0.78); }
}

@keyframes aftersales-gate {
  0%, 42%, 100% { transform: translate3d(-50%, -50%, 0) scale(0.92); }
  54%, 72% { transform: translate3d(-50%, -50%, 0) scale(1.08); }
}

@keyframes capability-line-progress {
  0%, 8%, 100% { opacity: 0.45; transform: translateY(-50%) scaleX(0); }
  76%, 90% { opacity: 1; transform: translateY(-50%) scaleX(1); }
}

@keyframes capability-route-dot {
  0%, 8%, 100% { opacity: 0; transform: translate3d(-50%, -50%, 0) scale(0.74); }
  16% { opacity: 1; }
  76%, 90% { opacity: 1; transform: translate3d(calc(100cqw - 50%), -50%, 0) scale(1); }
  98% { opacity: 0; transform: translate3d(calc(100cqw - 50%), -50%, 0) scale(0.82); }
}

@keyframes capability-step-pulse {
  0%, 12%, 100% { opacity: 0.52; transform: scale(0.88); }
  34%, 74% { opacity: 1; transform: scale(1); }
}

@keyframes trust-decision-dot {
  0%, 8%, 100% { opacity: 0; transform: translate3d(-50%, -50%, 0) scale(0.72); }
  16% { opacity: 1; }
  56%, 72% { opacity: 1; transform: translate3d(calc(68cqw - 50%), -50%, 0) scale(1); }
  90% { opacity: 1; transform: translate3d(calc(100cqw - 50%), -50%, 0) scale(0.9); }
  98% { opacity: 0; transform: translate3d(calc(100cqw - 50%), -50%, 0) scale(0.78); }
}

@keyframes trust-decision-gate {
  0%, 44%, 100% { transform: translate3d(-50%, -50%, 0) scale(0.9); }
  56%, 76% { transform: translate3d(-50%, -50%, 0) scale(1.08); }
}

@keyframes trust-confirmation-pulse {
  0%, 64%, 100% { opacity: 0.46; transform: scale(0.82); }
  76%, 92% { opacity: 1; transform: scale(1); }
}

@media (min-width: 1600px) {
  .zf-home .hero-copy h1 {
    font-size: 76px;
  }

  .zf-home .section-heading h2,
  .zf-home .download-copy h2 {
    font-size: 44px;
  }

  .zf-home .scene-window {
    height: 660px;
  }

  .zf-home .slide-copy h3 {
    font-size: 58px;
  }

  .zf-home .capability-copy h2 {
    font-size: 58px;
  }
}

@media (max-width: 1399px) {
  .floating-nav nav {
    gap: 18px;
  }

  .zf-home .hero-shell {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .zf-home .hero-copy h1 {
    font-size: 68px;
  }

  .zf-home .section-heading h2,
  .zf-home .download-copy h2 {
    font-size: 40px;
  }

  .zf-home .scene-window {
    height: 560px;
  }

  .zf-home .capability-copy h2 {
    font-size: 50px;
  }
}

@media (max-width: 1199px) {
  .home-shell,
  .zf-public-page-header,
  .zf-public .public-content {
    width: min(var(--content), calc(100% - 56px));
  }

  .floating-nav {
    width: calc(100% - 40px);
    grid-template-columns: minmax(164px, 1fr) auto minmax(164px, 1fr);
    gap: 14px;
    padding-inline: 16px;
  }

  .floating-nav nav {
    gap: 14px;
  }

  .nav-actions {
    gap: 12px;
  }

  .zf-home .hero-shell {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .zf-home .hero-copy h1 {
    font-size: 68px;
  }

  .zf-home .bridge-copy {
    padding-top: 0;
  }

  .zf-home .bridge h2 {
    font-size: 39px;
  }

  .zf-home .bento-panel {
    min-height: 430px;
    padding: 24px;
  }

  .zf-home .bento-panel h3 {
    font-size: 23px;
  }

  .zf-home .bento-guide-window {
    --bento-guide-static-x: -88%;
    width: 328px;
  }

  .zf-home .bento-conversation-window {
    --bento-conversation-static-x: 16%;
    width: 244px;
  }

  .zf-home .bento-orbit-stage {
    width: 238px;
    min-height: 238px;
  }

  .zf-home .bento-orbit-ring.ring-inner { width: 96px; height: 96px; }
  .zf-home .bento-orbit-ring.ring-outer { width: 190px; height: 190px; }
  .zf-home .bento-orbit-core { width: 60px; height: 60px; }
  .zf-home .bento-orbit-node { width: 52px; }
  .zf-home .bento-orbit-node i { width: 40px; height: 40px; }
  .zf-home .node-knowledge { --node-x: 0px; --node-y: -86px; }
  .zf-home .node-product { --node-x: 76px; --node-y: -43px; }
  .zf-home .node-order { --node-x: 76px; --node-y: 43px; }
  .zf-home .node-dialogue { --node-x: 0px; --node-y: 86px; }
  .zf-home .node-policy { --node-x: -76px; --node-y: 43px; }
  .zf-home .node-result { --node-x: -76px; --node-y: -43px; }

  .zf-home .scene-window {
    width: calc(100% - 56px);
    height: 540px;
  }

  .zf-home .slide-copy {
    bottom: 56px;
    left: 56px;
  }

  .zf-home .slide-copy h3 {
    font-size: 46px;
  }

  .zf-home .rail-prev {
    left: 18px;
  }

  .zf-home .rail-next {
    right: 18px;
  }

  .zf-home .scene-transition {
    width: calc(100% - 56px);
  }

  .zf-home .evidence-shot.has-evidence {
    grid-template-columns: 248px minmax(0, 1fr);
    gap: 38px;
  }

  .zf-home .evidence-reply {
    right: 78px;
    width: 290px;
  }

  .zf-home .capability-shell {
    grid-template-columns: minmax(330px, 0.78fr) minmax(0, 1.22fr);
    gap: 46px;
  }

  .zf-home .capability-motion {
    height: 500px;
    gap: 22px;
  }

  .zf-home .capability-motion-step > strong {
    font-size: 46px;
  }

  .zf-home .download-shell {
    gap: 58px;
  }

  .zf-home .download-visual {
    padding: 0;
  }

  .zf-home .closing-media {
    min-height: 540px;
    padding-inline: 28px;
  }

  .zf-home .closing-copy h2 {
    font-size: 48px;
  }

  .zf-home .trust-composition {
    min-height: 580px;
    grid-template-columns: minmax(0, 1.1fr) minmax(330px, 0.9fr);
    gap: 44px;
  }

  .zf-home .trust-decision-stage {
    height: 580px;
  }

  .zf-home .trust-copy h2 {
    font-size: 46px;
  }

  .zf-site-footer {
    gap: 34px;
  }
}

@media (max-width: 980px) {
  .home-shell,
  .zf-public-page-header,
  .zf-public .public-content {
    width: calc(100% - 48px);
  }

  .floating-nav {
    top: 16px;
    width: calc(100% - 32px);
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: 10px;
    padding-inline: 12px;
  }

  .zf-brand strong {
    display: none;
  }

  .floating-nav nav {
    display: flex;
    min-width: 0;
    gap: 9px;
  }

  .floating-nav nav a {
    min-height: 40px;
    font-size: 14px;
  }

  .nav-actions {
    gap: 8px;
  }

  .zf-button-nav {
    padding-inline: 12px;
  }

  body.has-marketing-home .zf-home .contact-fab,
  body.has-public-site .zf-public .contact-fab {
    right: 16px;
    bottom: 16px;
  }

  body.has-marketing-home .zf-home .contact-dialog,
  body.has-public-site .zf-public .contact-dialog {
    right: 16px;
    bottom: 76px;
    width: min(392px, calc(100vw - 32px));
    height: clamp(420px, calc(100svh - 92px), 680px);
  }

  .zf-home .home-hero {
    min-height: 680px;
  }

  .zf-home .hero-shell {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    padding-top: 100px;
  }

  .zf-home .hero-copy {
    gap: 18px;
  }

  .zf-home .hero-copy h1 {
    font-size: 68px;
  }

  .zf-home .hero-claim {
    font-size: 28px;
  }

  .zf-home .hero-actions {
    gap: 10px;
  }

  .zf-home .hero-actions .zf-button {
    min-height: 56px;
    padding-inline: 30px;
    font-size: 16px;
  }

  .zf-home .bridge {
    min-height: auto;
    padding: 104px 0 96px;
  }

  .zf-home .bridge h2 {
    font-size: 36px;
  }

  .zf-home .bento-grid {
    gap: 14px;
  }

  .zf-home .bento-panel {
    min-height: 400px;
    padding: 21px;
  }

  .zf-home .bento-panel h3 {
    font-size: 21px;
  }

  .zf-home .bento-panel header p {
    font-size: 14px;
  }

  .zf-home .bento-guide-window {
    --bento-guide-static-x: -85%;
    width: 284px;
  }

  .zf-home .bento-conversation-window {
    --bento-conversation-static-x: 21%;
    width: 202px;
  }

  .zf-home .bento-pointer-close {
    left: calc(50% + 183px);
  }

  .zf-home .bento-orbit-stage {
    width: 218px;
    min-height: 218px;
  }

  .zf-home .bento-orbit-ring.ring-inner { width: 88px; height: 88px; }
  .zf-home .bento-orbit-ring.ring-outer { width: 172px; height: 172px; }
  .zf-home .bento-orbit-core { width: 56px; height: 56px; }
  .zf-home .bento-orbit-node { width: 48px; }
  .zf-home .bento-orbit-node i { width: 38px; height: 38px; }
  .zf-home .node-knowledge { --node-x: 0px; --node-y: -78px; }
  .zf-home .node-product { --node-x: 68px; --node-y: -39px; }
  .zf-home .node-order { --node-x: 68px; --node-y: 39px; }
  .zf-home .node-dialogue { --node-x: 0px; --node-y: 78px; }
  .zf-home .node-policy { --node-x: -68px; --node-y: 39px; }
  .zf-home .node-result { --node-x: -68px; --node-y: -39px; }

  .zf-home .bento-after-dialogue {
    min-height: 450px;
  }

  .zf-home .bento-after-reply {
    right: 0;
    width: 306px;
  }

  .zf-home .bento-after-confirm {
    left: 0;
  }

  .zf-home .scene-window {
    width: calc(100% - 40px);
    height: 500px;
  }

  .zf-home .slide-copy {
    bottom: 44px;
    left: 44px;
    width: calc(100% - 88px);
  }

  .zf-home .slide-copy h3 {
    font-size: 40px;
  }

  .zf-home .slide-copy p {
    font-size: 16px;
  }

  .zf-home .scene-transition {
    width: calc(100% - 48px);
  }

  .zf-home .scene-photo-ui {
    right: 36px;
    width: 270px;
  }

  .zf-home .accuracy-source::after {
    width: 250px;
  }

  .zf-home .accuracy-focus {
    right: 10%;
    width: 142px;
    height: 142px;
  }

  .zf-home .aftersales-actions {
    gap: 12px;
  }

  .zf-home .aftersales-actions span {
    width: 72px;
    height: 72px;
    font-size: 16px;
  }

  .zf-home .evidence-shot {
    min-height: 520px;
  }

  .zf-home .evidence-shot.has-evidence {
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 28px;
  }

  .zf-home .evidence-column h3 {
    font-size: 24px;
  }

  .zf-home .evidence-media {
    min-height: 490px;
  }

  .zf-home .evidence-reply {
    top: 210px;
    right: 42px;
    width: 250px;
  }

  .zf-home .node-context {
    left: 82px;
  }

  .zf-home .capability-shell {
    width: calc(100% - 48px);
    grid-template-columns: minmax(280px, 0.76fr) minmax(0, 1.24fr);
    gap: 28px;
  }

  .zf-home .capability-copy h2 {
    font-size: 40px;
  }

  .zf-home .capability-motion {
    height: 440px;
    gap: 14px;
    padding-inline: 10px;
  }

  .zf-home .capability-motion-step > strong {
    font-size: 36px;
  }

  .zf-home .capability-motion-step > small {
    font-size: 14px;
  }

  .zf-home .download-section {
    padding-top: 112px;
    padding-bottom: 118px;
  }

  .zf-home .trust-section {
    padding-top: 112px;
    padding-bottom: 0;
  }

  .zf-home .download-shell {
    grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
    gap: 38px;
  }

  .zf-home .download-visual {
    min-height: 400px;
    padding: 0;
  }

  .zf-home .install-steps li {
    grid-template-columns: minmax(0, 1fr);
    padding-inline: 14px;
  }

  .zf-home .install-steps span {
    grid-column: auto;
    padding-bottom: 0;
  }

  .zf-home .closing-media {
    min-height: 520px;
    padding: 80px 24px;
  }

  .zf-home .closing-copy {
    gap: 16px;
  }

  .zf-home .closing-copy h2 {
    max-width: 720px;
    font-size: 44px;
    line-height: 1.22;
  }

  .zf-home .closing-summary {
    max-width: 520px;
  }

  .zf-home .trust-composition {
    min-height: 520px;
    grid-template-columns: minmax(0, 1fr) minmax(290px, 0.86fr);
    gap: 28px;
  }

  .zf-home .trust-decision-stage {
    height: 520px;
  }

  .zf-home .trust-decision-reply {
    top: 66px;
    left: 34px;
  }

  .zf-home .trust-decision-risk {
    top: 244px;
    right: 34px;
  }

  .zf-home .trust-decision > strong {
    font-size: 34px;
  }

  .zf-home .trust-decision-route,
  .zf-home .trust-confirmation {
    right: 34px;
    left: 34px;
  }

  .zf-home .trust-confirmation {
    bottom: 34px;
  }

  .zf-home .trust-guardrails {
    gap: 12px;
  }

  .zf-home .trust-guardrails span {
    font-size: 14px;
  }

  .zf-site-footer {
    grid-template-columns: minmax(240px, 1.3fr) repeat(3, minmax(100px, 0.7fr));
    gap: 28px;
    padding-inline: 24px;
  }

  .zf-public-main {
    padding-top: 104px;
  }

  .zf-public-page-header {
    padding-top: 58px;
  }

  .zf-public-page-header h1 {
    font-size: 42px;
  }

  body.has-public-site .auth-page {
    grid-template-columns: 1fr;
  }

  body.has-public-site .auth-value-panel {
    display: none;
  }
}

@media (max-height: 760px) {
  .floating-nav {
    top: 12px;
  }

  .zf-home .home-hero {
    min-height: 640px;
  }

  .zf-home .hero-shell {
    padding-top: 92px;
    padding-bottom: 56px;
  }

  .zf-home .hero-copy h1 {
    font-size: 64px;
  }

  .zf-home .hero-copy {
    gap: 16px;
  }

  .zf-home .hero-claim {
    font-size: 27px;
  }
}

@media (prefers-reduced-motion: reduce), (prefers-reduced-data: reduce) {
  body.has-marketing-home .zf-home *,
  body.has-marketing-home .zf-home *::before,
  body.has-marketing-home .zf-home *::after,
  body.has-public-site .zf-public *,
  body.has-public-site .zf-public *::before,
  body.has-public-site .zf-public *::after {
    scroll-behavior: auto !important;
    animation: none !important;
    transition: none !important;
  }

  .floating-nav,
  .floating-nav.is-scrolled {
    transform: translateX(-50%);
  }

  .zf-home .hero-backdrop-canvas {
    opacity: 0.9;
  }

  .zf-home .bento-grid .bento-after-dialogue {
    min-height: 390px !important;
  }

  .zf-home .bento-grid .bento-after-context {
    top: 90px !important;
  }

  .zf-home .bento-grid .bento-guide-window,
  .zf-home .bento-grid .bento-conversation-window,
  .zf-home .bento-grid .bento-guide-rules > div,
  .zf-home .bento-grid .bento-answer-state,
  .zf-home .bento-grid .bento-orbit-ring,
  .zf-home .bento-grid .bento-orbit-core,
  .zf-home .bento-grid .bento-orbit-node,
  .zf-home .bento-grid .bento-after-buyer,
  .zf-home .bento-grid .bento-after-context > div,
  .zf-home .bento-grid .bento-after-reply,
  .zf-home .bento-grid .bento-after-confirm,
  .zf-home .scene-rail .scene-slide.is-active .scene-artwork,
  .zf-home .auto-section .capability-copy,
  .zf-home .auto-section .capability-motion,
  .zf-home .trust-section .trust-copy,
  .zf-home .trust-section .trust-decision-stage,
  .zf-home .trust-section .trust-guardrails,
  .zf-home .closing-media .closing-copy {
    opacity: 1 !important;
    transform: none !important;
  }

  .zf-home .scene-transition-line > i {
    left: 100% !important;
    opacity: 1 !important;
    transform: translate3d(-50%, -50%, 0) !important;
  }

  .zf-home .bento-grid .bento-guide-window {
    transform: translate(var(--bento-guide-static-x), -49%) !important;
  }

  .zf-home .bento-grid .bento-conversation-window {
    transform: translate(var(--bento-conversation-static-x), -43%) !important;
  }

  .zf-home .bento-grid .bento-orbit-ring,
  .zf-home .bento-grid .bento-orbit-core {
    transform: translate(-50%, -50%) !important;
  }

  .zf-home .bento-grid .bento-orbit-node {
    transform: translate(-50%, -50%) translate(var(--node-x), var(--node-y)) !important;
  }

  .zf-home .bento-grid .bento-after-context > div {
    transform: translate3d(var(--after-shift, 0px), 0, 0) !important;
  }

  .zf-home .bento-grid .bento-thinking-state,
  .zf-home .bento-grid .bento-pointer-close {
    opacity: 0 !important;
  }

  .zf-home .download-visual .install-dot {
    opacity: 1 !important;
    transform: translate3d(0, 0, 0) !important;
  }

}

@media (max-width: 980px) and (prefers-reduced-motion: reduce),
  (max-width: 980px) and (prefers-reduced-data: reduce) {
  .zf-home .bento-grid .bento-after-dialogue {
    min-height: 450px !important;
  }
}

/* R28 mixed-media scenes: product surface, human context and live decision layers */

.zf-home .scene-section {
  padding: 136px 0 124px;
  background: #fbfaf8;
}

.zf-home .scene-workspace-heading {
  display: flex;
  width: min(var(--content), calc(100% - 64px));
  align-items: end;
  justify-content: space-between;
  gap: 56px;
  margin: 0 auto 52px;
}

.zf-home .scene-workspace-heading > div:first-child {
  display: grid;
  gap: 18px;
}

.zf-home .scene-workspace-heading h2 {
  max-width: 760px;
  font-size: 50px;
  font-weight: 390;
  line-height: 1.16;
}

.zf-home .scene-workspace-aside {
  width: 390px;
  flex: 0 0 390px;
}

.zf-home .scene-workspace-aside > p {
  margin: 0 0 20px;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.8;
}

.zf-home .scene-precision-media {
  width: 100%;
  height: 216px;
  overflow: hidden;
  margin: 0;
  border-radius: 6px;
  background: #ecebea;
}

.zf-home .scene-precision-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 54% 50%;
  filter: saturate(0.9) contrast(1.02);
}

.zf-home .product-workspace {
  position: relative;
  display: grid;
  width: min(var(--content), calc(100% - 64px));
  height: 570px;
  grid-template-columns: 260px minmax(0, 1fr) 300px;
  overflow: hidden;
  margin: 0 auto;
  border: 1px solid #dedbd7;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(26, 30, 35, 0.12);
}

.zf-home .product-workspace::before {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image: linear-gradient(rgba(26, 30, 35, 0.024) 1px, transparent 1px);
  background-size: 100% 32px;
  pointer-events: none;
  content: "";
}

.zf-home .product-workspace > * {
  position: relative;
  z-index: 1;
}

.zf-home .product-queue {
  padding: 22px 14px;
  border-right: 1px solid #dedbd7;
  background: #f7f7f5;
}

.zf-home .product-queue-head,
.zf-home .product-context-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 10px 18px;
  color: var(--muted);
  font-size: 14px;
}

.zf-home .product-queue-head b,
.zf-home .product-context-head b {
  color: var(--ink);
  font-size: 16px;
  font-weight: 650;
}

.zf-home .product-queue-row {
  display: grid;
  min-height: 72px;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
  padding: 10px;
  border: 1px solid transparent;
  border-radius: 7px;
}

.zf-home .product-avatar {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 50%;
  background: #eaf0ff;
  color: #3b6fea;
  font-size: 14px;
  font-weight: 700;
}

.zf-home .product-queue-row:nth-child(3) .product-avatar { background: #fff0ec; color: #be5b48; }
.zf-home .product-queue-row:nth-child(4) .product-avatar { background: #e7f8f3; color: #26866f; }

.zf-home .product-queue-row strong,
.zf-home .product-queue-row small {
  display: block;
}

.zf-home .product-queue-row strong {
  margin-bottom: 5px;
  font-size: 14px;
  font-weight: 620;
}

.zf-home .product-queue-row small {
  overflow: hidden;
  color: var(--muted);
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.zf-home .product-queue-row time {
  color: #8e979e;
  font-size: 14px;
}

.zf-home .product-conversation {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.zf-home .product-conversation-head {
  display: flex;
  height: 72px;
  align-items: center;
  justify-content: space-between;
  padding: 0 24px;
  border-bottom: 1px solid #dedbd7;
}

.zf-home .product-conversation-head b { font-size: 16px; font-weight: 650; }

.zf-home .product-conversation-head span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #2b947a;
  font-size: 14px;
}

.zf-home .product-conversation-head i,
.zf-home .product-source-state::before {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  content: "";
}

.zf-home .product-messages {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 14px;
  padding: 34px 28px 20px;
  background: #fff;
}

.zf-home .product-bubble {
  max-width: 72%;
  padding: 14px 16px;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.65;
}

.zf-home .product-bubble.is-customer { align-self: flex-start; background: #f0f2f4; }
.zf-home .product-bubble.is-agent { align-self: flex-end; border: 1px solid #f2c8bd; background: #fff0ec; }

.zf-home .product-composer {
  min-height: 94px;
  margin: 0 22px 22px;
  padding: 15px 18px;
  border: 1px solid #dedbd7;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(26, 30, 35, 0.06);
}

.zf-home .product-composer p { margin-bottom: 12px; font-size: 14px; }
.zf-home .product-composer footer { display: flex; justify-content: space-between; color: var(--muted); font-size: 14px; }
.zf-home .product-composer footer b { color: #2b947a; font-weight: 650; }

.zf-home .product-context {
  position: relative;
  overflow: hidden;
  padding: 22px;
  border-left: 1px solid #dedbd7;
  background: #fcfcfb;
}

.zf-home .product-context::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: #3b6fea;
  opacity: 0;
  transform: translateY(72px);
  content: "";
}

.zf-home .product-context-group { padding: 16px 0; border-top: 1px solid #dedbd7; }
.zf-home .product-context-group:first-of-type { border-top: 0; }
.zf-home .product-context-group small { display: block; margin-bottom: 8px; color: var(--muted); font-size: 14px; }
.zf-home .product-context-group strong { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 650; }
.zf-home .product-context-group p { margin: 0; color: #4f5960; font-size: 14px; line-height: 1.65; }

.zf-home .product-source-state {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 10px;
  color: #2b947a;
  font-size: 14px;
}

.zf-home .product-workspace.is-motion-active .product-queue-row { animation: r20-queue-focus 8.4s var(--ease-standard) infinite; }
.zf-home .product-workspace.is-motion-active .product-queue-row:nth-child(3) { animation-delay: 2.8s; }
.zf-home .product-workspace.is-motion-active .product-queue-row:nth-child(4) { animation-delay: 5.6s; }
.zf-home .product-workspace.is-motion-active .product-bubble { animation: r20-bubble-enter 8.4s var(--ease-standard) infinite; }
.zf-home .product-workspace.is-motion-active .product-bubble.is-agent { animation-delay: 700ms; }
.zf-home .product-workspace.is-motion-active .product-bubble.is-follow { animation-delay: 2.8s; }
.zf-home .product-workspace.is-motion-active .product-context::after { animation: r20-context-scan 4.2s var(--ease-standard) infinite; }

.zf-home .auto-section {
  position: relative;
  min-height: 820px;
  overflow: hidden;
  padding: 0;
  background: #f2efeb;
  color: var(--ink);
}

.zf-home .capability-depth-copy {
  position: absolute;
  z-index: 5;
  top: 110px;
  right: max(32px, calc((100% - var(--content)) / 2));
  left: auto;
  width: 390px;
}

.zf-home .capability-depth-copy h2 {
  margin: 22px 0;
  font-size: 44px;
  font-weight: 390;
  line-height: 1.18;
}

.zf-home .capability-depth-copy > p:last-child {
  color: var(--muted);
  font-size: 17px;
  line-height: 1.78;
}

.zf-home .capability-depth-field {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: #eeeae5;
}

.zf-home .capability-depth-field::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(90deg, rgba(248, 246, 243, 0.02) 30%, rgba(248, 246, 243, 0.58) 60%, rgba(248, 246, 243, 0.96) 100%);
  pointer-events: none;
  content: "";
}

.zf-home .capability-human-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 50%;
  filter: saturate(0.86) contrast(1.01);
  transform: scale(1.01);
}

.zf-home .capability-live-window {
  position: absolute;
  z-index: 3;
  width: min(360px, calc(100% - 48px));
  height: 240px;
  overflow: hidden;
  border: 1px solid rgba(26, 30, 35, 0.13);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 22px 60px rgba(26, 30, 35, 0.12);
  opacity: 0.9;
}

.zf-home .capability-live-window.window-a { top: 368px; right: 25%; left: auto; }
.zf-home .capability-live-window.window-b { top: 474px; right: 5%; left: auto; }
.zf-home .capability-live-window.window-c { top: 570px; right: 16%; left: auto; }

.zf-home .capability-live-window header {
  display: flex;
  height: 48px;
  align-items: center;
  justify-content: space-between;
  padding: 0 17px;
  border-bottom: 1px solid #dedbd7;
  font-size: 14px;
}

.zf-home .capability-live-window header b { font-weight: 650; }
.zf-home .capability-live-window header i { width: 7px; height: 7px; border-radius: 50%; background: #2b947a; }

.zf-home .capability-live-body { display: grid; height: calc(100% - 48px); grid-template-columns: 78px minmax(0, 1fr); }
.zf-home .capability-live-list { padding: 12px; border-right: 1px solid #dedbd7; background: #f4f5f5; }
.zf-home .capability-live-list span { display: block; height: 28px; margin-bottom: 8px; border-radius: 5px; background: #e0e4e6; }
.zf-home .capability-live-list span:first-child { background: #ffd5cb; }
.zf-home .capability-live-chat { padding: 15px; }
.zf-home .capability-live-chat p { width: 76%; margin-bottom: 12px; padding: 10px 12px; border-radius: 7px; background: #eef1f3; font-size: 14px; line-height: 1.55; }
.zf-home .capability-live-chat p:nth-child(2) { margin-left: auto; background: #fff0ec; }
.zf-home .capability-live-chat small { color: #2b947a; font-size: 14px; }

.zf-home .capability-depth-status {
  position: absolute;
  z-index: 4;
  right: 38px;
  bottom: 38px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--muted);
  font-size: 14px;
}

.zf-home .capability-depth-status i { width: 9px; height: 9px; border-radius: 50%; background: #3b6fea; box-shadow: 0 0 0 7px rgba(59, 111, 234, 0.1); }
.zf-home .auto-section.is-motion-active .capability-human-media { animation: r20-photo-breathe 14s var(--ease-standard) infinite alternate; }
.zf-home .auto-section.is-motion-active .capability-live-window { animation: r20-window-drift 10.5s var(--ease-standard) infinite; }
.zf-home .auto-section.is-motion-active .capability-live-window.window-b { animation-delay: -3.5s; }
.zf-home .auto-section.is-motion-active .capability-live-window.window-c { animation-delay: -7s; }

.zf-home .trust-section {
  padding: 132px 0 0;
  background: #fff;
  color: var(--ink);
}

.zf-home .trust-composition {
  display: block;
  min-height: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.zf-home .trust-copy {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
  grid-template-rows: auto auto;
  align-items: end;
  column-gap: 72px;
  row-gap: 18px;
  margin-bottom: 50px;
  padding: 0;
  border: 0;
}

.zf-home .trust-copy .pill-label { grid-column: 1; grid-row: 1; justify-self: start; }
.zf-home .trust-copy h2 { grid-column: 1; grid-row: 2; max-width: 680px; font-size: 50px; font-weight: 390; line-height: 1.16; }
.zf-home .trust-copy > p:not(.pill-label) { grid-column: 2; grid-row: 2; max-width: 390px; margin: 0 0 8px; color: var(--muted); font-size: 17px; line-height: 1.78; }

.zf-home .trust-human-media {
  position: relative;
  min-width: 0;
  min-height: 0;
  height: 700px;
  overflow: hidden;
  border: 1px solid rgba(26, 30, 35, 0.12);
  border-radius: 8px;
  background: #f2f0ee;
  box-shadow: 0 26px 68px rgba(26, 30, 35, 0.1);
}

.zf-home .trust-human-media > img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 50%;
  filter: saturate(0.92) contrast(1.02);
  transform: scale(1.015);
}

.zf-home .trust-human-media::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 52%, rgba(26, 30, 35, 0.16) 100%), linear-gradient(90deg, rgba(255, 255, 255, 0.1), transparent 30%);
  pointer-events: none;
  content: "";
}

.zf-home .trust-action-sheet {
  position: absolute;
  z-index: 4;
  right: auto;
  bottom: 40px;
  left: 40px;
  display: grid;
  width: 520px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 22px;
  padding: 18px 20px;
  border: 1px solid rgba(255, 255, 255, 0.76);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 24px 60px rgba(26, 30, 35, 0.16), inset 0 0 0 1px rgba(26, 30, 35, 0.05);
  backdrop-filter: blur(22px) saturate(1.1);
}

.zf-home .trust-action-sheet header { display: flex; grid-column: 1 / -1; justify-content: space-between; margin-bottom: 4px; }
.zf-home .trust-action-sheet header b { font-size: 16px; font-weight: 650; }
.zf-home .trust-action-sheet header span { color: var(--muted); font-size: 14px; }

.zf-home .trust-action-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  padding: 16px 0 4px;
  border-top: 1px solid #dedbd7;
}

.zf-home .trust-action-row.is-risk {
  padding-left: 22px;
  border-left: 1px solid #dedbd7;
}

.zf-home .trust-action-row strong,
.zf-home .trust-action-row small { display: block; }
.zf-home .trust-action-row strong { margin-bottom: 6px; font-size: 14px; font-weight: 650; }
.zf-home .trust-action-row small { color: var(--muted); font-size: 14px; }
.zf-home .trust-action-row em { align-self: center; color: #2b947a; font-size: 14px; font-style: normal; }
.zf-home .trust-action-row.is-risk em { color: #b65a48; }

.zf-home .trust-decision-dot {
  position: absolute;
  top: 50%;
  right: 88px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ff9780;
  box-shadow: 0 0 0 7px rgba(255, 151, 128, 0.18);
}

.zf-home .trust-section.is-motion-active .trust-human-media > img { animation: r20-photo-breathe 12s var(--ease-standard) infinite alternate; }
.zf-home .trust-section.is-motion-active .trust-decision-dot { animation: r20-decision-travel 5.6s var(--ease-standard) infinite; }

.zf-home.has-motion-reveal [data-motion-zone="capabilities"] .capability-depth-copy,
.zf-home.has-motion-reveal [data-motion-zone="capabilities"] .capability-depth-field,
.zf-home.has-motion-reveal [data-motion-zone="trust"] .trust-copy,
.zf-home.has-motion-reveal [data-motion-zone="trust"] .trust-human-media {
  animation: none;
  opacity: 0;
  transform: translate3d(0, 20px, 0);
  transition: opacity 440ms var(--ease-standard), transform 440ms var(--ease-standard);
}

.zf-home [data-motion-zone="capabilities"].is-revealed .capability-depth-copy,
.zf-home [data-motion-zone="capabilities"].is-revealed .capability-depth-field,
.zf-home [data-motion-zone="trust"].is-revealed .trust-copy,
.zf-home [data-motion-zone="trust"].is-revealed .trust-human-media {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

@keyframes r20-queue-focus {
  0%, 24%, 100% { border-color: transparent; background: transparent; transform: translateX(0); }
  8%, 17% { border-color: #e1b3a8; background: #fff; transform: translateX(5px); }
}

@keyframes r20-bubble-enter {
  0%, 6% { opacity: 0.28; transform: translateY(8px); }
  14%, 78% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0.56; transform: translateY(0); }
}

@keyframes r20-context-scan {
  0% { opacity: 0; transform: translateY(72px); }
  12%, 72% { opacity: 0.65; }
  90%, 100% { opacity: 0; transform: translateY(500px); }
}

@keyframes r20-window-drift {
  0%, 100% { opacity: 0.66; transform: translate3d(0, 16px, 0) scale(0.96); }
  32%, 62% { opacity: 1; transform: translate3d(-18px, 0, 0) scale(1); }
  78% { opacity: 0.82; transform: translate3d(8px, -10px, 0) scale(0.98); }
}

@keyframes r20-photo-breathe {
  from { transform: scale(1.015); }
  to { transform: scale(1.045); }
}

@keyframes r20-decision-travel {
  0%, 18% { opacity: 0; transform: translateX(-88px); }
  32%, 66% { opacity: 1; transform: translateX(0); }
  78%, 100% { opacity: 0; transform: translateX(28px); }
}

@media (max-width: 1599px) {
  .zf-home .trust-human-media { height: 580px; }
  .zf-home .trust-action-sheet { right: auto; bottom: 96px; left: 112px; }
}

@media (max-width: 1399px) {
  .zf-home .scene-workspace-heading,
  .zf-home .product-workspace { width: min(1120px, calc(100% - 64px)); }
  .zf-home .product-workspace { height: 550px; grid-template-columns: 240px minmax(0, 1fr) 280px; }
  .zf-home .scene-workspace-heading h2 { font-size: 46px; }
  .zf-home .scene-workspace-aside { width: 350px; flex-basis: 350px; }
  .zf-home .scene-precision-media { height: 194px; }
  .zf-home .trust-composition { min-height: 0; }
  .zf-home .trust-copy h2 { font-size: 46px; }
  .zf-home .trust-human-media { min-height: 0; height: 560px; }
  .zf-home .trust-action-sheet { bottom: 180px; }
}

@media (max-width: 1199px) {
  .zf-home .scene-workspace-heading,
  .zf-home .product-workspace { width: calc(100% - 56px); }
  .zf-home .product-workspace { height: 540px; grid-template-columns: 210px minmax(0, 1fr) 240px; }
  .zf-home .scene-workspace-heading h2 { font-size: 42px; }
  .zf-home .scene-workspace-heading > p { width: 330px; }
  .zf-home .product-queue { padding-inline: 10px; }
  .zf-home .product-context { padding-inline: 16px; }
  .zf-home .capability-depth-copy { width: 350px; }
  .zf-home .capability-live-window { width: 340px; }
  .zf-home .trust-copy { grid-template-columns: minmax(0, 1fr) 330px; column-gap: 48px; }
  .zf-home .trust-action-sheet { width: 500px; }
}

@media (max-width: 980px) {
  .zf-home .scene-section { padding-top: 112px; }
  .zf-home .scene-workspace-heading,
  .zf-home .product-workspace { width: calc(100% - 48px); }
  .zf-home .scene-workspace-heading { gap: 30px; margin-bottom: 40px; }
  .zf-home .scene-workspace-heading h2 { font-size: 38px; }
  .zf-home .scene-workspace-aside { width: 280px; flex-basis: 280px; }
  .zf-home .scene-workspace-aside > p { font-size: 16px; }
  .zf-home .scene-precision-media { height: 158px; }
  .zf-home .product-workspace { height: 520px; grid-template-columns: 190px minmax(0, 1fr) 210px; }
  .zf-home .product-queue-row { grid-template-columns: 34px minmax(0, 1fr); }
  .zf-home .product-avatar { width: 34px; height: 34px; }
  .zf-home .product-queue-row time { display: none; }
  .zf-home .product-messages { padding-inline: 20px; }
  .zf-home .product-composer { margin-inline: 16px; }
  .zf-home .product-context { padding: 18px 14px; }
  .zf-home .product-context-group p { font-size: 14px; }
  .zf-home .auto-section { min-height: 820px; }
  .zf-home .capability-depth-copy { top: 72px; right: 24px; left: auto; width: 300px; }
  .zf-home .capability-depth-copy h2 { font-size: 36px; }
  .zf-home .capability-live-window { width: 300px; height: 260px; }
  .zf-home .capability-live-window.window-a { top: 338px; right: 25%; left: auto; }
  .zf-home .capability-live-window.window-b { top: 438px; right: 4%; left: auto; }
  .zf-home .capability-live-window.window-c { top: 538px; right: 14%; left: auto; }
  .zf-home .capability-live-body { grid-template-columns: 68px minmax(0, 1fr); }
  .zf-home .capability-live-chat { padding: 13px; }
  .zf-home .capability-depth-status { right: 24px; bottom: 24px; }
  .zf-home .trust-section { padding-top: 104px; }
  .zf-home .trust-shell { width: calc(100% - 48px); }
  .zf-home .trust-composition { min-height: 0; }
  .zf-home .trust-copy { grid-template-columns: minmax(0, 1fr) 300px; column-gap: 32px; margin-bottom: 40px; padding: 0; }
  .zf-home .trust-copy h2 { font-size: 38px; }
  .zf-home .trust-human-media { min-height: 0; height: 500px; }
  .zf-home .trust-action-sheet { right: auto; bottom: 72px; left: 48px; width: 480px; padding: 16px 18px; }
  .zf-home .trust-decision-dot { right: 76px; }
}