:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-42aa508 *//* ==================== GLOBAL VARIABLES & BASE ==================== */
:root {
  --g:#078F00;
  --gl:#69e260;
  --gd:#045f00;
  --navy:#082234;
  --navy2:#0f3447;
  --ink:#0d2638;
  --muted:#637483;
  --line:#dce7ec;
  --soft:#f5faf5;
  --white:#fff;
  --shadow:0 25px 70px rgba(8,34,52,.12)
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth
}

body {
  margin:0;
  overflow-x:hidden;
  color:var(--ink);
  background:#fff;
  font-family:"Poppins",Arial,sans-serif
}

a {
  text-decoration:none;
  color:inherit
}

img {
  display:block;
  max-width:100%
}

.wrap {
  width:min(1180px,calc(100% - 40px));
  margin:auto
}

.section {
  padding:96px 0
}

.eyebrow {
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:var(--g);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase
}

.eyebrow:before {
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--g);
  box-shadow:0 0 0 5px rgba(7,143,0,.1)
}

h1,
h2 {
  font-weight:700;
  line-height:1.1;
  letter-spacing:-.055em
}

h3 {
  font-weight:700;
  line-height:1.1
}

h1,
h2,
h3,
p {
  margin-top:0
}

h2 {
  margin:17px 0 18px;
  font-size:clamp(2.25rem,4.6vw,4rem);
  line-height:1.1;
  font-weight:700
}

p {
  color:var(--muted);
  line-height:1.75
}

.green {
  color:var(--g)
}

.head {
  max-width:790px
}

.head.center {
  text-align:center;
  margin:0 auto 50px
}

.head.center p {
  max-width:670px;
  margin-left:auto;
  margin-right:auto
}

/* ==================== COMPONENT: BUTTONS ==================== */
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:56px;
  padding:0 23px;
  border-radius:16px;
  font-size:.86rem;
  font-weight:800;
  transition:.25s
}

