:root {
  --landing-navy: #07162e;
  --landing-navy-2: #0d2143;
  --landing-ink: #0b1a34;
  --landing-canvas: #f4f7fc;
  --landing-cloud: #eaf0fa;
  --landing-blue: #3672ff;
  --landing-mint: #44d6cb;
  --landing-violet: #8762e7;
  --landing-yellow: #ffcb4e;
  --landing-muted: #61708a;
  --landing-line: rgba(11, 26, 52, 0.12);
  --landing-heading: "Avenir Next", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --landing-body: "Avenir Next", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body, html { margin: 0; min-height: 100%; }
body { background: var(--landing-canvas); color: var(--landing-ink); font-family: var(--landing-body); }
a { color: inherit; }

.landing-skip-link { background: #fff; border-radius: 8px; color: var(--landing-navy); font-weight: 800; left: 20px; padding: 12px 16px; position: absolute; text-decoration: none; top: -60px; z-index: 50; }
.landing-skip-link:focus { top: 20px; }
.landing-page-shell { overflow: clip; }

.landing-header { left: 0; padding: 22px clamp(20px, 5.2vw, 90px); position: absolute; right: 0; top: 0; z-index: 20; }
.landing-header__bar { align-items: center; display: grid; gap: 28px; grid-template-columns: minmax(160px, 1fr) auto minmax(160px, 1fr); margin: 0 auto; max-width: 1440px; }
.landing-brand { display: inline-flex; justify-self: start; }
.landing-brand__logo { display: block; height: auto; max-width: 205px; width: min(20vw, 205px); }
.landing-nav { display: flex; gap: 28px; }
.landing-nav__link { color: rgba(238, 245, 255, 0.76); font-size: 0.86rem; font-weight: 700; letter-spacing: 0.01em; text-decoration: none; transition: color 180ms ease; }
.landing-nav__link:hover, .landing-nav__link:focus-visible { color: #fff; }
.landing-header__cta { align-items: center; background: #fff; border-radius: 999px; color: var(--landing-navy); display: inline-flex; font-size: 0.87rem; font-weight: 800; gap: 8px; justify-self: end; padding: 12px 17px; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease; }
.landing-header__cta:hover, .landing-header__cta:focus-visible { box-shadow: 0 10px 28px rgba(0, 0, 0, 0.26); transform: translateY(-2px); }
.landing-arrow { font-size: 1.05rem; line-height: 1; }

.landing-main { display: grid; }
.landing-hero { background: radial-gradient(circle at 72% 52%, rgba(56, 123, 255, 0.32), transparent 28%), radial-gradient(circle at 26% 100%, rgba(66, 210, 196, 0.12), transparent 30%), var(--landing-navy); color: #fff; display: grid; gap: clamp(30px, 5vw, 90px); grid-template-columns: minmax(0, 0.9fr) minmax(480px, 1.1fr); min-height: min(850px, 100svh); overflow: hidden; padding: clamp(148px, 17vh, 210px) clamp(20px, 8vw, 136px) clamp(70px, 9vw, 130px); position: relative; }
.landing-hero::before { background-image: linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px); background-size: 56px 56px; content: ""; inset: 0; mask-image: linear-gradient(90deg, #000, transparent 65%); opacity: .38; pointer-events: none; position: absolute; }
.landing-hero__copy, .landing-hero__visual { position: relative; z-index: 1; }
.landing-hero__copy { align-self: center; max-width: 680px; }
.landing-kicker, .landing-section__eyebrow, .landing-role-block__eyebrow, .landing-closing__eyebrow { font-size: .72rem; font-weight: 800; letter-spacing: .15em; margin: 0 0 20px; text-transform: uppercase; }
.landing-kicker { align-items: center; color: var(--landing-mint); display: flex; gap: 9px; }
.landing-kicker span { background: currentColor; border-radius: 50%; height: 7px; width: 7px; }
.landing-hero__headline { font-family: var(--landing-heading); font-size: clamp(3.6rem, 6.6vw, 7rem); font-weight: 750; letter-spacing: -.075em; line-height: .89; margin: 0; }
.landing-hero__headline em { color: var(--landing-mint); font-style: normal; }
.landing-hero__lead { color: rgba(238,245,255,.76); font-size: clamp(1rem, 1.4vw, 1.19rem); line-height: 1.65; margin: 30px 0 0; max-width: 35rem; }
.landing-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.landing-button { align-items: center; border-radius: 999px; display: inline-flex; font-size: .94rem; font-weight: 800; gap: 9px; justify-content: center; padding: 15px 20px; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease; }
.landing-button:hover, .landing-button:focus-visible { transform: translateY(-2px); }
.landing-button--primary { background: var(--landing-mint); box-shadow: 0 13px 30px rgba(21, 203, 190, .2); color: var(--landing-navy); }
.landing-button--primary:hover, .landing-button--primary:focus-visible { box-shadow: 0 18px 38px rgba(21, 203, 190, .33); }
.landing-button--quiet { border: 1px solid rgba(255,255,255,.24); color: #fff; }
.landing-button--quiet:hover, .landing-button--quiet:focus-visible { background: rgba(255,255,255,.1); }
.landing-trust-line { color: rgba(238,245,255,.6); display: flex; flex-wrap: wrap; font-size: .78rem; gap: 20px; margin-top: 50px; }
.landing-trust-line span { align-items: baseline; display: inline-flex; gap: 5px; }
.landing-trust-line b { color: #fff; font-size: 1rem; }

.landing-hero__visual { align-self: center; aspect-ratio: 1.12 / 1; margin: 0 auto; max-width: 650px; min-width: 0; width: 100%; }
.landing-orbit { border: 1px solid rgba(255,255,255,.2); border-radius: 50%; left: 50%; pointer-events: none; position: absolute; top: 50%; transform: translate(-50%, -50%); }
.landing-orbit--outer { height: 88%; width: 88%; }
.landing-orbit--inner { border-color: rgba(68,214,203,.35); height: 60%; width: 60%; }
.landing-platform-core { align-items: center; background: linear-gradient(145deg, #183a70, #0b1b39); border: 1px solid rgba(255,255,255,.19); border-radius: 28px; box-shadow: 0 26px 70px rgba(0,0,0,.3); display: grid; justify-items: center; left: 50%; padding: 20px; position: absolute; top: 50%; transform: translate(-50%, -50%); z-index: 3; }
.landing-platform-core img { height: 76px; width: 76px; }
.landing-platform-core span { font-size: .83rem; font-weight: 800; margin-top: 10px; }
.landing-platform-core small { color: rgba(255,255,255,.58); font-size: .67rem; margin-top: 3px; }
.landing-hero__app-node { align-items: center; background: rgba(8,25,52,.86); border: 1px solid rgba(255,255,255,.17); border-radius: 15px; box-shadow: 0 16px 30px rgba(0,0,0,.24); display: flex; font-size: .72rem; font-weight: 700; gap: 8px; padding: 8px 11px 8px 8px; position: absolute; z-index: 4; }
.landing-hero__app-node img { height: 35px; width: 35px; }
.landing-hero__app-node--res { left: 2%; top: 24%; }
.landing-hero__app-node--shift { left: 31%; top: 3%; }
.landing-hero__app-node--clock { right: 5%; top: 12%; }
.landing-hero__app-node--workforce { right: -1%; top: 38%; }
.landing-hero__app-node--onboarding { bottom: 18%; right: 1%; }
.landing-hero__app-node--tasks { bottom: 22%; left: 1%; }
.landing-hero__app-node--stock { bottom: 3%; left: 31%; }
.landing-hero__image-frame { border: 7px solid rgba(255,255,255,.93); border-radius: 21px; bottom: 1%; box-shadow: 0 28px 60px rgba(0,0,0,.26); overflow: hidden; position: absolute; right: 1%; transform: rotate(5deg); width: 28%; z-index: 2; }
.landing-hero__image { display: block; height: auto; width: 100%; }
.landing-floating-card { align-items: center; background: #fff; border-radius: 13px; bottom: 9%; box-shadow: 0 16px 35px rgba(0,0,0,.25); color: var(--landing-navy); display: flex; gap: 9px; left: 3%; padding: 11px 14px; position: absolute; z-index: 4; }
.landing-floating-card small { color: var(--landing-muted); display: block; font-size: .65rem; font-weight: 700; text-transform: uppercase; }.landing-floating-card strong { display: block; font-size: .78rem; margin-top: 2px; }.landing-floating-card__dot { background: #49d99a; border-radius: 50%; box-shadow: 0 0 0 4px rgba(73,217,154,.16); height: 8px; width: 8px; }

.landing-intro { background: #fff; display: grid; gap: 22px; grid-template-columns: minmax(180px,.45fr) minmax(320px,1fr) auto; padding: clamp(38px,6vw,88px) clamp(20px,8vw,136px); }.landing-intro__label { color: var(--landing-blue); font-size: .84rem; font-weight: 800; line-height: 1.3; margin: 7px 0 0; max-width: 12ch; text-transform: uppercase; }.landing-intro__statement { font-size: clamp(1.7rem,3.1vw,3rem); font-weight: 700; letter-spacing: -.055em; line-height: 1.1; margin: 0; max-width: 24ch; }.landing-inline-link { align-self: end; color: var(--landing-navy); font-size: .87rem; font-weight: 800; text-decoration: none; white-space: nowrap; }.landing-inline-link span { color: var(--landing-blue); font-size: 1.1rem; margin-left: 5px; }

.landing-section { padding: clamp(72px,9vw,135px) clamp(20px,8vw,136px); }.landing-portfolio { background: var(--landing-canvas); }.landing-section__head { display: grid; gap: 24px; grid-template-columns: minmax(250px,.94fr) minmax(250px,.78fr); margin-bottom: 60px; }.landing-section__eyebrow { color: var(--landing-blue); grid-column: 1 / -1; margin: 0; }.landing-section__title, .landing-flow__title, .landing-closing__title { font-size: clamp(2.5rem,5vw,5rem); font-weight: 750; letter-spacing: -.07em; line-height: .93; margin: 0; }.landing-section__copy { color: var(--landing-muted); font-size: 1rem; line-height: 1.7; margin: 6px 0 0; max-width: 31rem; }
.landing-app-list { border-top: 1px solid var(--landing-line); }.landing-app-band { align-items: center; border-bottom: 1px solid var(--landing-line); display: grid; gap: 20px; grid-template-columns: 84px minmax(185px,.73fr) minmax(240px,1fr) auto; padding: 26px 4px; transition: background 180ms ease, padding 180ms ease; }.landing-app-band:hover { background: rgba(255,255,255,.72); padding-left: 14px; padding-right: 14px; }.landing-app-band__icon { border-radius: 20px; height: 64px; overflow: hidden; width: 64px; }.landing-app-band__icon img { display: block; height: 100%; width: 100%; }.landing-app-band__meta { display: grid; gap: 9px; }.landing-app-band__status { background: rgba(63,210,157,.14); border-radius: 999px; color: #16845c; font-size: .62rem; font-weight: 800; letter-spacing: .1em; padding: 6px 9px; text-transform: uppercase; width: fit-content; }.landing-app-band__status--future { background: rgba(54,114,255,.1); color: #496dbf; }.landing-app-band__title { font-size: clamp(1.35rem,2vw,1.8rem); font-weight: 750; letter-spacing: -.045em; margin: 0; }.landing-app-band__description { color: var(--landing-muted); font-size: .93rem; line-height: 1.55; margin: 0; }.landing-app-band__link { color: var(--landing-navy); font-size: .78rem; font-weight: 800; text-decoration: none; white-space: nowrap; }.landing-app-band__link span { color: var(--landing-blue); font-size: 1rem; }.landing-app-band__link--muted { color: #98a4b6; }

.landing-roles { background: #fff; }.landing-role-grid { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }.landing-role-block { background: var(--landing-navy); border-radius: 20px; color: #fff; min-height: 310px; overflow: hidden; padding: 27px; position: relative; }.landing-role-block::after { border: 1px solid rgba(255,255,255,.12); border-radius: 50%; content: ""; height: 220px; position: absolute; right: -86px; top: -88px; width: 220px; }.landing-role-block--management { background: #3c61d5; }.landing-role-block--team { background: #347e91; }.landing-role-block__index { color: rgba(255,255,255,.48); font-size: .78rem; font-weight: 800; margin: 0 0 50px; position: relative; z-index: 1; }.landing-role-block__eyebrow { color: rgba(255,255,255,.62); font-size: .66rem; margin-bottom: 13px; position: relative; z-index: 1; }.landing-role-block__title { font-size: clamp(1.65rem,2.3vw,2.3rem); font-weight: 750; letter-spacing: -.06em; line-height: .98; margin: 0; max-width: 10ch; position: relative; z-index: 1; }.landing-role-block__copy { color: rgba(255,255,255,.74); font-size: .89rem; line-height: 1.57; margin: 18px 0 0; max-width: 28ch; position: relative; z-index: 1; }

.landing-flow { background: var(--landing-navy); color: #fff; display: grid; gap: 40px; grid-template-columns: minmax(240px,.76fr) minmax(400px,1.24fr); padding: clamp(72px,9vw,135px) clamp(20px,8vw,136px); }.landing-flow .landing-section__eyebrow { color: var(--landing-mint); }.landing-flow__title { max-width: 8ch; }.landing-flow-list { display: grid; gap: 0; list-style: none; margin: 0; padding: 0; }.landing-flow-list li { align-items: baseline; border-top: 1px solid rgba(255,255,255,.18); display: grid; gap: 16px; grid-template-columns: 42px 120px 1fr; padding: 21px 0; }.landing-flow-list li:last-child { border-bottom: 1px solid rgba(255,255,255,.18); }.landing-flow-list span { color: var(--landing-mint); font-size: .76rem; font-weight: 800; }.landing-flow-list strong { font-size: 1rem; }.landing-flow-list p { color: rgba(255,255,255,.65); font-size: .88rem; line-height: 1.45; margin: 0; }

.landing-closing { align-items: end; background: linear-gradient(130deg, #4c7bf2, #4962ce); color: #fff; display: grid; gap: 30px; grid-template-columns: minmax(0,1fr) auto; padding: clamp(56px,7vw,100px) clamp(20px,8vw,136px); position: relative; }.landing-closing::after { border: 1px solid rgba(255,255,255,.16); border-radius: 50%; content: ""; height: 500px; position: absolute; right: -140px; top: -295px; width: 500px; }.landing-closing > * { position: relative; z-index: 1; }.landing-closing__eyebrow { color: rgba(255,255,255,.72); }.landing-closing__title { max-width: 15ch; }.landing-button--light { background: #fff; color: var(--landing-navy); white-space: nowrap; }.landing-footer { align-items: center; background: var(--landing-navy); color: rgba(255,255,255,.58); display: grid; gap: 22px; grid-template-columns: 1fr auto 1fr; padding: 28px clamp(20px,8vw,136px); }.landing-footer__logo { max-width: 154px; width: 100%; }.landing-footer__links { display: flex; gap: 20px; }.landing-footer__links a { color: rgba(255,255,255,.75); font-size: .76rem; font-weight: 700; text-decoration: none; }.landing-footer p { font-size: .73rem; justify-self: end; margin: 0; }

[data-reveal] { opacity: 0; transform: translateY(22px); transition: opacity 580ms ease, transform 580ms ease; } [data-reveal].is-visible { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } [data-reveal] { opacity: 1; transform: none; transition: none; } }
@media (max-width: 1000px) { .landing-hero { grid-template-columns: 1fr; padding-top: 145px; }.landing-hero__copy { max-width: 740px; }.landing-hero__visual { max-width: 600px; }.landing-intro { grid-template-columns: .4fr 1fr; }.landing-intro .landing-inline-link { grid-column: 2; justify-self: start; }.landing-app-band { grid-template-columns: 74px minmax(170px,.7fr) minmax(180px,1fr); }.landing-app-band__link { grid-column: 2 / -1; }.landing-flow { grid-template-columns: 1fr; }.landing-flow__title { max-width: 12ch; } }
@media (max-width: 720px) { .landing-header { padding: 18px 18px; }.landing-header__bar { grid-template-columns: 1fr auto; }.landing-brand__logo { min-width: 144px; width: 160px; }.landing-nav { display: none; }.landing-header__cta { padding: 10px 13px; }.landing-header__cta span:first-child { display: none; }.landing-hero { min-height: 0; padding: 122px 20px 55px; }.landing-hero__headline { font-size: clamp(3.25rem,15vw,4.5rem); }.landing-hero__lead { margin-top: 22px; }.landing-trust-line { gap: 13px; margin-top: 36px; }.landing-hero__visual { margin-top: 6px; width: min(100%, 460px); }.landing-hero__app-node { font-size: .61rem; padding: 6px 8px 6px 6px; }.landing-hero__app-node img { height: 27px; width: 27px; }.landing-platform-core { border-radius: 20px; padding: 13px; }.landing-platform-core img { height: 58px; width: 58px; }.landing-platform-core span { font-size: .67rem; margin-top: 6px; }.landing-platform-core small { font-size: .57rem; }.landing-floating-card { bottom: 2%; left: 0; }.landing-intro, .landing-section, .landing-flow, .landing-closing { padding-left: 20px; padding-right: 20px; }.landing-intro { display: block; }.landing-intro__label { max-width: none; }.landing-intro__statement { margin: 24px 0; }.landing-section__head { display: block; margin-bottom: 42px; }.landing-section__eyebrow { margin-bottom: 19px; }.landing-section__copy { margin-top: 24px; }.landing-app-band { align-items: start; grid-template-columns: 64px minmax(0,1fr); padding: 22px 0; }.landing-app-band__icon { height: 53px; width: 53px; }.landing-app-band__description, .landing-app-band__link { grid-column: 2; }.landing-app-band:hover { padding-left: 0; padding-right: 0; }.landing-role-grid { grid-template-columns: 1fr; }.landing-role-block { min-height: 260px; }.landing-flow-list li { grid-template-columns: 35px 1fr; }.landing-flow-list p { grid-column: 2; }.landing-closing { grid-template-columns: 1fr; }.landing-footer { grid-template-columns: 1fr; padding: 28px 20px; }.landing-footer__links { order: 3; }.landing-footer p { justify-self: start; order: 2; } }
