:root {
  --ink: #0f172a;
  --ink-soft: #475569;
  --ink-muted: #64748b;
  --navy: #07111f;
  --navy-2: #0b192a;
  --navy-3: #10243a;
  --line: #e2e8f0;
  --line-dark: rgba(203, 213, 225, .16);
  --surface: #ffffff;
  --surface-soft: #f7fafc;
  --mint: #71e3b6;
  --mint-strong: #19b47b;
  --blue: #4b7eff;
  --violet: #8b78e6;
  --container: 1260px;
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 30px;
  --shadow: 0 24px 60px -38px rgba(15, 23, 42, .34);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--surface); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 16px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
img { max-width: 100%; }
.container { width: min(var(--container), calc(100% - 64px)); margin-inline: auto; }
.skip-link { position: fixed; top: 10px; left: 10px; z-index: 100; padding: 9px 13px; border-radius: 8px; color: var(--ink); background: var(--mint); transform: translateY(-150%); transition: transform .2s; }
.skip-link:focus { transform: translateY(0); }

/* Type and shared elements */
.eyebrow { display: inline-flex; align-items: center; gap: 9px; margin: 0 0 18px; color: var(--mint-strong); font-size: 11px; font-weight: 800; letter-spacing: .13em; line-height: 1.2; text-transform: uppercase; }
.eyebrow--mint { color: var(--mint); }
.eyebrow-mark { color: var(--mint); font-size: 14px; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { letter-spacing: -.055em; }
h1 { margin-bottom: 24px; font-size: clamp(48px, 6.4vw, 78px); line-height: .99; }
h2 { margin-bottom: 22px; font-size: clamp(36px, 4vw, 58px); line-height: 1.05; }
h3 { margin-bottom: 10px; font-size: 22px; line-height: 1.18; }
.section-light { background: var(--surface); }
.section-dark { color: #f8fafc; background: var(--navy); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 11px; min-height: 46px; padding: 12px 18px; border: 1px solid transparent; border-radius: 999px; cursor: pointer; font-size: 13px; font-weight: 750; letter-spacing: -.01em; transition: transform .2s, background .2s, border-color .2s, box-shadow .2s; }
.button:hover { transform: translateY(-2px); }
.button span { font-size: 18px; line-height: 1; }
.button--mint { color: #062015; background: var(--mint); box-shadow: 0 14px 30px -18px rgba(113, 227, 182, .9); }
.button--mint:hover { background: #8af0c7; box-shadow: 0 16px 36px -18px rgba(113, 227, 182, 1); }
.button--outline { border-color: var(--line); color: var(--ink); background: transparent; }
.button--outline-light { border-color: var(--line-dark); color: #f8fafc; background: transparent; }
.button--outline-light:hover { border-color: rgba(113, 227, 182, .55); background: rgba(113, 227, 182, .08); }
.button--text-light { padding-inline: 4px; color: #c5d1df; background: transparent; }
.button--text-light:hover { color: #fff; }
.button--large { min-height: 54px; padding: 15px 22px; font-size: 14px; }
.button--small { min-height: 38px; padding: 9px 15px; font-size: 12px; }
.inline-link { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); font-size: 14px; font-weight: 800; border-bottom: 1px solid var(--ink); }
.inline-link span { font-size: 18px; transition: transform .2s; }
.inline-link:hover span { transform: translate(3px, -3px); }
.section-copy > p:not(.eyebrow), .section-intro > p:not(.eyebrow) { color: var(--ink-soft); font-size: 17px; line-height: 1.7; }
.section-copy h2 span, .section-intro h2 span { color: var(--mint-strong); }
.split-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: center; gap: clamp(50px, 8vw, 130px); }
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.reveal--delay { transition-delay: .12s; }

/* Header */
.site-header { position: fixed; inset: 0 0 auto; z-index: 50; border-bottom: 1px solid transparent; color: rgba(248, 250, 252, .84); transition: background .25s, border-color .25s, color .25s, box-shadow .25s; }
.site-header.is-scrolled { background: rgba(7, 17, 31, .88); border-bottom-color: rgba(203, 213, 225, .12); box-shadow: 0 10px 35px -30px #000; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.site-header.is-light { color: var(--ink); }
.site-header.is-light.is-scrolled { background: rgba(255, 255, 255, .92); border-bottom-color: var(--line); }
.header-inner { display: flex; align-items: center; justify-content: space-between; min-height: 72px; gap: 25px; }
.brand { display: inline-flex; align-items: center; flex: none; }
.brand-logo { display: block; width: 130px; height: auto; }
.brand-logo--dark { display: none; }
.site-header.is-light .brand-logo--light { display: none; }
.site-header.is-light .brand-logo--dark { display: block; }
.desktop-nav { display: flex; align-items: center; gap: clamp(19px, 2.5vw, 36px); margin-left: auto; margin-right: clamp(8px, 2vw, 26px); }
.desktop-nav a, .header-login { position: relative; color: inherit; font-size: 12px; font-weight: 650; white-space: nowrap; }
.desktop-nav a::after { position: absolute; right: 0; bottom: -8px; left: 0; height: 1px; background: currentColor; content: ""; opacity: 0; transform: scaleX(.4); transition: opacity .2s, transform .2s; }
.desktop-nav a:hover::after { opacity: .8; transform: scaleX(1); }
.header-actions { display: flex; align-items: center; gap: 20px; }
.header-login:hover { color: var(--mint-strong); }
.menu-toggle { display: none; width: 40px; height: 40px; padding: 9px; border: 1px solid currentColor; border-radius: 10px; color: inherit; background: transparent; cursor: pointer; }
.menu-toggle span { display: block; height: 1.5px; margin: 4px 0; background: currentColor; transition: transform .2s, opacity .2s; }
.menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
.mobile-navigation { display: none; }

/* Hero */
.hero-section { position: relative; min-height: 790px; overflow: hidden; color: #f8fafc; background: var(--navy); isolation: isolate; }
.hero-section::after { position: absolute; right: 0; bottom: 0; left: 0; height: 130px; background: linear-gradient(180deg, transparent, rgba(7, 17, 31, .8)); content: ""; pointer-events: none; }
.hero-grid-pattern { position: absolute; inset: 0; z-index: -2; opacity: .3; background-image: linear-gradient(rgba(148, 163, 184, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(148, 163, 184, .07) 1px, transparent 1px); background-size: 68px 68px; mask-image: linear-gradient(to bottom, #000, transparent 90%); }
.hero-particles { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; opacity: .72; pointer-events: none; }
.hero-orb { position: absolute; z-index: -1; border-radius: 50%; pointer-events: none; filter: blur(1px); }
.hero-orb--one { top: -180px; right: 8%; width: 530px; height: 530px; background: radial-gradient(circle, rgba(38, 148, 125, .2), transparent 68%); }
.hero-orb--two { bottom: -230px; left: 27%; width: 470px; height: 470px; background: radial-gradient(circle, rgba(75, 126, 255, .13), transparent 68%); }
.hero-layout { display: grid; grid-template-columns: minmax(0, .92fr) minmax(580px, 1.08fr); align-items: center; gap: clamp(32px, 4vw, 82px); min-height: 790px; padding-top: 72px; }
.hero-copy { position: relative; z-index: 3; max-width: 620px; }
.hero-copy h1 span { color: var(--mint); }
.hero-lead { max-width: 520px; margin-bottom: 30px; color: #afbed0; font-size: 18px; line-height: 1.6; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; }
.hero-note { display: flex; align-items: center; gap: 11px; margin-top: 22px; color: #8293a8; font-size: 11px; }
.hero-note span { color: var(--mint); font-size: 14px; font-weight: 800; }
.hero-note i { width: 3px; height: 3px; border-radius: 50%; background: #61748a; }

/* Hero product composition */
.product-stage { position: relative; width: 100%; height: 600px; perspective: 1500px; }
.stage-label { position: absolute; z-index: 5; display: inline-flex; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid rgba(203, 213, 225, .16); border-radius: 9px; color: #cfdae6; background: rgba(8, 22, 37, .82); font-size: 10px; font-weight: 700; letter-spacing: .03em; box-shadow: 0 14px 32px -22px #000; }
.stage-label--top { top: 28px; left: 8%; }
.live-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 0 4px rgba(113, 227, 182, .12); }
.stage-dashboard { position: absolute; top: 88px; left: 2%; width: 78%; overflow: hidden; border: 1px solid rgba(216, 235, 239, .25); border-radius: 12px; background: #f7f9fb; box-shadow: 0 38px 70px -34px rgba(0, 0, 0, .8); transform: rotate(-4deg) rotateY(8deg); transform-origin: 70% 70%; }
.stage-dashboard__bar { display: flex; align-items: center; justify-content: space-between; height: 25px; padding: 0 10px; color: #8fa0af; background: #eef2f5; font-size: 8px; }
.window-dots { display: inline-flex; align-items: center; gap: 4px; }
.window-dots i { display: block; width: 5px; height: 5px; border-radius: 50%; background: #bbc7d0; }
.window-dots i:first-child { background: #f39b8d; }.window-dots i:nth-child(2) { background: #f2c36d; }.window-dots i:last-child { background: #6fc69b; }
.stage-lock { color: #6c8a88; font-size: 11px; }
.stage-dashboard__content { display: grid; grid-template-columns: 42px 1fr; min-height: 306px; }
.stage-sidebar { display: flex; flex-direction: column; align-items: center; gap: 18px; padding-top: 16px; color: #a4b1bc; background: #fff; font-size: 12px; }
.stage-sidebar b { color: #102438; font-size: 18px; }.stage-sidebar__active { color: #16a475; }
.stage-main { padding: 24px 24px 16px; color: #152338; background: #f8fafc; }
.stage-main__head { display: flex; align-items: center; justify-content: space-between; color: #38495b; font-size: 11px; font-weight: 700; }.stage-main__head small { color: #94a3b8; font-size: 8px; font-weight: 500; }
.stage-balance { display: block; margin-top: 18px; font-size: 28px; letter-spacing: -.06em; }.stage-positive { color: #16a475; font-size: 8px; font-weight: 700; }
.stage-chart { display: flex; align-items: flex-end; gap: 7px; height: 105px; margin-top: 27px; padding: 0 2px; border-bottom: 1px solid #e3e9ed; }.stage-chart span { flex: 1; min-width: 5px; border-radius: 3px 3px 0 0; background: #b8e9d4; }.stage-chart span:nth-child(2n) { background: #bbcaf8; }.stage-chart span:last-child { background: #20b781; }
.stage-metrics { display: flex; gap: 20px; margin-top: 15px; color: #8190a0; font-size: 8px; }.stage-metrics span { display: grid; grid-template-columns: auto 1fr; column-gap: 5px; align-items: center; }.stage-metrics b { grid-column: 2; color: #34465a; font-size: 10px; }.metric-dot { width: 6px; height: 6px; border-radius: 2px; grid-row: span 2; }.metric-dot--mint { background: #2ab784; }.metric-dot--violet { background: #8879e2; }
.stage-phone { position: absolute; z-index: 4; top: 104px; right: 3%; width: 32%; max-width: 196px; padding: 7px; border: 2px solid #3d5366; border-radius: 31px; background: #081521; box-shadow: 18px 40px 55px -28px rgba(0, 0, 0, .95), inset 0 0 0 1px rgba(255,255,255,.1); transform: rotate(5deg); }
.stage-phone::before { position: absolute; top: 7px; left: 50%; z-index: 3; width: 45%; height: 14px; border-radius: 0 0 10px 10px; background: #07111f; content: ""; transform: translateX(-50%); }.stage-phone__screen { overflow: hidden; border-radius: 23px; background: #eaf5ef; }
.phone-status { display: flex; justify-content: space-between; padding: 9px 11px 3px; color: #365344; font-size: 7px; font-weight: 800; }.phone-chat-head { display: flex; align-items: center; gap: 7px; padding: 13px 10px 10px; border-bottom: 1px solid rgba(76, 135, 103, .13); color: #21382c; background: #eaf5ef; font-size: 8px; }.phone-avatar { display: grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; color: #fff; background: #19a870; font-size: 13px; font-weight: 800; }.phone-chat-head b { display: block; }.phone-chat-head small { display: block; margin-top: 1px; color: #4b9471; font-size: 6px; font-weight: 600; }.phone-menu { margin-left: auto; color: #779686; letter-spacing: 1px; }
.phone-chat { display: flex; flex-direction: column; gap: 7px; min-height: 270px; padding: 14px 9px 10px; background: #e5f3ea; background-image: radial-gradient(rgba(74, 145, 99, .08) 1px, transparent 1px); background-size: 12px 12px; }.chat-date { align-self: center; padding: 3px 6px; border-radius: 6px; color: #5a806b; background: rgba(255,255,255,.68); font-size: 6px; }.chat-bubble { max-width: 82%; padding: 8px 9px; border-radius: 8px; color: #24362d; font-size: 8px; line-height: 1.4; box-shadow: 0 4px 8px rgba(30, 74, 48, .05); }.chat-bubble--user { align-self: flex-end; border-top-right-radius: 2px; background: #d0f5d7; }.chat-bubble--agent { align-self: flex-start; border-top-left-radius: 2px; background: #fff; }.chat-bubble--agent b { color: #109664; font-size: 7px; }.chat-bubble small { display: block; margin-top: 4px; color: #7da28c; font-size: 6px; text-align: right; }.phone-input { display: flex; align-items: center; gap: 7px; padding: 8px; color: #8a9e93; background: #f5fbf6; font-size: 7px; }.phone-input span:nth-child(2) { flex: 1; padding: 5px 8px; border-radius: 10px; background: #fff; }.phone-input b { color: #19a870; }
.stage-event { position: absolute; z-index: 5; display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid rgba(203, 213, 225, .16); border-radius: 8px; color: #e5f6ee; background: rgba(8, 23, 36, .88); box-shadow: 0 15px 28px -20px #000; font-size: 8px; }.stage-event b { color: #fff; font-size: 10px; }.stage-event span { color: #90a3b8; }.stage-event i { display: grid; width: 16px; height: 16px; place-items: center; border-radius: 50%; color: #082016; background: var(--mint); font-size: 10px; font-style: normal; font-weight: 800; }.stage-event--expense { right: 0; bottom: 96px; }.stage-event--goal { bottom: 35px; left: 8%; }.stage-event--goal i { color: #fff; background: #7365ce; }

/* Trust and problem */
.trust-strip { border-bottom: 1px solid var(--line); background: #fff; }.trust-strip__inner { display: grid; grid-template-columns: repeat(4, 1fr); padding: 26px 0; }.trust-strip__inner span { display: inline-flex; align-items: center; justify-content: center; gap: 10px; color: var(--ink-soft); font-size: 11px; font-weight: 650; }.trust-strip__inner span + span { border-left: 1px solid var(--line); }.trust-strip b { color: #a1adba; font-size: 10px; font-weight: 750; }
.problem-section { padding: 142px 0 130px; }.split-layout--problem { align-items: start; }.section-copy { max-width: 570px; }.section-copy h2 { max-width: 560px; }.section-copy > p:not(.eyebrow) { max-width: 510px; margin-bottom: 27px; }.problem-list { border-top: 1px solid var(--line); }.problem-item { display: grid; grid-template-columns: 44px 1fr; gap: 17px; padding: 24px 0; border-bottom: 1px solid var(--line); }.problem-item > span { color: #aab6c3; font-size: 11px; font-weight: 800; letter-spacing: .08em; }.problem-item strong { display: block; margin-bottom: 7px; font-size: 17px; letter-spacing: -.03em; }.problem-item p { max-width: 420px; margin: 0; color: var(--ink-muted); font-size: 13px; line-height: 1.6; }
.before-after-wrap { margin-top: 90px; }.before-after-card { display: grid; grid-template-columns: 1fr 1fr; min-height: 310px; overflow: hidden; border: 1px solid #dbe5e5; border-radius: var(--radius-lg); background: #eef7f3; box-shadow: var(--shadow); }.before-after-card__image { position: relative; overflow: hidden; min-height: 300px; background: #c6d1d6; }.before-after-card__image::after { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7, 17, 31, .05), rgba(7, 17, 31, .42)); content: ""; }.before-after-card__image img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 44%; filter: saturate(.7); }.before-after-card__image span { position: absolute; z-index: 1; top: 20px; left: 22px; padding: 5px 9px; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; color: #fff; background: rgba(7,17,31,.35); font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }.before-after-card__copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(28px, 6vw, 72px); }.before-after-kicker { margin-bottom: 26px; color: var(--ink-muted); font-size: 12px; font-weight: 650; }.before-after-kicker strong { color: var(--ink); }.before-after-card__copy .eyebrow { margin-bottom: 12px; }.before-after-card__copy h3 { max-width: 280px; margin-bottom: 12px; font-size: clamp(29px, 3vw, 40px); }.before-after-card__copy p { max-width: 300px; margin-bottom: 22px; color: var(--ink-soft); }.before-after-check { color: var(--mint-strong); font-size: 12px; font-weight: 800; }

/* Flow */
.flow-section { padding: 142px 0 150px; background: var(--surface-soft); }.section-intro { max-width: 660px; }.section-intro--center { margin: 0 auto 54px; text-align: center; }.section-intro--center > p:not(.eyebrow) { max-width: 570px; margin-right: auto; margin-left: auto; }.flow-demo { padding: 10px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow); }.flow-tabs { display: flex; gap: 4px; width: fit-content; padding: 4px; border-radius: 999px; background: #f1f5f9; }.flow-tab { padding: 9px 18px; border: 0; border-radius: 999px; color: var(--ink-muted); background: transparent; cursor: pointer; font-size: 12px; font-weight: 750; }.flow-tab.is-active { color: var(--ink); background: #fff; box-shadow: 0 5px 12px -9px #0f172a; }.flow-steps { display: grid; grid-template-columns: 1fr 54px 1fr 54px 1fr; align-items: center; gap: 14px; padding: 50px 34px 39px; }.flow-step { position: relative; min-height: 165px; padding: 26px 22px 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface-soft); }.flow-step__label { position: absolute; top: -10px; left: 16px; padding: 2px 8px; color: var(--ink-muted); background: var(--surface-soft); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.flow-step--input { background: #f1faf5; border-color: #caeadb; }.flow-message { max-width: 200px; padding: 12px 14px; border-radius: 11px 11px 2px 11px; color: #214b37; background: #d6f5df; font-size: 13px; line-height: 1.4; }.flow-step > small { display: block; margin-top: 9px; color: #92a49b; font-size: 10px; }.flow-step--ai { background: #f7f6ff; border-color: #e2ddff; }.ai-processing { display: flex; flex-direction: column; gap: 5px; padding-top: 15px; }.ai-mark { display: grid; width: 32px; height: 32px; place-items: center; margin-bottom: 7px; border-radius: 9px; color: #fff; background: var(--violet); font-size: 16px; }.ai-processing strong { font-size: 14px; }.ai-processing small { color: #8b86b5; font-size: 10px; }.flow-step--result { background: #f7fafc; }.mini-result { position: relative; display: flex; flex-direction: column; gap: 4px; padding-top: 12px; }.mini-result strong { font-size: 27px; letter-spacing: -.06em; }.mini-result span { color: var(--ink-muted); font-size: 10px; }.mini-result i { position: absolute; top: 10px; right: 0; display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; color: #fff; background: var(--mint-strong); font-size: 13px; font-style: normal; }.flow-connector { display: flex; flex-direction: column; align-items: center; gap: 4px; color: #a1afba; }.flow-connector span { font-size: 25px; }.flow-connector small { font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }

/* Dashboard */
.dashboard-section { position: relative; overflow: hidden; padding: 142px 0 128px; background: #07111f; }.dashboard-section::before { position: absolute; top: -240px; right: 14%; width: 700px; height: 500px; border-radius: 50%; background: radial-gradient(circle, rgba(26, 146, 112, .12), transparent 70%); content: ""; pointer-events: none; }.split-heading { display: grid; grid-template-columns: 1.1fr .9fr; align-items: end; gap: 70px; }.split-heading h2 { max-width: 620px; }.split-heading h2 span { color: var(--mint); }.split-heading > p { max-width: 420px; margin: 0 0 8px; color: #9aaabd; font-size: 16px; line-height: 1.7; }.dashboard-visual { position: relative; margin-top: 66px; padding: 0 7% 56px; }.browser-frame { overflow: hidden; border: 1px solid rgba(203, 213, 225, .18); border-radius: 14px; background: #dce8e9; box-shadow: 0 40px 85px -42px #000; transform: perspective(1300px) rotateX(2deg); }.browser-bar { display: flex; align-items: center; justify-content: space-between; height: 37px; padding: 0 14px; color: #8ca0ad; background: #f1f5f6; font-size: 10px; }.browser-url { width: 46%; padding: 6px 12px; border-radius: 5px; background: #e5ecee; text-align: center; }.browser-frame img { display: block; width: 100%; height: auto; }.dashboard-callout { position: absolute; display: flex; flex-direction: column; gap: 4px; min-width: 162px; padding: 12px 14px; border: 1px solid rgba(113, 227, 182, .3); border-radius: 10px; color: #eaf8f1; background: rgba(9, 28, 43, .94); box-shadow: 0 18px 40px -26px #000; }.dashboard-callout::after { position: absolute; width: 35px; height: 1px; background: rgba(113, 227, 182, .5); content: ""; }.dashboard-callout span { color: var(--mint); font-size: 10px; font-weight: 800; }.dashboard-callout b { font-size: 12px; }.dashboard-callout small { color: #91a6b7; font-size: 10px; }.dashboard-callout--balance { top: 18%; left: 0; }.dashboard-callout--balance::after { top: 50%; right: -36px; }.dashboard-callout--health { top: 32%; right: 0; }.dashboard-callout--health::after { top: 50%; left: -36px; }.dashboard-callout--reports { right: 2%; bottom: 1%; }.dashboard-callout--reports::after { top: -18px; left: 50%; width: 1px; height: 18px; }.dashboard-meta { display: flex; justify-content: center; gap: clamp(24px, 5vw, 75px); padding-top: 4px; color: #9aabba; font-size: 11px; }.dashboard-meta span { display: inline-flex; align-items: center; gap: 8px; }.dashboard-meta i { color: var(--mint); font-style: normal; }

/* Resources and integrations */
.resources-section { padding: 144px 0 150px; }.resources-section .section-intro { margin-bottom: 58px; }.resource-rows { border-top: 1px solid var(--line); }.resource-row { display: grid; grid-template-columns: 54px 54px minmax(0, 1fr) auto; align-items: center; gap: 23px; padding: 29px 0; border-bottom: 1px solid var(--line); transition: padding .2s; }.resource-row:hover { padding-right: 10px; padding-left: 10px; background: #fbfdfd; }.resource-index { align-self: start; padding-top: 11px; color: #aab6c2; font-size: 11px; font-weight: 800; }.resource-icon { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 13px; font-size: 19px; font-weight: 800; }.resource-icon--mint { color: #138761; background: #dff7eb; }.resource-icon--blue { color: #4168d4; background: #e8edff; }.resource-icon--violet { color: #7464c7; background: #efecff; }.resource-copy h3 { margin-bottom: 5px; font-size: 20px; }.resource-copy p { max-width: 610px; margin: 0; color: var(--ink-muted); font-size: 14px; }.resource-arrow { color: #9babb9; font-size: 24px; transition: color .2s, transform .2s; }.resource-row:hover .resource-arrow { color: var(--mint-strong); transform: translate(3px, -3px); }
.integrations-section { position: relative; overflow: hidden; padding: 140px 0; }.integrations-section::after { position: absolute; right: -200px; bottom: -320px; width: 600px; height: 600px; border: 1px solid rgba(113,227,182,.12); border-radius: 50%; box-shadow: 0 0 0 52px rgba(113,227,182,.025), 0 0 0 104px rgba(113,227,182,.018); content: ""; }.split-layout--integration { grid-template-columns: minmax(0, .85fr) minmax(420px, 1.15fr); }.integrations-section .section-copy { position: relative; z-index: 1; }.integrations-section .section-copy h2 { max-width: 540px; }.integrations-section .section-copy > p:not(.eyebrow) { color: #9fafc0; }.integration-stack { position: relative; z-index: 1; border-top: 1px solid var(--line-dark); }.integration-line { display: grid; grid-template-columns: 48px 1fr auto 145px; align-items: center; gap: 16px; padding: 21px 0; border-bottom: 1px solid var(--line-dark); }.integration-logo { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 12px; background: #fff; }.integration-logo img { width: 23px; height: 23px; object-fit: contain; }.integration-logo--whatsapp { color: #fff; background: #1bb37b; font-size: 23px; }.integration-line strong, .integration-line span { display: block; }.integration-line strong { margin-bottom: 2px; color: #f8fafc; font-size: 14px; }.integration-line span, .integration-line small { color: #93a5b7; font-size: 11px; }.integration-line > b { color: var(--mint); font-size: 19px; font-weight: 500; }.integration-line small { text-align: right; }

/* Proof, pricing, FAQ */
.proof-section { padding: 142px 0; }.proof-layout { display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(60px, 12vw, 180px); align-items: center; }.proof-stat { padding-right: 30px; border-right: 1px solid var(--line); }.proof-stat > strong { display: block; margin: 14px 0 2px; color: var(--mint-strong); font-size: clamp(72px, 9vw, 120px); letter-spacing: -.11em; line-height: .9; }.proof-stat p { max-width: 240px; margin: 15px 0 25px; color: var(--ink-soft); font-size: 14px; }.proof-line { display: block; width: 42px; height: 2px; margin-bottom: 13px; background: var(--mint-strong); }.proof-stat small { color: var(--ink-muted); font-size: 11px; }.proof-quote blockquote { max-width: 680px; margin: 12px 0 30px; color: var(--ink); font-size: clamp(28px, 4vw, 47px); font-weight: 700; letter-spacing: -.065em; line-height: 1.12; }.quote-author { display: flex; align-items: center; gap: 12px; }.quote-author > span { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 50%; color: #156047; background: #dff7eb; font-size: 11px; font-weight: 800; }.quote-author strong, .quote-author small { display: block; }.quote-author strong { font-size: 12px; }.quote-author small { color: var(--ink-muted); font-size: 11px; }
.pricing-section { position: relative; overflow: hidden; padding: 142px 0; }.pricing-section::before { position: absolute; top: -220px; left: -160px; width: 520px; height: 520px; border-radius: 50%; background: radial-gradient(circle, rgba(75,126,255,.14), transparent 69%); content: ""; }.pricing-layout { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 430px; align-items: center; gap: clamp(60px, 10vw, 150px); }.pricing-copy h2 { max-width: 580px; }.pricing-copy > p:not(.eyebrow) { max-width: 450px; color: #9fafc0; font-size: 17px; line-height: 1.7; }.pricing-assurance { margin-top: 30px; color: #b7c6d4; font-size: 12px; line-height: 2.25; }.pricing-assurance span { margin-right: 8px; color: var(--mint); font-weight: 800; }.pricing-card { padding: 31px; border: 1px solid rgba(113,227,182,.42); border-radius: 22px; color: var(--ink); background: #fff; box-shadow: 0 28px 70px -34px rgba(0,0,0,.75); }.pricing-card__top { display: flex; align-items: center; justify-content: space-between; padding-bottom: 22px; border-bottom: 1px solid var(--line); color: var(--ink-muted); font-size: 10px; font-weight: 800; letter-spacing: .12em; }.pricing-trial { padding: 6px 9px; border-radius: 999px; color: #117c58; background: #def8ea; letter-spacing: .03em; text-transform: none; }.pricing-card__intro { margin: 25px 0 5px; color: var(--ink-soft); font-size: 14px; }.pricing-value { display: flex; align-items: baseline; gap: 4px; }.pricing-value small { color: var(--ink-soft); font-size: 19px; font-weight: 700; }.pricing-value strong { font-size: 54px; letter-spacing: -.09em; line-height: 1; }.pricing-value span { color: var(--ink-muted); font-size: 12px; }.pricing-after { margin: 10px 0 22px; color: #17835d; font-size: 11px; font-weight: 700; }.pricing-card ul { display: grid; gap: 11px; margin: 0 0 26px; padding: 20px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); list-style: none; }.pricing-card li { position: relative; padding-left: 21px; color: var(--ink-soft); font-size: 12px; }.pricing-card li::before { position: absolute; top: 1px; left: 0; color: var(--mint-strong); content: "✓"; font-weight: 900; }.pricing-card > .button { width: 100%; }.pricing-footnote { display: block; margin-top: 12px; color: var(--ink-muted); font-size: 10px; text-align: center; }
.faq-section { padding: 142px 0 150px; }.faq-layout { display: grid; grid-template-columns: .78fr 1.22fr; align-items: start; gap: clamp(60px, 11vw, 170px); }.faq-layout .section-copy { position: sticky; top: 120px; }.faq-layout .section-copy > p:not(.eyebrow) { max-width: 330px; }.faq-list { border-top: 1px solid var(--line); }.faq-item { border-bottom: 1px solid var(--line); }.faq-question { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 23px 0; border: 0; color: var(--ink); background: transparent; cursor: pointer; font-size: 16px; font-weight: 750; letter-spacing: -.03em; text-align: left; }.faq-question b { display: grid; width: 25px; height: 25px; place-items: center; border: 1px solid #cbd5e1; border-radius: 50%; color: var(--ink-muted); font-size: 18px; font-weight: 400; line-height: 1; transition: transform .25s, color .25s, background .25s; }.faq-item.is-open .faq-question b { color: #fff; background: var(--ink); transform: rotate(45deg); }.faq-answer { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s ease; }.faq-answer p { overflow: hidden; max-width: 650px; margin: 0; color: var(--ink-muted); font-size: 14px; line-height: 1.7; }.faq-item.is-open .faq-answer { grid-template-rows: 1fr; }.faq-item.is-open .faq-answer p { padding: 0 45px 25px 0; }
.final-cta { padding: 150px 0 160px; text-align: center; }.final-cta__inner { max-width: 680px; }.final-cta h2 { margin-bottom: 16px; font-size: clamp(43px, 6vw, 74px); }.final-cta p:not(.eyebrow) { max-width: 500px; margin: 0 auto 31px; color: #a9b9c9; font-size: 17px; }

/* Footer */
.site-footer { color: #a4b4c3; background: #050d18; }.footer-grid { display: grid; grid-template-columns: 1.4fr .6fr .6fr; gap: 80px; padding: 74px 0 64px; }.footer-brand img { width: 130px; }.footer-brand p { max-width: 250px; margin: 18px 0 20px; font-size: 12px; line-height: 1.7; }.footer-socials { display: flex; gap: 15px; }.footer-socials a { color: #dbe7ef; font-size: 11px; }.footer-socials a:hover, .footer-column a:hover { color: var(--mint); }.footer-column { display: flex; flex-direction: column; gap: 12px; }.footer-column h3 { margin: 0 0 5px; color: #f8fafc; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }.footer-column a { font-size: 12px; }.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 21px 0; border-top: 1px solid rgba(203,213,225,.12); color: #738598; font-size: 10px; }.footer-bottom > span:last-child { display: inline-flex; align-items: center; gap: 9px; }.footer-bottom img { display: block; width: 82px; height: auto; opacity: .82; }.whatsapp-float { position: fixed; right: 22px; bottom: 22px; z-index: 20; display: grid; width: 49px; height: 49px; place-items: center; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; color: #062015; background: var(--mint); box-shadow: 0 16px 30px -14px #000; font-size: 25px; transition: transform .2s; }.whatsapp-float:hover { transform: translateY(-3px) scale(1.04); }

@media (max-width: 1100px) {
  .container { width: min(var(--container), calc(100% - 44px)); }
  .hero-layout { grid-template-columns: minmax(0, .84fr) minmax(470px, 1.16fr); gap: 20px; }
  .hero-copy h1 { font-size: clamp(47px, 6vw, 67px); }
  .product-stage { transform: scale(.9); transform-origin: center right; }
  .dashboard-callout { min-width: 140px; }
  .pricing-layout { gap: 60px; }
}

@media (max-width: 820px) {
  .container { width: min(var(--container), calc(100% - 40px)); }
  .desktop-nav, .header-login, .header-actions > .button { display: none; }
  .menu-toggle { display: block; }
  .mobile-navigation { display: flex; flex-direction: column; max-height: 0; overflow: hidden; padding: 0 20px; border-top: 1px solid transparent; background: #fff; color: var(--ink); transition: max-height .3s ease, padding .3s, border-color .3s; }
  .mobile-navigation.is-open { max-height: 450px; padding-top: 14px; padding-bottom: 20px; border-top-color: var(--line); box-shadow: 0 20px 35px -28px #0f172a; }
  .mobile-navigation a:not(.button) { padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 14px; font-weight: 650; }
  .mobile-navigation__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding-top: 16px; }
  .hero-section, .hero-layout { min-height: 0; }
  .hero-layout { display: block; padding-top: 145px; padding-bottom: 100px; }
  .hero-copy { max-width: 620px; }
  .hero-lead { max-width: 530px; }
  .product-stage { width: min(680px, 100%); height: 570px; margin: 38px auto 0; transform: none; }
  .stage-dashboard { left: 2%; width: 75%; }
  .stage-phone { right: 6%; width: 30%; }
  .trust-strip__inner { grid-template-columns: repeat(2, 1fr); gap: 0; padding: 0; }
  .trust-strip__inner span { justify-content: flex-start; padding: 18px 12px 18px 0; }.trust-strip__inner span:nth-child(3) { border-left: 0; }.trust-strip__inner span:nth-child(n+3) { border-top: 1px solid var(--line); }
  .problem-section, .flow-section, .dashboard-section, .resources-section, .integrations-section, .proof-section, .pricing-section, .faq-section { padding-top: 100px; padding-bottom: 100px; }
  .split-layout, .split-heading, .proof-layout, .pricing-layout, .faq-layout { grid-template-columns: 1fr; gap: 48px; }
  .faq-layout .section-copy { position: static; }
  .before-after-wrap { margin-top: 60px; }
  .flow-steps { grid-template-columns: 1fr; gap: 13px; padding: 44px 15px 20px; }.flow-connector { flex-direction: row; justify-content: center; }.flow-connector span { transform: rotate(90deg); }.flow-step { min-height: 130px; }
  .dashboard-visual { margin-top: 42px; padding: 0 3% 100px; }.dashboard-callout--balance { left: -2%; }.dashboard-callout--health { right: -2%; }.dashboard-callout--reports { right: 5%; bottom: 1%; }.dashboard-meta { flex-wrap: wrap; justify-content: flex-start; gap: 13px 28px; }.split-heading > p { max-width: 520px; }
  .split-layout--integration { gap: 55px; }.integration-line { grid-template-columns: 42px 1fr auto; }.integration-line small { display: none; }
  .proof-stat { padding-right: 0; padding-bottom: 38px; border-right: 0; border-bottom: 1px solid var(--line); }.proof-stat p { max-width: 400px; }
  .pricing-layout { align-items: start; }.pricing-card { width: min(430px, 100%); }
  .footer-grid { grid-template-columns: 1.4fr 1fr 1fr; gap: 35px; }
}

@media (max-width: 560px) {
  .container { width: min(var(--container), calc(100% - 32px)); }
  h1 { font-size: clamp(43px, 13vw, 59px); }.hero-lead { font-size: 16px; }.hero-actions { align-items: stretch; flex-direction: column; }.hero-actions .button { width: 100%; }.hero-actions .button--text-light { justify-content: flex-start; }.hero-note { flex-wrap: wrap; gap: 7px; font-size: 10px; }
  .product-stage { height: 430px; margin-top: 26px; }.stage-label--top { top: 0; left: 2%; }.stage-dashboard { top: 46px; width: 86%; }.stage-dashboard__content { min-height: 224px; }.stage-main { padding: 15px; }.stage-balance { margin-top: 11px; font-size: 21px; }.stage-chart { height: 68px; margin-top: 17px; }.stage-metrics { margin-top: 8px; font-size: 6px; }.stage-metrics b { font-size: 8px; }.stage-phone { top: 91px; right: 1%; width: 38%; padding: 5px; border-radius: 21px; }.stage-phone::before { top: 5px; height: 9px; }.stage-phone__screen { border-radius: 16px; }.phone-status { padding: 6px 7px 2px; font-size: 5px; }.phone-chat-head { gap: 4px; padding: 8px 6px 7px; font-size: 6px; }.phone-avatar { width: 15px; height: 15px; font-size: 9px; }.phone-chat-head small { font-size: 4.5px; }.phone-chat { min-height: 190px; gap: 4px; padding: 9px 5px 7px; }.chat-bubble { padding: 6px; font-size: 6px; }.chat-bubble small { font-size: 4px; }.phone-input { gap: 4px; padding: 5px; font-size: 5px; }.phone-input span:nth-child(2) { padding: 3px 5px; }.stage-event { padding: 6px 7px; gap: 5px; font-size: 6px; }.stage-event b { font-size: 8px; }.stage-event i { width: 12px; height: 12px; font-size: 8px; }.stage-event--expense { right: -2%; bottom: 67px; }.stage-event--goal { bottom: 12px; left: 2%; }
  .trust-strip__inner span { gap: 6px; font-size: 9px; }.trust-strip b { font-size: 8px; }
  .problem-section, .flow-section, .dashboard-section, .resources-section, .integrations-section, .proof-section, .pricing-section, .faq-section { padding-top: 80px; padding-bottom: 82px; }.section-copy > p:not(.eyebrow), .section-intro > p:not(.eyebrow) { font-size: 15px; }.problem-item { grid-template-columns: 31px 1fr; gap: 8px; }.problem-item strong { font-size: 15px; }.problem-item p { font-size: 12px; }.before-after-card { grid-template-columns: 1fr; }.before-after-card__image { min-height: 210px; }.before-after-card__copy { min-height: 220px; padding: 28px; }.before-after-card__copy h3 { font-size: 31px; }
  .flow-tabs { width: 100%; }.flow-tab { flex: 1; padding-inline: 10px; }.flow-step { min-height: 124px; padding: 24px 17px 16px; }.flow-message { font-size: 12px; }
  .dashboard-heading h2 { font-size: 39px; }.dashboard-visual { padding-right: 0; padding-left: 0; }.browser-bar { height: 28px; padding-inline: 8px; font-size: 7px; }.browser-url { padding: 4px; }.dashboard-callout { position: static; display: inline-flex; min-width: 0; margin-top: 12px; margin-right: 5px; padding: 8px 10px; }.dashboard-callout::after { display: none; }.dashboard-callout b { font-size: 10px; }.dashboard-callout small { font-size: 8px; }.dashboard-meta { font-size: 9px; }
  .resource-row { grid-template-columns: 31px 44px 1fr; gap: 12px; }.resource-arrow { display: none; }.resource-copy h3 { font-size: 17px; }.resource-copy p { font-size: 12px; }.integration-line { gap: 10px; }.integration-line strong { font-size: 12px; }.integration-line span { font-size: 9px; }.integration-logo { width: 36px; height: 36px; }
  .proof-stat > strong { font-size: 88px; }.proof-quote blockquote { font-size: 31px; }.pricing-card { padding: 23px; }.pricing-value strong { font-size: 48px; }.pricing-card li { font-size: 11px; }.faq-question { gap: 16px; font-size: 14px; }.faq-item.is-open .faq-answer p { padding-right: 28px; }.final-cta { padding-top: 100px; padding-bottom: 108px; }.final-cta h2 { font-size: 43px; }.final-cta p:not(.eyebrow) { font-size: 15px; }.footer-grid { grid-template-columns: 1fr 1fr; padding-top: 55px; }.footer-brand { grid-column: 1 / -1; }.footer-bottom { align-items: flex-start; flex-direction: column; }.whatsapp-float { right: 14px; bottom: 14px; width: 44px; height: 44px; }
}

/* Brand and floating contact affordance */
.footer-bottom > span:last-child img { width: 106px; height: auto; opacity: 1; }
.whatsapp-float { color: #fff; background: #25d366; }
.whatsapp-float svg { display: block; width: 25px; height: 25px; fill: currentColor; }

@media (max-width: 560px) {
  .whatsapp-float svg { width: 23px; height: 23px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

/* Real product mockup used in the hero */
.product-stage--real { height: 650px; transform: none; transform-origin: center; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.product-stage--real .stage-label--top { top: 2px; left: 2%; }
.real-screen { position: absolute; z-index: 2; margin: 0; border: 0; background: transparent; box-shadow: 0 35px 58px -30px rgba(0, 0, 0, .9); }
.real-screen img { display: block; width: 100%; height: auto; }
.real-screen figcaption { position: absolute; top: 10px; left: 10px; padding: 5px 8px; border: 1px solid rgba(255,255,255,.25); border-radius: 999px; color: #fff; background: rgba(7, 17, 31, .7); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.macbook-screen { position: relative; overflow: hidden; padding: 7px 7px 6px; border: 1px solid #3a4d5b; border-bottom-color: #16212b; border-radius: 15px 15px 7px 7px; background: #101820; box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 -8px 20px rgba(0,0,0,.3); }
.macbook-screen img { border-radius: 8px; }
.macbook-camera { position: absolute; top: 4px; left: 50%; z-index: 2; width: 4px; height: 4px; border-radius: 50%; background: #05080b; box-shadow: 0 0 0 1px rgba(255,255,255,.12); transform: translateX(-50%); }
.macbook-base { position: relative; width: 110%; height: 13px; margin-left: -5%; border: 1px solid #425563; border-top: 0; border-radius: 0 0 16px 16px; background: linear-gradient(180deg, #7b8d99 0%, #334550 42%, #15212b 100%); box-shadow: 0 8px 8px -5px rgba(0,0,0,.75); }
.macbook-base::before { position: absolute; top: 0; left: 50%; width: 18%; height: 3px; border-radius: 0 0 5px 5px; background: #5b6c77; content: ""; transform: translateX(-50%); }
.macbook-base span { position: absolute; right: 6%; bottom: 3px; left: 6%; height: 1px; background: rgba(255,255,255,.16); }
.real-screen--desktop { top: 70px; left: -1%; width: 90%; transform: rotate(-3.5deg); transform-origin: 0 0; }
.real-screen--app { top: 135px; right: 13%; z-index: 4; width: 23%; max-width: 196px; padding: 7px; border: 1px solid #435766; border-radius: 29px; background: #0b1117; box-shadow: 16px 32px 42px -28px rgba(0,0,0,.95), inset 0 0 0 1px rgba(255,255,255,.1); transform: rotate(4deg); }
.real-screen--whatsapp { top: 84px; right: -1%; z-index: 5; width: 23%; max-width: 196px; padding: 7px; border: 1px solid #435766; border-radius: 29px; background: #0b1117; box-shadow: 16px 32px 42px -28px rgba(0,0,0,.95), inset 0 0 0 1px rgba(255,255,255,.1); transform: rotate(8deg); }
.phone-hardware { position: relative; overflow: hidden; border-radius: 21px; background: #090e13; }
.phone-hardware::after { position: absolute; inset: 0; border: 1px solid rgba(255,255,255,.15); border-radius: inherit; content: ""; pointer-events: none; }
.phone-speaker { position: absolute; top: 3px; left: 50%; z-index: 2; width: 32%; height: 6px; border-radius: 0 0 7px 7px; background: #060a0e; transform: translateX(-50%); }
.real-screen--app .phone-hardware img, .real-screen--whatsapp .phone-hardware img { border-radius: 21px; }
.real-screen--app figcaption, .real-screen--whatsapp figcaption { top: 9px; left: 9px; font-size: 8px; }
.real-flow { position: absolute; right: 10%; bottom: 17px; z-index: 6; display: flex; align-items: center; gap: 8px; padding: 8px 11px; border: 1px solid rgba(113, 227, 182, .3); border-radius: 9px; color: #e7f5ee; background: rgba(8, 23, 36, .9); box-shadow: 0 16px 28px -20px #000; font-size: 9px; font-weight: 750; }.real-flow i { color: var(--mint); font-size: 15px; font-style: normal; }

@media (max-width: 820px) {
  .product-stage--real { height: 590px; }
  .real-screen--desktop { left: 0; width: 86%; }
  .real-screen--app { right: 11%; width: 23%; }
  .real-screen--whatsapp { right: -1%; width: 23%; }
  .real-flow { right: 7%; bottom: 9px; }
}

@media (max-width: 560px) {
  .product-stage--real { height: 455px; }
  .product-stage--real .stage-label--top { top: 0; left: 0; font-size: 8px; }
  .real-screen--desktop { top: 55px; left: 0; width: 96%; transform: rotate(-2deg); }
  .macbook-screen { padding: 4px 4px 3px; border-radius: 9px 9px 4px 4px; }.macbook-screen img { border-radius: 4px; }.macbook-base { height: 8px; }.macbook-base::before { height: 2px; }
  .real-screen--app { top: 108px; right: 12%; width: 29%; padding: 4px; border-radius: 17px; transform: rotate(3deg); }.real-screen--whatsapp { top: 81px; right: -2%; width: 29%; padding: 4px; border-radius: 17px; transform: rotate(6deg); }.phone-hardware, .real-screen--app .phone-hardware img, .real-screen--whatsapp .phone-hardware img { border-radius: 13px; }.phone-speaker { top: 2px; height: 3px; }
  .real-screen figcaption { top: 5px; left: 5px; padding: 3px 5px; font-size: 5px; }
  .real-flow { right: 0; bottom: 0; gap: 5px; padding: 6px 7px; font-size: 6px; }.real-flow i { font-size: 10px; }
}

/* Persistent mobile conversion affordance */
.mobile-sticky-cta { display: none; }
.integration-logo--whatsapp svg { display: block; width: 23px; height: 23px; fill: currentColor; }

@media (max-width: 560px) {
  .mobile-sticky-cta { position: fixed; right: 0; bottom: 0; left: 0; z-index: 19; display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 64px; padding: 10px 78px 10px 16px; border-top: 1px solid rgba(113, 227, 182, .18); color: #dce9e5; background: rgba(5, 13, 24, .94); box-shadow: 0 -16px 35px -25px #000; opacity: 0; visibility: hidden; transform: translateY(100%); transition: opacity .25s, transform .25s, visibility .25s; }
  .mobile-sticky-cta.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
  .mobile-sticky-cta > span { font-size: 11px; font-weight: 700; }
  .mobile-sticky-cta .button { flex: none; }
  .whatsapp-float { bottom: 76px; }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-sticky-cta { transition: none; }
}