.btn-primary {
  color:#fff;
  background:linear-gradient(145deg,#48d83e 0%,#18b814 38%,#067c00 72%,#034f00 100%);
  border:1px solid rgba(255,255,255,.28);
  box-shadow:inset 4px 4px 9px rgba(255,255,255,.42),inset -5px -6px 11px rgba(0,58,0,.34),0 15px 32px rgba(7,143,0,.28)
}

.btn-primary:hover {
  transform:translateY(-3px);
  box-shadow:inset 4px 4px 9px rgba(255,255,255,.42),inset -5px -6px 11px rgba(0,58,0,.34),0 22px 42px rgba(7,143,0,.36)
}

.btn-white {
  color:var(--ink);
  background:#fff;
  border:1px solid #fff;
  box-shadow:0 14px 30px rgba(0,0,0,.13)
}

.btn-white:hover {
  color:var(--g);
  transform:translateY(-3px)
}

.nav {
  position:absolute;
  z-index:10;
  left:0;
  top:0;
  width:100%;
  height:84px;
  color:#fff
}

.nav-in {
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between
}

.brand {
  display:flex;
  align-items:center;
  gap:10px;
  font-size:1.32rem;
  font-weight:800;
  letter-spacing:-.04em
}

.brand-mark {
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:12px;
  background:linear-gradient(145deg,#67e95d,#078F00 70%);
  box-shadow:inset 2px 2px 5px rgba(255,255,255,.4)
}

.nav-links {
  display:flex;
  align-items:center;
  gap:27px;
  font-size:.76rem;
  font-weight:700
}

.nav .btn {
  min-height:44px;
  padding:0 17px;
  border-radius:13px
}

/* ==================== SECTION: HERO ==================== */
.hero {
    padding-bottom: 20px;
  position:relative;
  display:flex;
  align-items:center;
  min-height:770px;
  color:#fff;
  background:radial-gradient(circle at 82% 25%,rgba(7,143,0,.23),transparent 27%),linear-gradient(135deg,#061b29,#0d3044 62%,#075016)
}

.hero:after {
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 15% 48%,rgba(7,143,0,.2),transparent 29%)
}

.hero-grid {
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:.94fr 1.06fr;
  gap:52px;
  align-items:center;
  padding-top:75px
}

.hero .eyebrow {
  color:#87ef7e
}

.hero .eyebrow:before {
  background:#87ef7e
}

.hero h1 {
  margin:23px 0 25px;
  font-size:clamp(3rem,5.5vw,5.2rem);
  line-height:1.1;
  font-weight:700
}

.hero h1 span {
  color:#72e669
}

.hero-copy>p {
  max-width:630px;
  color:#d4e3e9;
  font-size:1.03rem
}

.hero-actions {
  display:flex;
  gap:13px;
  flex-wrap:wrap;
  margin-top:32px
}

.hero-proof {
  display:flex;
  gap:23px;
  flex-wrap:wrap;
  margin-top:34px
}

.hero-proof span {
  display:flex;
  align-items:center;
  gap:8px;
  color:#edf7fa;
  font-size:.7rem;
  font-weight:700
}

.check {
  display:grid;
  place-items:center;
  width:21px;
  height:21px;
  border-radius:50%;
  color:#fff;
  background:var(--g);
  font-size:.64rem
}

.video-shell {
  position:relative;
  padding:11px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:30px;
  background:rgba(255,255,255,.075);
  box-shadow:0 34px 85px rgba(0,0,0,.28);
  backdrop-filter:blur(10px)
}

.video-placeholder {
  position:relative;
  display:grid;
  place-items:center;
  aspect-ratio:16/10;
  overflow:hidden;
  border-radius:21px;
  background:linear-gradient(145deg,#0d3145,#071d2c)
}

.video-placeholder:before {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:32px 32px
}

.video-orbit {
  position:absolute;
  width:300px;
  height:300px;
  border:1px solid rgba(103,228,94,.24);
  border-radius:50%;
  animation:spin 18s linear infinite
}

.video-orbit:after {
  content:"";
  position:absolute;
  top:28px;
  right:22px;
  width:12px;
  height:12px;
  border-radius:50%;
  background:#65e05c;
  box-shadow:0 0 25px #65e05c
}

.video-play {
  position:relative;
  z-index:2;
  display:grid;
  place-items:center;
  width:84px;
  height:84px;
  border:1px solid rgba(255,255,255,.45);
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,#4ee143,#078F00 70%);
  box-shadow:inset 3px 3px 7px rgba(255,255,255,.38),0 20px 45px rgba(7,143,0,.35);
  font-size:1.45rem
}

.video-caption {
  position:absolute;
  z-index:2;
  left:22px;
  bottom:20px
}

.video-caption strong,.video-caption span {
  display:block
}

.video-caption strong {
  font-size:.82rem
}

.video-caption span {
  margin-top:4px;
  color:#bcd0da;
  font-size:.62rem
}

.video-badge {
  position:absolute;
  z-index:2;
  right:18px;
  top:18px;
  padding:8px 11px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  color:#bdebb9;
  background:rgba(7,143,0,.18);
  font-size:.58rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em
}

@keyframes spin {
  to {
    transform:rotate(360deg)
  }

}

/* ==================== SECTION: ASSURANCE STRIP ==================== */
.assurance {
  border-bottom:1px solid var(--line);
  background:#fff
}

.assurance-in {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  padding:19px 0
}

.assurance-item {
  display:flex;
  gap:11px;
  align-items:center;
  padding:12px 20px;
  border-right:1px solid var(--line)
}

.assurance-item:last-child {
  border-right:0
}

.assurance-icon {
  display:grid;
  flex:0 0 40px;
  height:40px;
  place-items:center;
  border-radius:12px;
  color:#fff;
  background:linear-gradient(145deg,#5de053,#078F00)
}

.assurance-item strong,.assurance-item span {
  display:block
}

.assurance-item strong {
  font-size:.72rem
}

.assurance-item span {
  margin-top:2px;
  color:var(--muted);
  font-size:.56rem
}

/* ==================== SECTION: PAYROLL COVERAGE ==================== */
.coverage {
  background:linear-gradient(180deg,#fff,#f6faf6)
}

.coverage-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:15px
}

.coverage-card {
  position:relative;
  overflow:hidden;
  min-height:270px;
  padding:25px;
  border:1px solid #d7e6db;
  border-radius:22px;
  background:linear-gradient(155deg,#fff,#f2faf1);
  box-shadow:0 14px 35px rgba(8,34,52,.06);
  transition:.3s
}

.coverage-card:before {
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg,#64e25a,#078F00);
  transform:scaleX(.2);
  transform-origin:left;
  transition:.3s
}

.coverage-card:hover {
  transform:translateY(-7px);
  border-color:rgba(7,143,0,.45);
  box-shadow:0 24px 48px rgba(7,143,0,.11)
}

.coverage-card:hover:before {
  transform:scaleX(1)
}

.coverage-icon {
  display:grid;
  width:51px;
  height:51px;
  place-items:center;
  border-radius:15px;
  color:#fff;
  background:linear-gradient(145deg,#5ee054,#078F00);
  box-shadow:inset 2px 2px 5px rgba(255,255,255,.38),0 12px 26px rgba(7,143,0,.2);
  font-size:1.05rem
}

.coverage-card h3 {
  margin:20px 0 8px;
  color:#0b3044;
  font-size:.98rem
}

.coverage-card p {
  font-size:.69rem;
  line-height:1.6
}

.coverage-card small {
  position:absolute;
  left:25px;
  bottom:21px;
  color:var(--g);
  font-size:.55rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.09em
}

/* ==================== SECTION: PAYROLL COMMAND VIEW ==================== */
.command {
  color:#fff;
  background:linear-gradient(135deg,var(--navy),var(--navy2) 60%,#075016)
}

.command-layout {
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:50px;
  align-items:center
}

.command-copy .eyebrow {
  color:#88ef7f
}

.command-copy .eyebrow:before {
  background:#88ef7f
}

.command-copy p {
  color:#c6d7de
}

.pay-frequency {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:22px
}

.pay-frequency span {
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:99px;
  color:#d8e7ec;
  background:rgba(255,255,255,.06);
  font-size:.56rem;
  font-weight:800
}

.pay-screen {
  padding:19px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:27px;
  color:var(--ink);
  background:#f7faf8;
  box-shadow:0 30px 80px rgba(0,0,0,.28)
}

.pay-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-bottom:14px;
  border-bottom:1px solid var(--line)
}

.pay-top strong {
  font-size:.75rem
}

.pay-status {
  display:flex;
  align-items:center;
  gap:6px;
  color:var(--g);
  font-size:.53rem;
  font-weight:800
}

.pay-status i {
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--g);
  box-shadow:0 0 0 0 rgba(7,143,0,.35);
  animation:pulse 2s infinite
}

.pay-summary {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:9px;
  margin:13px 0
}

.pay-kpi {
  padding:13px;
  border:1px solid #dfeae3;
  border-radius:14px;
  background:#fff
}

.pay-kpi small,.pay-kpi strong,.pay-kpi em {
  display:block
}

.pay-kpi small {
  color:#74848e;
  font-size:.5rem;
  font-weight:800;
  text-transform:uppercase
}

.pay-kpi strong {
  margin-top:7px;
  font-size:1.08rem
}

.pay-kpi em {
  margin-top:3px;
  color:var(--g);
  font-size:.51rem;
  font-style:normal;
  font-weight:800
}

.employee-list {
  padding:14px;
  border:1px solid #dfeae3;
  border-radius:16px;
  background:#fff
}

.employee-head,.employee {
  display:grid;
  grid-template-columns:1.1fr .65fr .55fr;
  gap:8px;
  align-items:center
}

.employee-head {
  padding-bottom:8px;
  color:#778791;
  font-size:.49rem;
  font-weight:800;
  text-transform:uppercase
}

.employee {
  padding:10px 0;
  border-top:1px solid #edf1ee;
  font-size:.55rem
}

.employee b {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.58rem
}

.employee b i {
  display:grid;
  width:28px;
  height:28px;
  place-items:center;
  border-radius:9px;
  color:#fff;
  background:linear-gradient(145deg,#5cde52,var(--g));
  font-style:normal;
  font-size:.48rem
}

.employee em {
  color:var(--g);
  font-style:normal;
  font-weight:800;
  text-align:right
}

.pay-alert {
  display:flex;
  gap:9px;
  margin-top:10px;
  padding:12px;
  border:1px solid #cbe5c8;
  border-radius:14px;
  background:#eaf8e8;
  color:#4f6657;
  font-size:.55rem;
  line-height:1.5
}

.pay-alert i {
  display:grid;
  flex:0 0 31px;
  height:31px;
  place-items:center;
  border-radius:9px;
  color:#fff;
  background:var(--g);
  font-style:normal
}

.pay-alert b {
  display:block;
  color:var(--g)
}

@keyframes pulse {
  70% {
    box-shadow:0 0 0 10px rgba(7,143,0,0)
  }

}

/* ==================== SECTION: PAYROLL CYCLE ==================== */
.cycle {
  background:#fff
}

.cycle-route {
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:28px;
  min-height:440px;
  padding-top:72px
}

.cycle-path {
  position:absolute;
  left:5%;
  top:22px;
  width:90%;
  height:245px
}

.cycle-path path {
  fill:none;
  stroke:#cce0ce;
  stroke-width:5;
  stroke-linecap:round
}

.cycle-path .cycle-active {
  stroke:#078F00;
  stroke-dasharray:12 300;
  animation:routeTravel 5s linear infinite
}

.cycle-card {
  position:relative;
  z-index:2;
  min-height:250px;
  padding:24px 21px;
  border:1.5px solid #d2e4d4;
  border-radius:22px;
  background:linear-gradient(155deg,#fff,#f1faf0);
  box-shadow:0 18px 43px rgba(8,34,52,.085);
  transition:.3s
}

.cycle-card:nth-of-type(even) {
  margin-top:78px
}

.cycle-card:hover {
  transform:translateY(-8px);
  border-color:#078F00;
  box-shadow:0 28px 55px rgba(7,143,0,.14)
}

.cycle-node {
  display:grid;
  width:58px;
  height:58px;
  place-items:center;
  margin-bottom:18px;
  border-radius:17px;
  color:#fff;
  background:linear-gradient(145deg,#60e156,#078F00 70%,#045f00);
  box-shadow:inset 2px 2px 6px rgba(255,255,255,.38),0 13px 28px rgba(7,143,0,.22);
  font-size:1.05rem
}

.cycle-card small {
  position:absolute;
  right:18px;
  top:17px;
  color:var(--g);
  font-size:.54rem;
  font-weight:800;
  letter-spacing:.1em
}

.cycle-card h3 {
  margin:0 0 8px;
  color:#0b3044;
  font-size:.92rem
}

.cycle-card p {
  font-size:.65rem;
  line-height:1.58
}

.cycle-arrow {
  position:absolute;
  z-index:3;
  right:-24px;
  top:92px;
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  border:1px solid #cce4cf;
  border-radius:50%;
  color:#fff;
  background:#078F00;
  box-shadow:0 9px 22px rgba(7,143,0,.23);
  font-size:1.05rem;
  animation:nudge 2s ease-in-out infinite
}

.cycle-card:last-of-type .cycle-arrow {
  display:none
}

@keyframes routeTravel {
  to {
    stroke-dashoffset:-312
  }

}

@keyframes nudge {
  50% {
    transform:translateX(5px)
  }

}

/* ==================== SECTION: PEOPLE SUPPORT ==================== */
.people {
  background:#f5faf5
}

.people-grid {
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:58px;
  align-items:center
}

.people-photo {
  position:relative;
  overflow:hidden;
  min-height:500px;
  border-radius:29px;
  box-shadow:var(--shadow)
}

.people-photo img {
  width:100%;
  height:100%;
  min-height:500px;
  object-fit:cover
}

.people-photo:after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 60%,rgba(5,31,43,.55))
}

.people-caption {
  position:absolute;
  z-index:2;
  left:24px;
  right:24px;
  bottom:22px;
  color:#fff
}

.people-caption strong,.people-caption span {
  display:block
}

.people-caption strong {
  font-size:1rem
}

.people-caption span {
  margin-top:5px;
  color:#d2e2e8;
  font-size:.64rem
}

.people-points {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:11px;
  margin-top:24px
}

.people-point {
  padding:16px;
  border:1.5px solid rgba(7,143,0,.34);
  border-radius:16px;
  background:#fff;
  transition:.25s
}

.people-point:hover {
  transform:translateY(-4px);
  border-color:var(--g)
}

.people-point strong {
  display:block;
  color:var(--g);
  font-size:.75rem
}

.people-point span {
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:.61rem;
  line-height:1.5
}

/* ==================== SECTION: AI PAYROLL INTELLIGENCE ==================== */
.ai {
  background:#fff
}

.ai-showcase {
  position:relative;
  overflow:hidden;
  border-radius:34px;
  color:#fff;
  background:radial-gradient(circle at 82% 12%,rgba(71,224,60,.22),transparent 26%),linear-gradient(135deg,#061b29,#0d3044 60%,#075016);
  box-shadow:0 32px 90px rgba(8,34,52,.18)
}

.ai-showcase:before {
  content:"";
  position:absolute;
  inset:0;
  opacity:.18;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:36px 36px
}

.ai-hero {
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:48px;
  align-items:center;
  padding:52px
}

.ai-copy .eyebrow {
  color:#89f081
}

.ai-copy .eyebrow:before {
  background:#89f081
}

.ai-copy h2 {
  font-size:clamp(2.3rem,4.4vw,3.75rem)
}

.ai-copy p {
  color:#cbdbe2;
  font-size:.82rem
}

.ai-pill {
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:18px;
  padding:9px 11px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:99px;
  color:#e5f1f4;
  background:rgba(255,255,255,.07);
  font-size:.59rem;
  font-weight:800
}

.ai-pill i {
  width:8px;
  height:8px;
  border-radius:50%;
  background:#70e667;
  box-shadow:0 0 0 6px rgba(112,230,103,.12);
  animation:pulse 2s infinite
}

.audit-console {
  position:relative;
  min-height:455px;
  padding:18px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:25px;
  background:rgba(247,250,248,.97);
  color:var(--ink);
  box-shadow:0 28px 70px rgba(0,0,0,.25)
}

.audit-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-bottom:14px;
  border-bottom:1px solid var(--line)
}

.audit-top strong {
  font-size:.72rem
}

.audit-status {
  color:var(--g);
  font-size:.53rem;
  font-weight:800
}

.check-run {
  position:relative;
  overflow:hidden;
  margin-top:12px;
  padding:14px;
  border:1px solid #dbe8de;
  border-radius:16px;
  background:#fff
}

.check-run:after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:2px;
  background:linear-gradient(90deg,transparent,var(--g),transparent);
  animation:scan 3.5s ease-in-out infinite
}

.check-head {
  display:flex;
  justify-content:space-between;
  color:#6d7d87;
  font-size:.52rem;
  font-weight:800
}

.check-row {
  display:grid;
  grid-template-columns:1.15fr .85fr .5fr;
  gap:8px;
  align-items:center;
  padding:11px 0;
  border-bottom:1px solid #edf1ee;
  font-size:.53rem
}

.check-row:last-child {
  border-bottom:0
}

.check-row b {
  font-size:.57rem
}

.check-row span {
  color:#667883
}

.check-row em {
  color:var(--g);
  font-style:normal;
  font-weight:800;
  text-align:right
}

.ai-recommend {
  display:flex;
  gap:9px;
  margin-top:10px;
  padding:12px;
  border:1px solid #c9e5c7;
  border-radius:14px;
  background:#eaf8e8
}

.ai-recommend i {
  display:grid;
  flex:0 0 32px;
  height:32px;
  place-items:center;
  border-radius:10px;
  color:#fff;
  background:var(--g);
  font-style:normal
}

.ai-recommend b,.ai-recommend span {
  display:block
}

.ai-recommend b {
  color:var(--g);
  font-size:.59rem
}

.ai-recommend span {
  margin-top:3px;
  color:#4f6557;
  font-size:.53rem;
  line-height:1.45
}

.review-card {
  position:absolute;
  right:-8px;
  bottom:16px;
  display:flex;
  align-items:center;
  gap:8px;
  width:220px;
  padding:9px;
  border:1px solid rgba(255,255,255,.8);
  border-radius:14px;
  background:#fff;
  box-shadow:0 16px 35px rgba(8,34,52,.14);
  animation:float 5s ease-in-out infinite
}

.review-card img {
  width:40px;
  height:40px;
  border-radius:10px;
  object-fit:cover
}

.review-card strong,.review-card span {
  display:block
}

.review-card strong {
  font-size:.56rem
}

.review-card span {
  margin-top:2px;
  color:var(--muted);
  font-size:.47rem
}

.ai-features {
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  padding:0 52px 52px
}

.ai-feature {
  min-height:185px;
  padding:20px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:19px;
  background:rgba(255,255,255,.075);
  backdrop-filter:blur(8px);
  transition:.3s
}

.ai-feature:hover {
  transform:translateY(-7px);
  border-color:rgba(105,226,96,.55);
  background:rgba(7,143,0,.18)
}

.ai-icon {
  display:grid;
  width:43px;
  height:43px;
  place-items:center;
  border-radius:13px;
  color:#fff;
  background:linear-gradient(145deg,#59e04f,#078F00);
  font-size:.9rem
}

.ai-feature h3 {
  margin:17px 0 7px;
  color:#8ff187;
  font-size:.76rem
}

.ai-feature p {
  margin:0;
  color:#c4d5dc;
  font-size:.58rem;
  line-height:1.55
}

@keyframes scan {
  0%,100% {
    top:0
  }
  50% {
    top:100%
  }

}

@keyframes float {
  50% {
    transform:translateY(-7px)
  }

}

/* ==================== SECTION: FAQ ==================== */
.faq {
  background:#f5faf5
}

.faq-layout {
  display:grid;
  grid-template-columns:.7fr 1.3fr;
  gap:65px
}

.faq-list {
  display:grid;
  gap:10px
}

.faq details {
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff
}

.faq summary {
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:20px 22px;
  cursor:pointer;
  font-size:.8rem;
  font-weight:800;
  list-style:none
}

.faq summary::-webkit-details-marker {
  display:none
}

.faq summary:after {
  content:"+";
  color:var(--g);
  font-size:1.15rem
}

.faq details[open] summary:after {
  content:"−"
}

.faq details p {
  padding:0 22px 20px;
  margin:0;
  font-size:.69rem;
  line-height:1.65
}

/* ==================== SECTION: FINAL CTA ==================== */
.cta {
  padding:70px 0;
  background:#fff
}

.cta-panel {
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:38px;
  align-items:center;
  padding:52px;
  border-radius:30px;
  color:#fff;
  background:linear-gradient(90deg,rgba(4,78,0,.97),rgba(7,143,0,.84) 58%,rgba(8,34,52,.38)),url("https://images.pexels.com/photos/3184465/pexels-photo-3184465.jpeg?auto=compress&cs=tinysrgb&w=1600") center/cover;
  box-shadow:0 28px 75px rgba(7,143,0,.2)
}

.cta h2 {
  font-size:clamp(2.2rem,4vw,3.55rem)
}

.cta p {
  color:#e4f3e2
}

.cta-card {
  padding:23px;
  border:1px solid rgba(255,255,255,.55);
  border-radius:20px;
  color:var(--ink);
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(9px)
}

.cta-card strong {
  display:block;
  font-size:.88rem
}

.cta-card span {
  display:block;
  margin-top:8px;
  color:var(--muted);
  font-size:.67rem;
  line-height:1.6
}

.footer {
  padding:33px 0;
  color:#b7c9d2;
  background:#061b29
}

.footer-in {
  display:flex;
  align-items:center;
  justify-content:space-between
}

.footer .brand {
  color:#fff
}

.footer small {
  font-size:.62rem
}

/* ==================== ANIMATIONS ==================== */
.reveal {
  opacity:0;
  transform:translateY(24px);
  transition:.75s ease
}

.reveal.show {
  opacity:1;
  transform:none
}

/* ==================== RESPONSIVE: TABLET ==================== */
@media(max-width:980px) {
  .nav-links a:not(.btn) {
    display:none
  }
  .hero-grid,.command-layout,.people-grid,.ai-hero,.faq-layout,.cta-panel {
    grid-template-columns:1fr
  }
  .hero-grid {
    padding:125px 0 70px
  }
  .hero {
    min-height:auto
  }
  .video-shell {
    max-width:720px
  }
  .coverage-grid {
    grid-template-columns:repeat(2,1fr)
  }
  .cycle-route {
    grid-template-columns:repeat(2,1fr);
    min-height:auto
  }
  .cycle-path {
    display:none
  }
  .cycle-card:nth-of-type(even) {
    margin-top:45px
  }
  .cycle-card:nth-of-type(2) .cycle-arrow {
    display:none
  }
  .people-photo,.people-photo img {
    min-height:420px
  }
  .ai-features {
    grid-template-columns:repeat(2,1fr)
  }
  .assurance-in {
    grid-template-columns:repeat(2,1fr)
  }
  .assurance-item {
    border-bottom:1px solid var(--line)
  }

}

/* ==================== RESPONSIVE: MOBILE ==================== */
@media(max-width:650px) {
  .wrap {
    width:min(100% - 28px,1180px)
  }
  .section {
    padding:72px 0
  }
  .nav {
    height:70px
  }
  .nav .btn {
    font-size:0;
    width:44px
  }
  .nav .btn:after {
    content:"↗";
    font-size:1rem
  }
  .hero-grid {
    padding-top:105px
  }
  .hero h1 {
    font-size:3.1rem
  }
  .video-play {
    width:68px;
    height:68px
  }
  .video-orbit {
    width:230px;
    height:230px
  }
  .assurance-in,.coverage-grid,.pay-summary,.people-points,.cycle-route {
    grid-template-columns:1fr
  }
  .assurance-item {
    border-right:0
  }
  .pay-screen {
    padding:14px
  }
  .employee-head,.employee {
    grid-template-columns:1fr .65fr
  }
  .employee-head span:nth-child(2),.employee>span:nth-child(2) {
    display:none
  }
  .cycle-route {
    padding-top:0
  }
  .cycle-card,.cycle-card:nth-of-type(even) {
    margin-top:0;
    min-height:auto
  }
  .cycle-arrow {
    left:50%;
    right:auto;
    top:auto;
    bottom:-25px;
    transform:translateX(-50%) rotate(90deg)
  }
  .cycle-card:nth-last-of-type(1) .cycle-arrow {
    display:none
  }
  .people-photo,.people-photo img {
    min-height:360px
  }
  .ai-hero {
    padding:30px 21px
  }
  .audit-console {
    min-height:465px
  }
  .ai-features {
    grid-template-columns:1fr;
    padding:0 21px 30px
  }
  .cta-panel {
    padding:30px 22px
  }
  .footer-in {
    display:grid;
    justify-content:center;
    text-align:center;
    gap:13px
  }
  .footer .brand {
    justify-content:center
  }

}

/* ==================== ACCESSIBILITY: REDUCED MOTION ==================== */
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  .reveal {
    opacity:1;
    transform:none;
    transition:none
  }
  .video-orbit,.pay-status i,.cycle-path .cycle-active,.cycle-arrow,.ai-pill i,.check-run:after,.review-card {
    animation:none
  }

}

.cta-eyebrow {
  color:#dcffd9
}/* End custom CSS */