
.payroll-overview-hero{
  min-height:auto;
  padding:9rem 0 5rem;
  background:#0b0e13;
}
.payroll-overview-hero .container{position:relative;z-index:2;}
.payroll-overview-hero .payroll-headline-band{margin-top:0;margin-bottom:0;}
.payroll-overview-hero .payroll-band-flush{
  background:rgba(11,18,32,0.82);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 24px 60px rgba(15,23,42,0.14);
}
.payroll-overview-hero .payroll-band-left,
.payroll-overview-hero .payroll-band-right,
.payroll-overview-hero .payroll-cap-card{
  text-align:left;
  align-items:flex-start;
  justify-items:start;
}
.payroll-overview-hero .payroll-cap-name,
.payroll-overview-hero .payroll-cap-desc{ text-align:left; }
.payroll-overview-hero .payroll-band-right{ justify-content:start; }
.payroll-overview-hero .payroll-band-label{ margin-bottom:1rem; }

.payroll-market-section{
  padding:3rem 0;
  background:#ffffff;
}
.market-head{margin-bottom:1rem;}
.market-title{
  margin:0;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#71717a;
}
.market-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:.85rem;
}
.market-card{
  display:flex;
  align-items:center;
  gap:.7rem;
  padding:.95rem 1rem;
  border:1px solid rgba(15,23,42,0.08);
  border-radius:14px;
  background:#f8fafc;
  text-decoration:none;
  color:inherit;
  min-height:68px;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.market-card:hover{transform:translateY(-1px); box-shadow:0 12px 24px rgba(15,23,42,0.06); border-color:rgba(15,23,42,0.14);}
.market-card--beta{background:#ffffff;}
.market-flag{
  font-size:1.35rem;
  line-height:1;
  width:1.5em;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}
.market-copy{
  min-width:0;
  display:flex;
  align-items:center;
}
.market-name{
  font-size:.95rem;
  font-weight:700;
  color:#0f172a;
  line-height:1.1;
}
.market-sub{display:none;}
.market-badge{
  margin-left:auto;
  white-space:nowrap;
  padding:.34rem .58rem;
  border-radius:999px;
  background:#e5e7eb;
  color:#475569;
  font-size:.7rem;
  font-weight:700;
  line-height:1;
}
.market-badge--beta{
  background:#eef2ff;
  color:#4f46e5;
}

.product-section .container,
.products-cta .container,
.payroll-market-section .container,
.payroll-overview-hero .container,
.suite-overview .container{
  max-width:var(--container-max,1280px);
}
.product-section,
.p-section,
.suite-overview,
.products-cta{
  border-top:none !important;
  border-bottom:none !important;
}
.product-section.alt-bg{ background:#f8fafc; }
.p-section.bg-gray{ background:#f8fafc; }
.p-section-why{ background:#ffffff !important; }

.suite-overview-dark{
  background:#0b0e13;
  color:#fff;
}
.suite-overview-dark .suite-overview-label{color:#71717a;}
.suite-overview-dark .suite-overview-title{color:#fff;}
.suite-overview-dark .suite-overview-sub{color:#a1a1aa;}
.suite-overview-dark .suite-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.suite-overview-dark .suite-card{
  background:#18181b;
  border-color:#27272a;
  color:#fff;
}
.suite-overview-dark .suite-card-category{color:#a1a1aa;}
.suite-overview-dark .suite-card-name{color:#fff;}
.suite-overview-dark .suite-card-desc{color:#a1a1aa;}
.suite-overview-dark .suite-card-arrow{color:#a1a1aa;}
.suite-overview-dark .suite-card:hover{
  background:#1f1f23;
  border-color:#3f3f46;
  box-shadow:none;
  transform:none;
  cursor:default;
}

.payroll-overview-cta{
  background:#eff6ff;
  color:#0f172a;
}
.payroll-overview-cta h2{color:#0f172a;}
.payroll-overview-cta p{color:#475569;}
.payroll-overview-cta .btn-primary{
  background:#0f172a;
  color:#fff;
  border-color:#0f172a;
}
.payroll-overview-cta .btn-primary:hover{
  background:#111827;
  border-color:#111827;
}

@media (max-width: 1100px){
  .market-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media (max-width: 900px){
  .market-grid{grid-template-columns:1fr 1fr;}
  .payroll-overview-hero{padding-top:8rem;}
  .suite-overview-dark .suite-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width: 640px){
  .market-grid{grid-template-columns:1fr;}
  .suite-overview-dark .suite-grid{grid-template-columns:1fr;}
}

.payroll-overview-how{background:#0b0e13; padding-top:0;}
.payroll-overview-how .sub-section{padding-top:0;}
.payroll-overview-how .sub-section-inner{padding-top:1rem;}

.payroll-overview-scale{background:#0b0e13;}
.payroll-overview-scale .sub-section{padding-top:0; margin-top:0;}
.payroll-overview-scale .section-label,
.payroll-overview-scale .sub-title,
.payroll-overview-scale .sub-desc,
.payroll-overview-scale .feature-list li,
.payroll-overview-scale .payroll-consol-title,
.payroll-overview-scale .neb-label,
.payroll-overview-scale .neb-desc{color:#fff;}
.payroll-overview-scale .sub-desc,
.payroll-overview-scale .feature-list li,
.payroll-overview-scale .neb-desc{color:rgba(255,255,255,0.78);}
.payroll-overview-scale .sub-section-inner{padding-top:0;}

.payroll-overview-ai{
  background:#f8fafc;
}
.payroll-overview-ai .section-inner.reverse{
  align-items:center;
}
.payroll-overview-beyond{background:#ffffff;}
.payroll-overview-beyond .p-section-inner{border-top:none !important;}

.payroll-overview-how,
.payroll-overview-scale,
.payroll-overview-ai,
.payroll-overview-beyond,
.payroll-overview-cta,
.payroll-market-section,
.suite-overview,
.product-section{
  border-top:none !important;
}

.payroll-market-section .market-card{background:#fff;}
.payroll-market-section .market-badge{min-width:44px; text-align:center;}


.suite-overview-dark .suite-card-arrow{display:none;}


/* v18 refinements */
.payroll-overview-hero .payroll-headline-band{align-items:end;}
.payroll-overview-hero .payroll-band-right{align-self:end;}
.payroll-overview-hero .payroll-band-title{font-size:clamp(2.8rem,5vw,4.9rem);}
.payroll-overview-how .sub-title,.payroll-overview-scale .sub-title{font-size:clamp(1.4rem,2.2vw,1.7rem);}
.payroll-overview-cta h2{font-size:clamp(1.85rem,3vw,2.5rem);}
.payroll-overview-ai{background:#f8fafc;}
#integration .int-card{background:linear-gradient(180deg,#ffffff 0%, #f8fbff 100%);border-color:#d7e3f4;box-shadow:0 14px 36px rgba(59,130,246,.08);}
#integration .int-card:hover{border-color:#93c5fd;box-shadow:0 18px 42px rgba(59,130,246,.14);}
#integration .int-card svg{opacity:1;color:#3b82f6;}
#integration .section-desc{color:#475569;}
.integration-note-active{margin-top:2.5rem !important;padding:1.1rem 1.3rem !important;background:linear-gradient(180deg,#eff6ff 0%, #ffffff 100%) !important;border:1px solid #bfdbfe !important;border-radius:14px !important;display:flex !important;align-items:center !important;gap:0.9rem !important;}
.integration-note-active svg{color:#2563eb;}
.integration-note-active p{color:#334155 !important;font-size:.88rem !important;font-weight:500;}

#scale-sub.sub-section{border-top:none !important;padding-top:0 !important;margin-top:0 !important;}
.payroll-overview-scale .sub-section-inner{padding-top:.25rem;}
#integration .section-label{color:#0d9488;}


/* v20 patch — overview precision adjustments */
.payroll-overview-hero .payroll-headline-band{align-items:stretch;}
.payroll-overview-hero .payroll-band-right{align-self:end;}
.payroll-overview-hero .payroll-cap-grid{display:grid;}
.payroll-overview-hero .payroll-cap-card{height:auto;}

.payroll-overview-how .sub-section{padding-top:.75rem;}
.payroll-overview-how .sub-section-inner{padding-top:1.5rem;align-items:start;}
.payroll-overview-how .visual-box{padding-top:3.05rem;}
.payroll-overview-how .payroll-consol-title{margin:0 0 1rem 0;}
.payroll-overview-how .sub-title,.payroll-overview-scale .sub-title{font-size:clamp(1.48rem,2.2vw,1.82rem);}

.payroll-overview-scale .sub-section-inner{padding-top:0;}
.payroll-overview-scale .sub-section{padding-top:0;margin-top:0;}
.payroll-overview-scale .sub-title{font-size:clamp(1.48rem,2.2vw,1.82rem);}


.payroll-overview-cta h2{font-size:clamp(1.65rem,2.5vw,2.1rem);}

#integration .section-label{color:var(--accent-color,#81d8d0);}

@media (max-width: 1100px){
  .payroll-overview-ai .section-inner.reverse{grid-template-columns:1fr;gap:2.5rem;}
  .payroll-overview-how .visual-box{padding-top:2rem;}
  .payroll-overview-ai .audit-tag{white-space:normal;}
}

/* v21 patch — final spacing and label color refinements */
.payroll-overview-hero .payroll-band-title{
  font-size:clamp(2.65rem,4.7vw,4.55rem);
}
.payroll-overview-hero .payroll-band-label,
.payroll-overview-how .section-label,
.payroll-overview-scale .section-label{
  color:var(--accent-color,#81d8d0) !important;
}
.payroll-overview-ai .section-label{
  color:var(--text-muted) !important;
}

.payroll-overview-scale .sub-section,
#scale-sub.sub-section{
  padding-top:0 !important;
  margin-top:0 !important;
}
.payroll-overview-scale .sub-section-inner{
  padding-top:0.05rem !important;
}



/* final cleanup: keep AI HR Expert chat identical to products page */
.payroll-overview-ai .section-label{color:var(--text-tertiary) !important;}


/* v30 fix — restore products chat layout inside payroll overview AI section */
.payroll-overview-ai .chat-visual .chat-bubble{
  margin-bottom:0.85rem !important;
  display:flex !important;
  flex-direction:column !important;
  width:100% !important;
  max-width:100% !important;
  padding:0 !important;
  border-radius:0 !important;
  font-size:inherit !important;
  line-height:inherit !important;
  white-space:normal !important;
  word-break:normal !important;
  align-self:stretch !important;
}
.payroll-overview-ai .chat-visual .chat-bubble.user{align-items:flex-end !important;}
.payroll-overview-ai .chat-visual .chat-bubble.agent{align-items:flex-start !important;}
.payroll-overview-ai .chat-visual .bubble-text{
  max-width:85% !important;
  padding:0.65rem 0.9rem !important;
  border-radius:10px !important;
  font-size:0.78rem !important;
  line-height:1.55 !important;
  white-space:normal !important;
  word-break:break-word !important;
}
.payroll-overview-ai .chat-visual .bubble-meta{
  font-size:0.65rem !important;
  margin-top:0.25rem !important;
  padding:0 0.25rem !important;
}
.payroll-overview-ai .chat-visual .audit-tag{
  display:inline-flex !important;
  width:auto !important;
  max-width:max-content !important;
  align-items:center !important;
  gap:0.3rem !important;
  padding:0.15rem 0.5rem !important;
  margin-top:0.4rem !important;
  white-space:nowrap !important;
}


.payroll-overview-how-visual{
  display:flex;
  align-items:center !important;
  justify-content:center;
  padding-top:4.6rem;
}
.payroll-overview-how-visual-inner{
  width:100%;
  max-width:420px;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.payroll-overview-how-visual .payroll-consol-title{
  width:100%;
  text-align:center;
  margin:0 0 1rem 0;
}
.payroll-overview-foundation{
  background:#ffffff;
}
.payroll-overview-foundation .section-label{
  color:var(--accent-color,#81d8d0);
}
@media (max-width:1100px){
  .payroll-overview-how-visual{padding-top:2rem;}
  .payroll-overview-how-visual-inner{max-width:400px;}
}
