:root {
  --green: #153f33;
  --green-dark: #0f3128;
  --green-bright: #28785d;
  --green-medium: #3e8a6b;
  --green-soft: #dff0e7;
  --mint: #eef8f2;
  --sage: #c9dfd3;
  --ink: #111827;
  --muted: #5d6674;
  --stone: #f5f8f4;
  --cream: #f2e9d5;
  --line: #e5e7eb;
  --white: #fff;
  --gold: #bda468;
  --radius: 20px;
  --shadow: 0 24px 70px rgba(17, 40, 32, 0.11);
  --container: 1240px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body { margin: 0; color: var(--ink); background: var(--white); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
.corpio-word { font-family: "Yaro Rg", Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-style: normal; letter-spacing: .01em; }
img, svg { display: block; max-width: 100%; }
.io { display: inline-block; width: 1em; height: 1em; flex: 0 0 auto; background-color: currentColor; -webkit-mask: var(--io) center / contain no-repeat; mask: var(--io) center / contain no-repeat; }
.io-arrow-right { --io: url("assets/icons/arrow-right.svg"); }
.io-arrow-down { --io: url("assets/icons/arrow-down.svg"); }
.io-brain { --io: url("assets/icons/brain.svg"); }
.io-bright-star { --io: url("assets/icons/bright-star.svg"); }
.io-check { --io: url("assets/icons/check.svg"); }
.io-check-circle { --io: url("assets/icons/check-circle.svg"); }
.io-check-circle-solid { --io: url("assets/icons/check-circle-solid.svg"); }
.io-clipboard-check { --io: url("assets/icons/clipboard-check.svg"); }
.io-clock { --io: url("assets/icons/clock.svg"); }
.io-camera { --io: url("assets/icons/camera.svg"); }
.io-database-check { --io: url("assets/icons/database-check.svg"); }
.io-database-export { --io: url("assets/icons/database-export.svg"); }
.io-desktop { --io: url("assets/icons/desktop.svg"); }
.io-download { --io: url("assets/icons/download.svg"); }
.io-eye { --io: url("assets/icons/eye.svg"); }
.io-filter-list { --io: url("assets/icons/filter-list.svg"); }
.io-graph-up { --io: url("assets/icons/graph-up.svg"); }
.io-home { --io: url("assets/icons/home-simple.svg"); }
.io-linkedin { --io: url("assets/icons/linkedin.svg"); }
.io-menu { --io: url("assets/icons/menu.svg"); }
.io-media-image { --io: url("assets/icons/media-image.svg"); }
.io-more { --io: url("assets/icons/more-horiz.svg"); }
.io-nav-right { --io: url("assets/icons/nav-arrow-right.svg"); }
.io-page { --io: url("assets/icons/page.svg"); }
.io-plus { --io: url("assets/icons/plus.svg"); }
.io-rocket { --io: url("assets/icons/rocket.svg"); }
.io-search { --io: url("assets/icons/search.svg"); }
.io-scanning { --io: url("assets/icons/scanning.svg"); }
.io-settings { --io: url("assets/icons/settings-profiles.svg"); }
.io-settings-gear { --io: url("assets/icons/settings.svg"); }
.io-shield-check { --io: url("assets/icons/shield-check.svg"); }
.io-smartphone { --io: url("assets/icons/smartphone-device.svg"); }
.io-fa-display { --io: url("assets/icons/fontawesome-display.svg"); }
.io-fa-apple { --io: url("assets/icons/fontawesome-apple.svg"); }
.io-fa-android { --io: url("assets/icons/fontawesome-android.svg"); }
.io-group { --io: url("assets/icons/group.svg"); }
.io-sparks { --io: url("assets/icons/sparks.svg"); }
.io-upload { --io: url("assets/icons/upload.svg"); }
.io-xmark { --io: url("assets/icons/xmark.svg"); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { letter-spacing: -0.035em; line-height: 1.08; }
h1 { margin-bottom: 24px; font-family: "Avenir Next", "Helvetica Neue", Inter, ui-sans-serif, sans-serif; font-size: clamp(2.65rem, 4.15vw, 4.1rem); font-weight: 650; letter-spacing: -.045em; line-height: 1.02; }
h2 { margin-bottom: 20px; font-size: clamp(2.2rem, 3.65vw, 3.6rem); font-weight: 620; }
h3 { margin-bottom: 12px; font-size: 1.2rem; }
p { color: var(--muted); }
.container { width: min(calc(100% - 48px), var(--container)); margin-inline: auto; }
.section { padding-block: 104px; }
.section-compact { padding-block: 44px; }
.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; }
.skip-link { position: fixed; z-index: 1000; top: 10px; left: 10px; padding: 10px 16px; color: white; background: var(--green); border-radius: 8px; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 3px solid #bd9c4e; outline-offset: 3px; }

.site-header { position: fixed; z-index: 100; top: 0; right: 0; left: 0; height: 72px; background: transparent; border-bottom: 1px solid rgba(21, 63, 51, .14); box-shadow: 0 7px 20px rgba(15, 49, 40, .045); backdrop-filter: none; transition: background-color .25s ease, border-color .25s ease, box-shadow .25s ease, backdrop-filter .25s ease; }
.site-header.scrolled, body.menu-open .site-header { background: rgba(255, 255, 255, .98); border-color: rgba(229, 231, 235, .95); box-shadow: 0 8px 30px rgba(17, 24, 39, .07); backdrop-filter: blur(16px); }
.header-inner { display: flex; height: 100%; align-items: center; gap: 28px; }
.brand { display: inline-flex; align-items: center; flex-shrink: 0; }
.brand .brand-logo { width: 116px; height: auto; }
.main-nav { display: flex; align-items: center; justify-content: center; gap: 24px; margin-left: auto; }
.main-nav a, .text-action { color: #3e4855; font-size: .84rem; font-weight: 560; transition: color .2s; }
.main-nav a:hover, .text-action:hover { color: var(--green); }
.header-actions { display: flex; align-items: center; gap: 14px; margin-left: 18px; }
.header-actions .text-action { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; padding: 10px 17px; background: #eef1f0; border: 1px solid #e4e8e6; border-radius: 10px; transition: color .2s, background .2s, border-color .2s, transform .2s; }.header-actions .text-action:hover { color: var(--green); background: #e7efeb; border-color: #cadbd2; transform: translateY(-1px); }
.menu-toggle { display: none; width: 42px; height: 42px; padding: 9px; place-items: center; background: transparent; border: 0; }
.menu-toggle .io { width: 24px; height: 24px; }
.menu-toggle .io-xmark { display: none; }
.menu-toggle[aria-expanded="true"] .io-menu { display: none; }
.menu-toggle[aria-expanded="true"] .io-xmark { display: inline-block; }

.button { display: inline-flex; min-height: 47px; align-items: center; justify-content: center; gap: 10px; padding: 11px 20px; border: 1px solid transparent; border-radius: 10px; font-weight: 650; line-height: 1; cursor: pointer; transition: transform .2s, box-shadow .2s, color .2s, background .2s, border-color .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { color: white; background: var(--green-bright); box-shadow: 0 9px 22px rgba(40, 120, 93, .25); }
.button-primary:hover { background: #20684f; box-shadow: 0 13px 28px rgba(40, 120, 93, .32); }
.button-secondary { color: var(--ink); background: white; border-color: #d5d9dd; }
.button-secondary:hover { border-color: #aeb6b3; }
.button-compact { min-height: 39px; padding: 9px 15px; font-size: .82rem; border-radius: 8px; }

.hero { position: relative; min-height: 800px; padding-top: 100px; padding-bottom: 105px; overflow: hidden; background: linear-gradient(135deg, #ffffff 0%, #ffffff 44%, #f0f8f3 100%); }
.hero::before { content: none; }
.hero::after { content: none; }
.hero-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 60px; }
.hero-grid > *, .connections-layout > * { min-width: 0; }
.hero-copy { position: relative; z-index: 2; }
.hero h1 { max-width: 710px; }
.hero h1 em { display: block; margin-top: 6px; color: var(--green-bright); font-family: inherit; font-size: .92em; font-style: normal; font-weight: 570; letter-spacing: -.045em; }
.hero-lead { max-width: 630px; margin-bottom: 34px; font-size: 1.12rem; line-height: 1.75; }
.hero-actions { display: flex; gap: 12px; margin-bottom: 33px; }
.hero-points { display: flex; flex-wrap: wrap; gap: 10px 22px; padding: 0; margin: 0; list-style: none; color: #59616d; font-size: .76rem; font-weight: 570; }
.hero-points li { display: flex; align-items: center; gap: 6px; }
.check { display: inline-grid; width: 21px; height: 21px; place-items: center; color: var(--green-bright); font-size: 1.2rem; }

.ecosystem { color: var(--ink); background: linear-gradient(145deg, #eef8f2 0%, #fbfdfc 48%, #f7edd7 120%); }
.ecosystem-layout { display: grid; grid-template-columns: .78fr 1.22fr; align-items: center; gap: clamp(48px, 7vw, 92px); }
.ecosystem-copy h2 { max-width: 480px; margin-bottom: 20px; font-size: clamp(2.35rem, 3.5vw, 3.65rem); }
.ecosystem-kicker { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 18px; color: var(--green-bright); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.ecosystem-kicker .io { width: 18px; height: 18px; }
.ecosystem-lead { max-width: 520px; margin-bottom: 27px; font-size: .96rem; line-height: 1.75; }
.ecosystem-capabilities { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 25px; }
.ecosystem-capabilities > span { display: grid; min-width: 150px; grid-template-columns: 34px 1fr; grid-template-rows: auto auto; column-gap: 10px; align-items: center; padding: 11px 14px; background: rgba(255,255,255,.82); border: 1px solid #c5ded1; border-radius: 13px; box-shadow: 0 8px 24px rgba(15,49,40,.06); }
.ecosystem-capabilities .io { width: 20px; height: 20px; grid-row: 1 / 3; color: var(--green-bright); }
.ecosystem-capabilities > span:nth-child(2) .io { color: #a38338; }
.ecosystem-capabilities b { color: var(--green); font-size: .78rem; line-height: 1.2; }.ecosystem-capabilities small { color: var(--muted); font-size: .58rem; line-height: 1.3; }
.ecosystem-roadmap { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 14px; padding: 9px 12px; color: #725b21; background: #f6e7c0; border: 1px solid #dfc98d; border-radius: 12px; }
.ecosystem-roadmap > .io { width: 18px; height: 18px; color: #a38338; }.ecosystem-roadmap > span:last-child { display: flex; align-items: baseline; gap: 8px; }.ecosystem-roadmap b { font-size: .68rem; }.ecosystem-roadmap small { color: #806b39; font-size: .59rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.ecosystem-note { display: block; max-width: 520px; color: #718078; font-size: .62rem; line-height: 1.6; }
.integration-showcase { position: relative; padding: 22px; overflow: hidden; background: linear-gradient(145deg, #0f3128 0%, #174c3b 55%, #28785d 130%); border: 1px solid #387762; border-radius: 28px; box-shadow: 0 28px 70px rgba(15,49,40,.19); }
.integration-showcase::before { content: ""; position: absolute; width: 280px; height: 280px; right: -100px; bottom: -170px; background: rgba(189,164,104,.18); border-radius: 50%; filter: blur(4px); }
.integration-showcase-head { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 16px; color: #fff; }
.integration-showcase-head span { font-size: .78rem; font-weight: 750; }.integration-showcase-head small { color: #a9c9bc; font-size: .57rem; letter-spacing: .06em; text-transform: uppercase; }
.integration-grid { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.integration-logo { display: grid; min-height: 88px; place-items: center; padding: 15px 12px; overflow: hidden; background: rgba(255,255,255,.09); border: 1px solid rgba(223,240,231,.2); border-radius: 14px; transition: transform .22s ease, background .22s ease, border-color .22s ease; }
.integration-logo:nth-child(2), .integration-logo:nth-child(6) { background: rgba(189,164,104,.13); border-color: rgba(224,197,132,.25); }
.integration-logo:nth-child(3), .integration-logo:nth-child(4) { background: rgba(74,154,195,.12); border-color: rgba(112,192,222,.22); }
.integration-logo:nth-child(5) { background: rgba(188,72,72,.11); border-color: rgba(233,135,135,.2); }
.integration-logo:hover { z-index: 1; background: rgba(255,255,255,.15); border-color: rgba(223,240,231,.38); transform: translateY(-3px); }
.integration-logo img { width: 112px; height: 48px; object-fit: contain; }
.integration-logo--mark img { width: 55px; }

.stone-section { background: linear-gradient(180deg, #f2f8f4 0%, #edf5f0 100%); }
.section-heading { max-width: 760px; margin-bottom: 48px; }.section-heading.centered { margin-inline: auto; text-align: center; }.section-heading p { max-width: 620px; margin: 0 auto; font-size: 1rem; }.section-heading h2 { font-size: clamp(2.05rem, 3.1vw, 3.05rem); }
.steps { --step-gap: 52px; position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--step-gap); align-items: stretch; padding: 0; margin: 0; overflow: visible; list-style: none; }
.step-card { position: relative; z-index: 1; min-height: 250px; padding: 25px 20px 22px; background: rgba(255,255,255,.96); border: 1px solid #cee1d7; border-radius: 14px; box-shadow: 0 8px 20px rgba(30, 92, 69, .04); transition: transform .25s, box-shadow .25s, border-color .25s; }
.step-card:not(:last-child)::after { content: ""; position: absolute; top: 50%; right: calc(var(--step-gap) / -2 - 12px); width: 24px; height: 24px; background-color: #4f8872; -webkit-mask: url("assets/icons/arrow-right.svg") center / contain no-repeat; mask: url("assets/icons/arrow-right.svg") center / contain no-repeat; transform: translateY(-50%); pointer-events: none; }
.step-card:hover { transform: translateY(-5px); border-color: #8ebda7; box-shadow: 0 20px 38px rgba(28, 99, 72, .13); }
.icon-box { display: grid; width: 45px; height: 45px; place-items: center; margin-bottom: 33px; color: #175b45; background: #d9efe4; border: 1px solid #bcdccc; border-radius: 11px; font-size: 1.3rem; font-weight: 700; }
.step-card:nth-child(2) .icon-box { color: #786327; background: #f5ecd5; border-color: #e7d7ad; }
.step-card:nth-child(3) .icon-box { color: #2c6e58; background: #d8eee5; }
.step-card:nth-child(4) .icon-box { color: #fff; background: var(--green-bright); border-color: var(--green-bright); }
.step-card:nth-child(5) .icon-box { color: #315e50; background: #cfe5da; }
.step-card h3 { font-size: 1.06rem; }.step-card p { margin-bottom: 0; font-size: .82rem; line-height: 1.65; }

.connections-section { position: relative; overflow: hidden; color: #fff; background: radial-gradient(circle at 50% 38%, rgba(40,120,93,.25), transparent 38%), linear-gradient(135deg, #091f19 0%, #0f3128 48%, #153f33 100%); }
.connections-section::before { content: ""; position: absolute; inset: 0; opacity: .08; background-image: linear-gradient(rgba(255,255,255,.24) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.24) 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(to bottom, #000, transparent 88%); }
.connections-section .container { position: relative; }.connections-heading { max-width: 790px; margin: 0 auto 48px; text-align: center; }.connections-heading .section-kicker { color: #8dd7b3 !important; }.connections-heading h2 { color: #fff; font-size: clamp(2.15rem, 3.25vw, 3.25rem); line-height: 1.08; }.connections-heading h2 .corpio-word { color: #b7e7ce; }.connections-heading > p:last-child { max-width: 680px; margin: 0 auto; color: #b8cbc3; font-size: .94rem; line-height: 1.7; }
.connections-layout { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 58px; }.connection-cards { order: 1; }.connection-map { order: 2; }
.connection-map { position: relative; min-height: 500px; overflow: hidden; background: radial-gradient(circle at 48% 50%, rgba(40,120,93,.2), transparent 31%), radial-gradient(circle at 76% 22%, rgba(185,147,255,.07), transparent 24%), radial-gradient(circle at 76% 78%, rgba(242,208,111,.06), transparent 24%); }.connection-orbit { position: absolute; top: 50%; left: 47%; border: 1px dashed rgba(141,215,179,.14); border-radius: 50%; transform: translate(-50%, -50%); }.connection-orbit--outer { width: 390px; height: 390px; }.connection-orbit--inner { width: 265px; height: 265px; border-color: rgba(242,217,150,.12); }.connection-paths { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }.connection-path { fill: none; stroke-width: 3; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-dasharray: 2 10; animation: connection-flow 2s linear infinite; }.connection-path--accounting { stroke: #69cfa0; filter: drop-shadow(0 0 5px rgba(105,207,160,.42)); }.connection-path--ai { stroke: #b993ff; filter: drop-shadow(0 0 5px rgba(185,147,255,.42)); animation-duration: 1.7s; }.connection-path--alerts { stroke: #f2d06f; filter: drop-shadow(0 0 5px rgba(242,208,111,.36)); animation-duration: 2.2s; }.connection-hub { position: absolute; z-index: 2; top: 50%; left: 47%; display: grid; width: 126px; height: 126px; place-items: center; padding: 19px; background: radial-gradient(circle at 40% 28%, #246f56, #102e26 70%); border: 1px solid rgba(201,223,211,.34); border-radius: 50%; box-shadow: 0 0 0 10px rgba(201,223,211,.035), 0 22px 55px rgba(0,0,0,.28), 0 0 48px rgba(105,207,160,.12); transform: translate(-50%, -50%); }.connection-hub img { width: 54px; height: 54px; object-fit: contain; filter: brightness(0) invert(1); }.connection-hub .corpio-word { color: #fff; font-size: .78rem; }
.connection-node { position: absolute; z-index: 2; display: flex; min-width: 190px; align-items: center; gap: 12px; padding: 13px 15px; background: rgba(20,43,35,.92); border: 1px solid rgba(201,223,211,.2); border-radius: 16px; box-shadow: 0 14px 34px rgba(0,0,0,.22); backdrop-filter: blur(12px); }.connection-node > span:last-child { display: grid; gap: 2px; }.connection-node strong { color: #fff; font-size: .78rem; }.connection-node small { color: #99aea5; font-size: .6rem; }.connection-node-icon { display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; border-radius: 11px; }.connection-node-icon .io { width: 20px; height: 20px; }.connection-node--accounting { top: 50%; left: 1%; transform: translateY(-50%); }.connection-node--accounting .connection-node-icon { color: #77d7a8; background: rgba(40,120,93,.35); }.connection-node--ai { top: 12%; right: 2%; }.connection-node--ai .connection-node-icon { color: #c7a9ff; background: rgba(112,64,190,.28); }.connection-node--alerts { right: 2%; bottom: 12%; }.connection-node--alerts .connection-node-icon { color: #f2d06f; background: rgba(189,164,104,.23); }
.connection-cards { display: grid; gap: 14px; }.connection-card { display: grid; grid-template-columns: 52px 1fr; gap: 17px; padding: 22px; background: rgba(255,255,255,.075); border: 1px solid rgba(201,223,211,.16); border-radius: 18px; box-shadow: inset 3px 0 rgba(105,207,160,.7); }.connection-card--alerts { box-shadow: inset 3px 0 rgba(242,208,111,.72); }.connection-card--ai { box-shadow: inset 3px 0 rgba(185,147,255,.72); }.connection-card-icon { display: grid; width: 50px; height: 50px; place-items: center; color: #86dcaf; background: rgba(40,120,93,.34); border-radius: 13px; }.connection-card--alerts .connection-card-icon { color: #f2d06f; background: rgba(189,164,104,.2); }.connection-card--ai .connection-card-icon { color: #c7a9ff; background: rgba(112,64,190,.24); }.connection-card-icon .io { width: 24px; height: 24px; }.connection-card h3 { margin: 5px 0 7px; color: #fff; font-size: 1.03rem; }.connection-card p { margin: 0; color: #afc1ba; font-size: .76rem; line-height: 1.65; }.connection-status { display: inline-flex; padding: 4px 7px 3px; border-radius: 999px; font-size: .5rem; font-weight: 820; letter-spacing: .08em; text-transform: uppercase; }.connection-status--available { color: #bdebd2; background: rgba(40,120,93,.28); }.connection-status--soon { color: #f4dda2; background: rgba(189,164,104,.18); }.connection-status--beta { color: #dbc9ff; background: rgba(112,64,190,.2); }.connections-note { max-width: 860px; margin: 38px auto 0; color: #829d92; font-size: .63rem; line-height: 1.6; text-align: center; }
@keyframes connection-flow { to { stroke-dashoffset: -24; } }

.benefits-section { background: linear-gradient(145deg, #eaf5ef 0%, #f5f8ee 60%, #f6edda 145%); }.benefit-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }.benefit-card { --benefit-accent: var(--green-medium); position: relative; min-height: 280px; padding: 28px 25px; overflow: hidden; background: rgba(255,255,255,.92); border: 1px solid #c9ded3; border-radius: 14px; box-shadow: inset 0 3px var(--benefit-accent); transition: transform .25s, box-shadow .25s; }.benefit-card:nth-child(2) { --benefit-accent: #b89a52; }.benefit-card:nth-child(3) { --benefit-accent: #58a783; }.benefit-card:nth-child(4) { --benefit-accent: #7eaa70; }.benefit-icon { display: grid; width: 46px; height: 46px; place-items: center; margin-bottom: 48px; color: #176047; background: #d9eee4; border-radius: 11px; font-size: 1.15rem; }.benefit-card:nth-child(2) .benefit-icon { color: #7b642a; background: #f4ead0; }.benefit-card h3 { font-size: 1.1rem; }.benefit-card p { margin-bottom: 0; font-size: .82rem; line-height: 1.65; }

.section-kicker { margin-bottom: 14px !important; color: var(--green-bright) !important; font-size: .72rem !important; font-weight: 780; letter-spacing: .12em; text-transform: uppercase; }
.audience-section { padding-top: 106px; background: linear-gradient(180deg, #fff 0%, #f4faf6 100%); }
.audience-panels { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; align-items: stretch; }
.audience-panel { position: relative; display: grid; min-width: 0; min-height: 450px; grid-template-rows: auto 1fr; gap: 24px; padding: 26px; overflow: hidden; border: 1px solid #cfe1d7; border-radius: 22px; box-shadow: 0 14px 36px rgba(15,49,40,.07); }
.audience-panel--employee { background: linear-gradient(150deg, #eef8f2 0%, #dff0e7 100%); }
.audience-panel--finance { background: linear-gradient(150deg, #edf8f2 0%, #d7ebdf 100%); border-color: #afd1c0; }
.audience-panel--accounting { background: linear-gradient(150deg, #fffdf8 0%, #f2e9d5 100%); border-color: #e6d9bb; }
.audience-copy > span { display: inline-flex; width: max-content; align-items: center; gap: 7px; margin-bottom: 12px; padding: 5px 9px 5px 7px; color: var(--green-bright); background: rgba(255,255,255,.64); border: 1px solid rgba(40,120,93,.18); border-radius: 999px; font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.audience-copy > span > .io { width: 15px; height: 15px; }
.audience-copy h3 { max-width: 360px; margin-bottom: 11px; font-size: clamp(1.35rem, 1.65vw, 1.72rem); line-height: 1.12; }
.audience-copy p { max-width: 390px; margin-bottom: 16px; font-size: .78rem; line-height: 1.58; }
.audience-copy ul { display: grid; gap: 7px; padding: 0; margin: 0; list-style: none; color: #3f5e52; font-size: .7rem; font-weight: 650; }
.audience-copy li { display: flex; align-items: center; gap: 7px; }
.audience-copy li .io { width: 15px; height: 15px; color: var(--green-bright); }
.audience-panel--finance .audience-copy > span { color: var(--green-bright); background: rgba(255,255,255,.68); border-color: rgba(40,120,93,.18); }.audience-panel--finance .audience-copy li .io { color: var(--green-bright); }
.audience-panel--finance .audience-copy h3 { color: var(--ink); }
.audience-panel--finance .audience-copy p { color: var(--muted); }
.audience-panel--finance .audience-copy ul { color: #3f5e52; }
.audience-mobile-ui, .audience-console-ui, .audience-export-ui { align-self: end; padding: 18px; background: rgba(255,255,255,.94); border: 1px solid rgba(255,255,255,.72); border-radius: 16px; box-shadow: 0 18px 35px rgba(15,49,40,.13); }
.audience-mobile-ui { display: grid; gap: 9px; }
.audience-mobile-ui > div { display: flex; align-items: center; justify-content: space-between; margin-bottom: 5px; }.audience-mobile-ui img { width: 25px; height: 25px; object-fit: contain; }.audience-mobile-ui small { color: #596d65; font-size: .58rem; font-weight: 700; }.audience-mobile-ui > strong { font-size: .92rem; }.audience-mobile-ui > span { color: var(--muted); font-size: .65rem; }
.audience-mobile-ui > b, .audience-mobile-ui > em { display: flex; min-height: 48px; align-items: center; gap: 9px; padding: 11px 13px; border-radius: 10px; font-size: .7rem; font-style: normal; }.audience-mobile-ui > b { color: #fff; background: var(--green-bright); }.audience-mobile-ui > em { color: var(--green); background: #fff; border: 1px solid #c7ded2; }.audience-mobile-ui .io { width: 17px; height: 17px; }
.audience-console-ui { display: grid; gap: 8px; background: #f7faf8; }
.audience-console-ui header { display: flex; align-items: center; justify-content: space-between; padding-bottom: 10px; border-bottom: 1px solid var(--line); font-size: .7rem; font-weight: 750; }.audience-console-ui header b { display: grid; width: 25px; height: 25px; place-items: center; color: #865c0c; background: #fff0d2; border-radius: 50%; }
.audience-console-ui > div { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 10px; background: #fff; border: 1px solid #e4e9e6; border-radius: 9px; }.audience-console-ui > div > span { font-size: .68rem; font-weight: 750; }.audience-console-ui > div small { display: block; margin-top: 2px; color: var(--muted); font-size: .56rem; font-weight: 500; }.audience-console-ui > div strong { font-size: .7rem; }.audience-console-ui em { grid-column: 2; justify-self: end; padding: 2px 6px; color: #8a5b08; background: #fff2d9; border-radius: 999px; font-size: .52rem; font-style: normal; font-weight: 750; }.audience-console-ui em.approved { color: var(--green); background: var(--green-soft); }
.audience-export-ui { display: grid; gap: 7px; }.audience-export-ui > span { color: var(--muted); font-size: .62rem; }.audience-export-ui > strong { font-size: 1rem; }.audience-export-ui > div { display: grid; gap: 6px; margin-block: 9px; }.audience-export-ui > div i { display: block; height: 7px; background: linear-gradient(90deg, #cde4d8 0 70%, #edf1ef 70%); border-radius: 5px; }.audience-export-ui > div i:nth-child(2) { background: linear-gradient(90deg, #bda468 0 54%, #edf1ef 54%); }.audience-export-ui > div i:nth-child(3) { background: linear-gradient(90deg, #3e8a6b 0 82%, #edf1ef 82%); }.audience-export-ui > div i:nth-child(4) { background: linear-gradient(90deg, #7ca998 0 43%, #edf1ef 43%); }.audience-export-ui footer { display: flex; gap: 7px; }.audience-export-ui footer b { display: inline-flex; align-items: center; gap: 5px; padding: 7px 9px; color: var(--green); background: var(--mint); border-radius: 7px; font-size: .58rem; }.audience-export-ui footer .io { width: 11px; height: 11px; }

.product-story-section { background: #fff; }
.product-story { display: grid; min-height: 480px; grid-template-columns: .84fr 1.16fr; align-items: center; gap: clamp(55px, 8vw, 110px); padding: 74px 0; border-top: 1px solid var(--line); }
.product-story:first-of-type { border-top: 0; }
.product-story--control .product-story-copy { order: 2; }
.product-story-copy { max-width: 470px; }
.story-index { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 20px; padding: 6px 10px; color: var(--green); background: var(--mint); border: 1px solid var(--sage); border-radius: 999px; font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }.story-index .io { width: 14px; height: 14px; }
.product-story-copy h3 { margin-bottom: 18px; font-size: clamp(2rem, 3vw, 3.15rem); }
.product-story-copy > p { margin-bottom: 24px; font-size: 1rem; line-height: 1.75; }
.product-story-copy ul { display: grid; gap: 12px; padding: 0; margin: 0; list-style: none; color: #3e514a; font-size: .82rem; font-weight: 650; }.product-story-copy li { display: flex; align-items: center; gap: 9px; }.product-story-copy li .io { width: 18px; height: 18px; color: var(--green-bright); }
.story-visual { min-width: 0; padding: 34px; background: linear-gradient(145deg, #edf8f2, #f9fcfa); border: 1px solid #cce1d6; border-radius: 24px; box-shadow: 0 28px 65px rgba(15,49,40,.12); }
.story-capture-visual { display: grid; grid-template-columns: 1fr 25px 1.1fr 25px 1fr; align-items: center; gap: 10px; min-height: 330px; }
.story-capture-visual > div { display: grid; min-height: 155px; align-content: center; justify-items: center; gap: 9px; padding: 20px 12px; background: #fff; border: 1px solid #dbe6e0; border-radius: 15px; text-align: center; }.story-capture-visual > div > .io { width: 29px; height: 29px; color: var(--green-bright); }.story-capture-visual b { font-size: .78rem; }.story-capture-visual small { color: var(--muted); font-size: .58rem; line-height: 1.4; }.story-capture-visual .story-arrow { width: 18px; height: 18px; color: #8aab9d; }.capture-document { box-shadow: 0 15px 34px rgba(15,49,40,.1); }.capture-document i { width: 70%; height: 3px; background: linear-gradient(90deg, transparent, var(--green-bright), transparent); border-radius: 4px; }.capture-ready { color: var(--green); background: #e8f5ee !important; border-color: #b9d9c9 !important; }
.story-control-visual { padding: 0; overflow: hidden; background: #fafcfb; }
.story-control-visual > header { display: flex; align-items: center; justify-content: space-between; padding: 22px 24px; background: #fff; border-bottom: 1px solid var(--line); }.story-control-visual header div { display: grid; gap: 3px; }.story-control-visual header span { font-size: .86rem; font-weight: 800; }.story-control-visual header small { color: var(--muted); font-size: .65rem; }.story-control-visual header em { padding: 5px 9px; color: #8a5b08; background: #fff2d9; border-radius: 999px; font-size: .62rem; font-style: normal; font-weight: 750; }
.control-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 24px; }.control-fields span { display: grid; gap: 5px; padding: 15px; color: var(--muted); background: #fff; border: 1px solid var(--line); border-radius: 10px; font-size: .65rem; }.control-fields b { color: var(--ink); font-size: .78rem; }
.story-control-visual > footer { display: flex; align-items: center; gap: 12px; margin: 0 24px 24px; padding: 15px; color: var(--green); background: var(--green-soft); border: 1px solid var(--sage); border-radius: 11px; }.story-control-visual footer > .io { width: 23px; height: 23px; }.story-control-visual footer div { display: grid; gap: 2px; }.story-control-visual footer b { font-size: .75rem; }.story-control-visual footer small { color: #567469; font-size: .62rem; }
.story-close-visual { padding: 0; overflow: hidden; background: #fff; }.story-close-visual > header { display: flex; align-items: center; justify-content: space-between; padding: 22px 24px; border-bottom: 1px solid var(--line); }.story-close-visual header div { display: grid; gap: 3px; }.story-close-visual header span { font-size: .85rem; font-weight: 800; }.story-close-visual header small { color: var(--muted); font-size: .62rem; }.story-export-action { display: inline-flex; align-items: center; gap: 6px; padding: 8px 10px; color: #fff; background: var(--green); border-radius: 7px; font-size: .62rem !important; font-weight: 750 !important; }.story-export-action .io { width: 12px; height: 12px; }
.close-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 20px 24px 14px; }.close-summary span { display: grid; gap: 6px; padding: 15px; color: var(--muted); background: var(--stone); border-radius: 10px; font-size: .62rem; }.close-summary strong { color: var(--ink); font-size: 1.05rem; }.close-rows { display: grid; gap: 10px; padding: 10px 24px 24px; }.close-rows span { display: grid; grid-template-columns: 7px 1fr auto; align-items: center; gap: 8px; color: var(--muted); font-size: .67rem; }.close-rows i { width: 7px; height: 7px; background: var(--green-bright); border-radius: 50%; }.close-rows span:nth-child(2) i { background: var(--gold); }.close-rows span:nth-child(3) i { background: #7ca998; }.close-rows b { color: var(--ink); }

.why-section { background: linear-gradient(135deg, #0f3128, #174f3d); }
.why-layout { display: grid; grid-template-columns: .8fr 1.2fr; align-items: start; gap: clamp(60px, 9vw, 130px); }
.why-heading { position: static; }.why-heading h2 { color: #fff; font-size: clamp(2.3rem, 3.6vw, 3.55rem); }.why-heading > p:last-child { color: #b6cbc2; line-height: 1.75; }.why-section .section-kicker { color: #9dd3bb !important; }
.why-list { display: grid; gap: 12px; }.why-list article { display: grid; grid-template-columns: 48px 1fr; gap: 18px; align-items: start; padding: 24px; background: rgba(255,255,255,.07); border: 1px solid rgba(201,223,211,.22); border-radius: 15px; }.why-icon { display: grid; width: 42px; height: 42px; place-items: center; align-self: start; margin: 0 auto; background: rgba(223,240,231,.12); border: 1px solid rgba(201,223,211,.22); border-radius: 12px; }.why-icon .io { width: 22px; height: 22px; color: #9dd3bb; }.why-list h3 { margin-bottom: 7px; color: #fff; font-size: 1.03rem; }.why-list p { margin: 0; color: #aec5bb; font-size: .8rem; line-height: 1.65; }

.faq-section { background: linear-gradient(150deg, #f7faf8 0%, #edf7f1 65%, #f5eedf 125%); }
.faq-layout { display: grid; grid-template-columns: .72fr 1.28fr; align-items: start; gap: clamp(55px, 8vw, 110px); }
.faq-heading { position: sticky; top: 120px; }.faq-heading h2 { font-size: clamp(2.3rem, 3.7vw, 3.6rem); }.faq-heading > p:not(.section-kicker) { line-height: 1.75; }.faq-heading > a { display: inline-flex; align-items: center; gap: 8px; margin-top: 10px; color: var(--green-bright); font-size: .8rem; font-weight: 750; }.faq-heading > a .io { width: 13px; height: 13px; }
.faq-list { overflow: hidden; background: rgba(255,255,255,.82); border: 1px solid #cedfd6; border-radius: 18px; box-shadow: 0 20px 50px rgba(15,49,40,.07); }
.faq-item + .faq-item { border-top: 1px solid #dfe8e3; }.faq-item h3 { margin: 0; }.faq-item button { display: grid; width: 100%; grid-template-columns: minmax(0, 1fr) 19px; align-items: center; gap: 18px; padding: 21px 23px; color: var(--ink); background: transparent; border: 0; text-align: left; cursor: pointer; font-size: .9rem; font-weight: 720; }.faq-question-label { min-width: 0; }.faq-item button .io { width: 17px; height: 17px; color: var(--green-bright); transition: transform .2s; }.faq-item button[aria-expanded="true"] { color: var(--green); background: var(--mint); }.faq-item button[aria-expanded="true"] .io { transform: rotate(45deg); }.faq-item > div { padding: 0 55px 21px 23px; color: var(--muted); background: var(--mint); font-size: .8rem; line-height: 1.7; }.faq-item > div[hidden] { display: none; }

.team-section { background: linear-gradient(180deg, #ffffff, #f6faf7); }.split-heading { display: grid; max-width: none; grid-template-columns: 1.1fr .9fr; align-items: end; gap: 80px; }.split-heading h2 { max-width: 600px; margin-bottom: 0; }.split-heading > p { margin: 0 0 7px; line-height: 1.75; }
.team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }.person-card { min-height: 450px; padding: 18px 18px 25px; background: #f4f8f5; border: 1px solid #d4e3db; border-radius: 15px; }.person-photo { width: 100%; height: auto; aspect-ratio: 4 / 3; margin-bottom: 24px; object-fit: cover; object-position: center top; border-radius: 11px; filter: saturate(.88) contrast(1.02); }.person-card > div { padding-inline: 9px; }.person-card h3 { margin-bottom: 10px; font-size: 1.18rem; }.person-card p { margin: 0; font-size: .82rem; line-height: 1.7; }

.final-cta { position: relative; padding-top: 45px; }.cta-card { position: relative; padding: 80px 70px; overflow: hidden; color: white; background: var(--green); border-radius: 22px; text-align: center; }.cta-card h2 { position: relative; max-width: 900px; margin: 0 auto 24px; font-size: clamp(2.25rem, 4.2vw, 4.1rem); }.cta-card p { position: relative; max-width: 650px; margin: 0 auto 32px; color: #bfd0ca; }.cta-actions { position: relative; display: flex; justify-content: center; gap: 10px; }.button-light { color: var(--green); background: white; }.button-light:hover { background: #f5f4ef; }.button-dark-outline { color: white; background: transparent; border-color: #6d9184; }.button-dark-outline:hover { border-color: white; }.cta-decoration { position: absolute; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; }.cta-decoration.one { width: 460px; height: 460px; top: -280px; right: -130px; }.cta-decoration.two { width: 360px; height: 360px; bottom: -260px; left: -80px; }
.cta-card--image { background-color: var(--green); background-image: linear-gradient(rgba(15, 49, 40, .08), rgba(15, 49, 40, .18)), url("assets/corpio-card-background.png"); background-position: center; background-size: cover; }
.cta-card--image .cta-decoration { display: none; }
.anchor-sentinel { position: absolute; top: -90px; }

.site-footer { padding: 64px 0 0; background: #eaf3ee; border-top: 1px solid #cbded4; }.footer-grid { display: grid; grid-template-columns: 2fr repeat(4, 1fr); gap: 50px; padding-bottom: 55px; }.footer-brand p { max-width: 240px; margin-top: 18px; font-size: .8rem; }.footer-column { display: flex; flex-direction: column; gap: 10px; }.footer-column h2 { margin: 5px 0 9px; color: var(--green); font-size: .72rem; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }.footer-column a { width: max-content; color: #526b61; font-size: .75rem; }.footer-column a:hover { color: var(--green-bright); text-decoration: underline; text-underline-offset: 4px; }.social-column .social-icon-link { display: grid; width: 40px; height: 40px; place-items: center; color: var(--green-bright); transition: color .2s, transform .2s; }.social-column .social-icon-link:hover { color: var(--green-dark); text-decoration: none; transform: translateY(-2px) scale(1.06); }.social-column .io { width: 24px; height: 24px; color: currentColor; }.footer-bottom { display: flex; justify-content: space-between; padding-block: 20px; color: #60776d; border-top: 1px solid #cbded4; font-size: .67rem; }

@keyframes dialog-in { from { opacity: 0; transform: translateY(12px) scale(.97); } }

.reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s ease; }.reveal.visible { opacity: 1; transform: none; }.reveal[data-delay="1"] { transition-delay: .1s; }.reveal[data-delay="2"] { transition-delay: .2s; }.reveal[data-delay="3"] { transition-delay: .3s; }.reveal[data-delay="4"] { transition-delay: .4s; }
.benefit-card.reveal.visible:hover { transform: translateY(-5px); box-shadow: inset 0 3px var(--benefit-accent), 0 20px 45px rgba(24, 99, 70, .13); transition-delay: 0s; }

/* Commercial color pass: livelier product storytelling within the corpio palette. */
.audience-section { background: linear-gradient(145deg, #edf8f2 0%, #f9fcfa 48%, #f7eedb 125%); box-shadow: inset 0 1px #d5e9df, inset 0 -1px #e4eadf; }
.audience-panel { box-shadow: 0 16px 42px rgba(15,49,40,.08); }
.audience-panel--employee { background: linear-gradient(145deg, #e4f3eb 0%, #f5faf7 78%); border-color: #bedbc9; box-shadow: inset 0 4px #6eae90, 0 16px 42px rgba(15,49,40,.08); }
.audience-panel--finance { background: linear-gradient(145deg, #edf8f2 0%, #d8ebdf 100%); border-color: #accfbd; box-shadow: inset 0 4px #28785d, 0 16px 42px rgba(15,49,40,.09); }
.audience-panel--accounting { background: linear-gradient(145deg, #fbf3e2 0%, #fffdf8 80%); border-color: #e4d3ab; box-shadow: inset 0 4px #bda468, 0 16px 42px rgba(15,49,40,.08); }
.audience-mobile-ui > b { background: linear-gradient(135deg, #3e8a6b, #153f33); }
.audience-console-ui header b { color: #775d1d; background: #f4dfaa; }
.audience-export-ui footer b { color: #fff; background: #28785d; }

.product-story-section { padding-bottom: 0; overflow: hidden; background: #fff; }
.product-story { --story-band: #f5f9f7; position: relative; margin: 0; overflow: visible; background: var(--story-band); border: 0; border-top: 1px solid #dfe8e3; border-radius: 0; box-shadow: 0 0 0 100vmax var(--story-band); clip-path: inset(0 -100vmax); }
.product-story:first-of-type { border-top: 1px solid #d9e5df; }
.product-story::before { content: none; }
.product-story--capture { --story-band: #f4f8f6; }
.product-story--control { --story-band: #fff; }
.product-story--close { --story-band: #f7f3e9; }
.product-story--control .story-index { color: #735d24; background: #f6e7c0; border-color: #dfc98d; }
.product-story--close .story-index { color: #fff; background: var(--green-medium); border-color: var(--green-medium); }
.product-story--capture .product-story-copy li .io { color: #28785d; }.product-story--control .product-story-copy li .io { color: #a38338; }.product-story--close .product-story-copy li .io { color: #3e8a6b; }
.story-visual { border-color: #bcd9ca; box-shadow: 0 28px 65px rgba(15,49,40,.15); }
.product-story--control .story-visual { border-color: #ddc992; box-shadow: 0 28px 65px rgba(117,88,26,.12); }
.product-story--close .story-visual { border-color: #a9cdb9; }

.why-section { background: linear-gradient(125deg, #0f3128 0%, #176047 54%, #153f33 100%); }
.why-list article { background: rgba(238,248,242,.1); border-color: rgba(201,223,211,.3); box-shadow: inset 4px 0 #3e8a6b; }
.why-list article:nth-child(2) { box-shadow: inset 4px 0 #bda468; }
.why-list article:nth-child(3) { box-shadow: inset 4px 0 #6ab08f; }
.why-list article:nth-child(4) { box-shadow: inset 4px 0 #c9dfd3; }
.why-list article:nth-child(1) .why-icon .io { color: #74c49c; }.why-list article:nth-child(2) .why-icon .io { color: #e2c46f; }.why-list article:nth-child(3) .why-icon .io { color: #86d6ae; }.why-list article:nth-child(4) .why-icon .io { color: #fff; }
.why-list article:nth-child(2) .why-icon { background: rgba(189,164,104,.16); border-color: rgba(226,196,111,.28); }.why-list article:nth-child(4) .why-icon { background: rgba(62,138,107,.35); border-color: rgba(157,211,187,.38); }
.faq-section { background: linear-gradient(145deg, #e3f3ea 0%, #f6fbf8 50%, #f5e8cb 125%); }
.faq-list { border-color: #b9d7c8; box-shadow: 0 24px 60px rgba(15,49,40,.12); }
.faq-item button:hover { color: var(--green); background: #f0f9f4; }
.faq-item button[aria-expanded="true"] { background: #dff0e7; }
.faq-item:nth-child(3n + 2) button .io { color: #a38338; }.faq-item:nth-child(3n) button .io { color: #3e8a6b; }
.team-section { background: linear-gradient(180deg, #fff 0%, #eef8f2 100%); }
.person-card { background: rgba(255,255,255,.88); border-color: #bdd8ca; box-shadow: inset 0 4px var(--green-medium), 0 14px 35px rgba(15,49,40,.06); }
.person-card:nth-child(2) { box-shadow: inset 0 4px var(--gold), 0 14px 35px rgba(15,49,40,.06); }
.person-card:nth-child(3) { box-shadow: inset 0 4px #6ea88e, 0 14px 35px rgba(15,49,40,.06); }

/* Desktop density pass: the same hierarchy with more content visible per viewport. */
.ecosystem-copy h2 { font-size: clamp(2.2rem, 3.2vw, 3.3rem); }
.integration-logo { min-height: 80px; padding: 12px 10px; }
.step-card { min-height: 228px; padding: 22px 18px 20px; }
.icon-box { margin-bottom: 27px; }
.benefit-card { min-height: 252px; padding: 24px 22px; }
.benefit-icon { margin-bottom: 36px; }
.connections-section { padding-block: 68px; }
.connections-heading { max-width: 720px; margin-bottom: 28px; }
.connections-heading h2 { font-size: clamp(1.9rem, 2.65vw, 2.55rem); }
.connections-heading > p:last-child { max-width: 620px; font-size: .86rem; line-height: 1.58; }
.connections-layout { gap: 42px; }
.connection-map { min-height: 390px; }
.connection-orbit--outer { width: 320px; height: 320px; }
.connection-orbit--inner { width: 218px; height: 218px; }
.connection-hub { width: 108px; height: 108px; padding: 16px; }
.connection-hub img { width: 46px; height: 46px; }
.connection-hub .corpio-word { font-size: .7rem; }
.connection-node--accounting { left: 0; min-width: 172px; }
.connection-cards { gap: 10px; }
.connection-card { grid-template-columns: 44px 1fr; gap: 14px; padding: 17px 18px; border-radius: 15px; }
.connection-card-icon { width: 42px; height: 42px; border-radius: 11px; }
.connection-card-icon .io { width: 21px; height: 21px; }
.connection-card h3 { margin: 4px 0 5px; font-size: .94rem; }
.connection-card p { font-size: .7rem; line-height: 1.55; }
.connections-note { margin-top: 22px; }
.audience-panel { min-height: 430px; gap: 22px; padding: 24px; border-radius: 20px; }
.product-story { min-height: 440px; gap: clamp(44px, 6vw, 82px); margin: 0; padding: 78px 0; border-radius: 0; }
.product-story-copy h3 { margin-bottom: 16px; font-size: clamp(1.9rem, 2.75vw, 2.85rem); }
.story-visual { padding: 28px; border-radius: 22px; }
.faq-heading { top: 104px; }
.why-heading h2 { font-size: clamp(2.15rem, 3.3vw, 3.2rem); }
.faq-heading h2 { font-size: clamp(2.15rem, 3.35vw, 3.25rem); }
.why-heading > p:last-child, .faq-heading > p:not(.section-kicker) { line-height: 1.7; }
.person-card { min-height: 410px; padding: 16px 16px 22px; }
.person-photo { margin-bottom: 20px; }
.person-card h3 { margin-bottom: 9px; font-size: 1.12rem; }
.person-card p { font-size: .79rem; line-height: 1.65; }
.split-heading { gap: 60px; }
.final-cta { padding-top: 36px; }
.cta-card { padding: 64px 58px; }
.cta-card h2 { max-width: 840px; margin-bottom: 20px; font-size: clamp(2.1rem, 3.75vw, 3.6rem); }
.cta-card p { max-width: 620px; margin-bottom: 28px; }
.site-footer { padding-top: 54px; }
.footer-grid { gap: 44px; padding-bottom: 46px; }
.footer-brand p { margin-top: 16px; font-size: .78rem; }
.footer-column { gap: 9px; }
.footer-column h2 { margin-bottom: 8px; font-size: .7rem; }
.footer-column a { font-size: .73rem; }
.footer-bottom { padding-block: 18px; }

@media (max-width: 1100px) {
  .main-nav { gap: 18px; }.main-nav a { font-size: .8rem; }.header-actions .text-action { display: none; }.header-actions { margin-left: 0; }
  .hero-grid { grid-template-columns: 1fr 1fr; gap: 35px; }
  .steps { grid-template-columns: repeat(5, minmax(180px, 1fr)); overflow-x: auto; padding-bottom: 18px; scroll-snap-type: x mandatory; }.step-card { scroll-snap-align: start; }
  .connections-layout { gap: 36px; }.connection-node { min-width: 170px; }
  .audience-panels { grid-template-columns: 1fr 1fr; }.audience-panel--finance { transform: none; }.audience-panel--accounting { grid-column: 1 / -1; min-height: 380px; grid-template-columns: 1fr 1fr; }.audience-panel--accounting .audience-export-ui { width: 100%; align-self: center; }
  .product-story { gap: 45px; }
  .ecosystem-layout { gap: 42px; }.integration-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .section { padding-block: 90px; }.site-header { height: 70px; }.header-inner { justify-content: space-between; }.menu-toggle { display: grid; order: 3; }.header-actions { margin-left: auto; }.main-nav { position: fixed; inset: 70px 0 auto; display: flex; height: calc(100dvh - 70px); flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; padding: 28px 24px; background: white; border-top: 1px solid var(--line); transform: translateX(100%); transition: transform .25s ease; }.main-nav.open { transform: none; }.main-nav a { padding: 17px 4px; border-bottom: 1px solid var(--line); font-size: 1.05rem; }
  .hero { padding-top: 75px; }.hero-grid { grid-template-columns: 1fr; }.hero-copy { max-width: 730px; }.hero h1 em { display: inline; }
  .connections-layout { grid-template-columns: 1fr; }.connection-map { width: min(100%, 720px); margin-inline: auto; }.connection-cards { width: min(100%, 720px); margin-inline: auto; }
  .benefit-grid { grid-template-columns: 1fr 1fr; }.split-heading { grid-template-columns: 1fr; gap: 25px; }.team-grid { grid-template-columns: 1fr; }.person-card { display: grid; min-height: auto; grid-template-columns: 180px 1fr; align-items: center; gap: 28px; }.person-photo { height: 190px; aspect-ratio: auto; margin: 0; }.person-card > div { padding: 0; }
  .audience-panels { grid-template-columns: 1fr; }.audience-panel, .audience-panel--accounting { min-height: auto; grid-column: auto; grid-template-columns: 1fr; }.audience-panel { gap: 26px; }
  .product-story { min-height: 0; grid-template-columns: 1fr; gap: 36px; padding: 64px 0; }.product-story--control .product-story-copy { order: 0; }.product-story-copy { max-width: 650px; }
  .why-layout, .faq-layout { grid-template-columns: 1fr; gap: 42px; }.why-heading, .faq-heading { position: static; max-width: 720px; }
  .ecosystem-layout { grid-template-columns: 1fr; }.ecosystem-copy { max-width: 720px; }
  .footer-grid { grid-template-columns: 2fr repeat(2, 1fr); }.footer-brand { grid-row: span 2; }
}

@media (max-width: 640px) {
  .container { width: min(calc(100% - 32px), var(--container)); }.section { padding-block: 72px; }
  h1 { font-size: clamp(2.35rem, 10.8vw, 3.25rem); overflow-wrap: break-word; }.hero { min-height: auto; padding-top: 60px; padding-bottom: 75px; }.hero h1 em { display: block; }.hero-lead { font-size: 1rem; }.hero-actions { flex-direction: column; }.hero-actions .button { width: 100%; }.hero-points { display: grid; }
  .header-actions .button { display: none; }.header-inner { gap: 12px; }
  .ecosystem-capabilities { display: grid; grid-template-columns: 1fr 1fr; }.ecosystem-capabilities > span { min-width: 0; }.integration-showcase { padding: 17px; border-radius: 20px; }.integration-showcase-head { align-items: flex-start; flex-direction: column; gap: 3px; }.integration-logo { min-height: 76px; padding: 11px 8px; }.integration-logo img { width: 96px; height: 42px; }.integration-logo--mark img { width: 48px; }
  .section-heading { margin-bottom: 40px; }.section-heading h2 { font-size: 2.2rem; }
  .steps { --step-gap: 54px; width: auto; grid-template-columns: 1fr; gap: var(--step-gap); overflow: visible; padding-bottom: 0; scroll-snap-type: none; }.step-card { min-height: 220px; }.step-card:not(:last-child)::after { top: auto; right: 50%; bottom: calc(var(--step-gap) / -2 - 12px); -webkit-mask: url("assets/icons/arrow-down.svg") center / contain no-repeat; mask: url("assets/icons/arrow-down.svg") center / contain no-repeat; transform: translateX(50%); }
  .connections-heading { margin-bottom: 34px; }.connections-heading h2 { font-size: 2.35rem; }.connection-map { min-height: 430px; }.connection-orbit--outer { width: 290px; height: 290px; }.connection-orbit--inner { width: 195px; height: 195px; }.connection-hub { width: 96px; height: 96px; padding: 14px; }.connection-hub img { width: 42px; height: 42px; }.connection-hub .corpio-word { font-size: .66rem; }.connection-node { min-width: 145px; gap: 8px; padding: 10px; border-radius: 13px; }.connection-node-icon { width: 31px; height: 31px; flex-basis: 31px; border-radius: 9px; }.connection-node-icon .io { width: 17px; height: 17px; }.connection-node strong { font-size: .67rem; }.connection-node small { font-size: .5rem; }.connection-node--accounting { left: 0; }.connection-node--ai, .connection-node--alerts { right: 0; }.connection-card { grid-template-columns: 43px 1fr; gap: 13px; padding: 18px; }.connection-card-icon { width: 42px; height: 42px; }.connection-card h3 { font-size: .93rem; }.connections-note { margin-top: 28px; }
  .benefit-grid { grid-template-columns: 1fr; }.benefit-card { min-height: 240px; }.benefit-icon { margin-bottom: 35px; }
  .audience-section { padding-top: 78px; }.audience-panel { padding: 24px; border-radius: 17px; }.audience-copy h3 { font-size: 1.55rem; }
  .product-story { padding: 48px 0; border-radius: 0; }.product-story-copy h3 { font-size: 2rem; }.story-visual { padding: 18px; border-radius: 17px; }.story-capture-visual { grid-template-columns: 1fr; gap: 8px; }.story-capture-visual > div { min-height: 110px; }.story-capture-visual .story-arrow { transform: rotate(90deg); }.control-fields, .close-summary { grid-template-columns: 1fr; }.story-control-visual, .story-close-visual { padding: 0; }
  .why-list article { grid-template-columns: 38px 1fr; gap: 12px; padding: 19px; }.faq-item button { padding: 18px; font-size: .82rem; }.faq-item > div { padding: 0 45px 18px 18px; font-size: .76rem; }
  .person-card { display: block; }.person-photo { height: auto; aspect-ratio: 4 / 3; margin-bottom: 23px; }
  .cta-card { width: calc(100% - 24px); padding: 60px 24px; }.cta-card h2 br { display: none; }.cta-actions { flex-direction: column; }.cta-actions .button { width: 100%; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 35px 25px; }.footer-brand { grid-column: 1 / -1; grid-row: auto; }.footer-bottom { flex-direction: column; gap: 6px; }
}

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