.billing-marketing-page { background:#0c0c0c; }
.billing-marketing-page .section-pad { padding-block:clamp(68px,6.7vw,96px); }
.billing-hero { position:relative; min-height:720px; display:flex; align-items:center; padding:clamp(76px,8vw,116px) 0 92px; overflow:hidden; border-bottom:1px solid rgba(212,175,55,.12); }
.billing-hero::before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.16; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:60px 60px; mask-image:linear-gradient(to right,transparent,#000 44%,#000); }
.billing-hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,.84fr) minmax(570px,1.16fr); gap:clamp(46px,6vw,90px); align-items:center; }
.billing-hero-copy .eyebrow { display:flex; align-items:center; gap:10px; }
.billing-hero-copy .eyebrow span { width:26px; height:1px; background:var(--gold); }
.billing-hero-copy h1 { max-width:660px; }
.billing-hero-copy h1 em { color:var(--gold-light); font-style:normal; }
.billing-hero-lead { max-width:620px; margin:0; color:var(--muted); font-size:clamp(17px,1.5vw,19px); line-height:1.7; }
.billing-boundary { display:flex; align-items:flex-start; gap:9px; margin:23px 0 0; color:#cfc8bc; font-size:12px; }
.billing-boundary i { width:20px; height:20px; flex:0 0 20px; display:grid; place-items:center; border:1px solid var(--line-strong); border-radius:50%; color:var(--gold-light); font-size:9px; font-style:normal; }

.billing-hero-product { position:relative; min-width:0; padding:0 0 45px; }
.billing-demo-window,.billing-ui-panel { overflow:hidden; border:1px solid var(--line-strong); border-radius:16px; background:#0e0e0e; box-shadow:0 38px 95px rgba(0,0,0,.62),0 0 70px rgba(184,134,11,.06); }
.billing-demo-bar { min-height:56px; display:flex; justify-content:space-between; align-items:center; gap:18px; padding:10px 17px; border-bottom:1px solid var(--line); background:#111; }
.billing-demo-bar > div { display:flex; align-items:center; gap:9px; }
.billing-demo-bar img { width:30px; height:30px; border-radius:7px; }
.billing-demo-bar span span,.billing-demo-bar > div > span { display:grid; }
.billing-demo-bar b { color:var(--gold-light); font-size:11px; }
.billing-demo-bar small { color:var(--muted-2); font-size:8px; }
.demo-only { padding:4px 7px; border:1px solid var(--line); border-radius:999px; color:var(--muted); font-size:8px; text-transform:uppercase; letter-spacing:.08em; }
.billing-demo-body { padding:20px; }
.billing-demo-heading { display:flex; justify-content:space-between; align-items:center; gap:18px; margin-bottom:14px; }
.billing-demo-heading > div { display:grid; gap:2px; }
.billing-demo-heading small { color:var(--gold); font-size:8px; letter-spacing:.14em; }
.billing-demo-heading strong { font-size:15px; }
.billing-demo-heading button { width:32px; height:32px; border:1px solid var(--line); border-radius:7px; background:#141414; color:var(--muted); }
.billing-counts { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; }
.billing-counts span,.billing-metrics span { min-width:0; display:grid; padding:10px; border:1px solid var(--line); border-radius:8px; background:#131313; }
.billing-counts b { font-size:18px; }.billing-counts small,.billing-metrics small { color:var(--muted-2); font-size:7px; }
.billing-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:7px; }
.billing-metrics b { overflow:hidden; color:var(--gold-light); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.billing-demo-list { margin-top:8px; border:1px solid var(--line); border-radius:9px; overflow:hidden; background:#111; }
.billing-list-head { min-height:38px; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:0 12px; border-bottom:1px solid var(--line); font-size:9px; }
.billing-list-head span { color:var(--muted-2); }
.billing-demo-list article { min-height:57px; display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:9px; align-items:center; padding:9px 12px; border-bottom:1px solid rgba(255,255,255,.055); }
.billing-demo-list article:last-child { border:0; }
.billing-demo-list article div { min-width:0; display:grid; }
.billing-demo-list article b { overflow:hidden; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.billing-demo-list article small { color:var(--muted-2); font-size:7px; }
.billing-demo-list article > strong { color:#ddd6c9; font-size:8px; white-space:nowrap; }
.demo-status { padding:3px 6px; border:1px solid currentColor; border-radius:999px; font-size:6px; font-weight:850; text-transform:uppercase; white-space:nowrap; }
.demo-status.sent { color:#e7bd45; }.demo-status.paid { color:#69d895; }.demo-status.partial { color:#cf9fe8; }
.accepted-quote-card { position:absolute; right:-22px; bottom:0; width:238px; padding:15px; border:1px solid rgba(95,208,138,.38); border-radius:11px; background:#121512; box-shadow:0 25px 60px rgba(0,0,0,.65); }
.accepted-quote-card > span { display:block; color:#77d99d; font-size:7px; font-weight:850; letter-spacing:.12em; }
.accepted-quote-card > strong,.accepted-quote-card > small { display:block; }.accepted-quote-card > strong { margin:2px 0; }.accepted-quote-card > small { color:var(--muted); font-size:8px; }
.accepted-quote-card > div { display:flex; align-items:center; gap:7px; margin-top:10px; padding-top:9px; border-top:1px solid rgba(95,208,138,.17); color:#9be3b6; font-size:8px; font-weight:750; }
.accepted-quote-card i { width:17px; height:17px; display:grid; place-items:center; border-radius:50%; background:rgba(95,208,138,.12); font-style:normal; }

.billing-flow { padding:31px 0 35px; border-bottom:1px solid var(--line); background:linear-gradient(90deg,rgba(212,175,55,.035),transparent 35%,rgba(212,175,55,.025)); }
.billing-flow .eyebrow { margin-bottom:18px; text-align:center; }
.billing-flow ol { display:grid; grid-template-columns:repeat(5,1fr); margin:0; padding:0; list-style:none; }
.billing-flow li { position:relative; display:grid; justify-items:center; gap:1px; padding:0 16px; text-align:center; }
.billing-flow li:not(:last-child)::after { content:""; position:absolute; top:18px; left:calc(50% + 28px); width:calc(100% - 56px); height:1px; background:linear-gradient(to right,var(--gold-dark),rgba(212,175,55,.08)); }
.billing-flow li > span { z-index:1; width:36px; height:36px; display:grid; place-items:center; margin-bottom:8px; border:1px solid var(--line-strong); border-radius:50%; background:#11100d; color:var(--gold-light); font-size:10px; font-weight:850; }
.billing-flow strong { font-size:15px; }.billing-flow small { color:var(--muted-2); font-size:10px; }

.billing-overview-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.billing-overview-grid article { min-height:148px; display:flex; flex-direction:column; justify-content:center; padding:26px 24px; border:1px solid var(--line); border-radius:12px; background:linear-gradient(145deg,rgba(212,175,55,.025),#121212 46%); box-shadow:inset 0 1px rgba(255,255,255,.025); }
.billing-overview-grid span,.billing-overview-grid small { display:block; color:var(--muted-2); font-size:9px; line-height:1.45; }
.billing-overview-grid span { font-weight:800; letter-spacing:.09em; text-transform:uppercase; }
.billing-overview-grid strong { display:block; margin:8px 0 5px; color:var(--gold-light); font-size:clamp(22px,2.15vw,29px); line-height:1.05; }
.billing-demo-note { margin:16px 0 0; color:var(--muted-2); font-size:10px; text-align:center; }

.billing-feature-grid { display:grid; grid-template-columns:minmax(0,.76fr) minmax(540px,1.24fr); gap:clamp(48px,6.5vw,86px); align-items:center; }
.billing-feature-copy h2 { margin-bottom:17px; font-size:clamp(36px,4.2vw,55px); line-height:1.08; }
.billing-feature-copy > p:not(.eyebrow) { color:var(--muted); }
.billing-checks { display:grid; gap:9px; margin:25px 0 0; padding:0; list-style:none; }
.billing-checks li { position:relative; padding-left:26px; color:#c7c0b4; font-size:13px; }
.billing-checks li::before { content:"✓"; position:absolute; left:0; top:1px; width:18px; height:18px; display:grid; place-items:center; border:1px solid var(--line-strong); border-radius:50%; color:var(--gold-light); font-size:8px; }
.billing-ui-title { min-height:70px; display:flex; justify-content:space-between; align-items:center; gap:18px; padding:15px 20px; border-bottom:1px solid var(--line); background:#131313; }
.billing-ui-title > div { display:grid; }.billing-ui-title small { color:var(--gold); font-size:8px; letter-spacing:.14em; }.billing-ui-title strong { font-size:16px; }
.billing-ui-title > span { padding:4px 8px; border:1px solid var(--line-strong); border-radius:999px; color:var(--gold-light); font-size:8px; font-weight:850; text-transform:uppercase; }
.quote-fields { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:9px; padding:18px; }
.quote-fields > span { display:grid; padding:12px; border:1px solid rgba(255,255,255,.06); border-radius:8px; background:#151515; }
.quote-fields small,.recurring-client small,.recurring-schedule small { color:var(--muted-2); font-size:8px; }.quote-fields b { font-size:10px; }
.quote-table { margin:0 18px; border:1px solid var(--line); border-radius:8px; overflow:hidden; }
.quote-row { min-height:64px; display:grid; grid-template-columns:minmax(0,1fr) 45px 55px 96px; gap:10px; align-items:center; padding:9px 14px; border-top:1px solid rgba(255,255,255,.055); color:var(--muted); font-size:9px; }
.quote-row.quote-head { min-height:34px; border:0; background:#161616; color:var(--muted-2); font-size:8px; text-transform:uppercase; }
.quote-row > span:first-child { min-width:0; display:grid; }.quote-row b { color:var(--text); }.quote-row small { overflow:hidden; color:var(--muted-2); text-overflow:ellipsis; white-space:nowrap; }.quote-row > strong { color:var(--gold-light); text-align:right; }
.quote-total { display:flex; justify-content:space-between; align-items:center; gap:15px; margin:18px; padding:14px 16px; border:1px solid var(--line); border-radius:8px; background:rgba(212,175,55,.04); color:var(--muted); font-size:10px; }.quote-total strong { color:var(--gold-light); font-size:12px; }

.conversion-rail { display:grid; grid-template-columns:1fr auto 1fr; gap:22px; align-items:center; margin-bottom:54px; }
.conversion-rail article { position:relative; min-height:154px; display:flex; flex-direction:column; justify-content:center; gap:3px; overflow:hidden; padding:30px; border:1px solid rgba(212,175,55,.28); border-radius:13px; background:linear-gradient(145deg,rgba(212,175,55,.045),#121212 48%); }
.conversion-rail article::before { content:""; position:absolute; inset:0 auto 0 0; width:3px; background:linear-gradient(var(--gold-light),var(--gold-dark)); }
.conversion-rail article > span { color:var(--gold); font-size:9px; font-weight:850; letter-spacing:.13em; text-transform:uppercase; }.conversion-rail article > strong { margin:3px 0; font-size:27px; line-height:1.1; }.conversion-rail article > small { color:var(--muted); }
.conversion-rail > i { min-width:94px; min-height:50px; display:flex; justify-content:center; align-items:center; gap:9px; padding:9px 14px; border:1px solid var(--line-strong); border-radius:999px; background:#17150f; color:var(--gold-light); font-style:normal; box-shadow:0 12px 30px rgba(0,0,0,.28); }
.conversion-action span { font-size:8px; font-weight:850; letter-spacing:.11em; text-transform:uppercase; }.conversion-action b { font-size:20px; line-height:1; }
.conversion-rail .conversion-result { border-color:rgba(95,208,138,.34); background:linear-gradient(145deg,rgba(95,208,138,.07),#121212 48%); }
.conversion-rail .conversion-result::before { background:linear-gradient(#8fe0ad,#32885a); }
.payment-layout { display:grid; grid-template-columns:.82fr 1.18fr; gap:clamp(50px,8vw,100px); align-items:center; }
.payment-copy h3 { margin-bottom:15px; font-size:clamp(30px,3.6vw,46px); line-height:1.1; }.payment-copy > p:not(.eyebrow) { color:var(--muted); }
.status-cloud { display:flex; flex-wrap:wrap; gap:8px; margin:25px 0 16px; }.status-cloud span { padding:6px 10px; border:1px solid var(--line); border-radius:999px; color:#c9c2b6; font-size:9px; font-weight:700; }
.accuracy-note { margin-top:18px!important; padding-left:12px; border-left:2px solid var(--gold-dark); color:var(--muted-2)!important; font-size:11px; }
.invoice-sheet { max-width:620px; width:100%; justify-self:end; padding:30px; border:1px solid #d9d2c4; border-radius:8px; background:#f4f1ea; color:#181818; box-shadow:0 30px 70px rgba(0,0,0,.5); }
.invoice-sheet-head { display:flex; justify-content:space-between; gap:20px; align-items:start; padding-bottom:18px; border-bottom:2px solid #1c1c1c; }.invoice-sheet-head > div { display:grid; }.invoice-sheet-head small { color:#746e64; font-size:8px; }.invoice-sheet-head strong { color:#a1760d; font-size:24px; }.invoice-sheet-head > span { font-size:11px; font-weight:850; }
.invoice-parties { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:17px 0; }.invoice-parties span { display:grid; padding:10px; border:1px solid #d8d1c6; border-radius:6px; }.invoice-parties small { color:#746e64; font-size:8px; }.invoice-parties b { font-size:10px; }
.invoice-line { display:flex; justify-content:space-between; gap:20px; padding:13px 10px; border-block:1px solid #d8d1c6; font-size:10px; }
.invoice-totals { width:min(300px,100%); display:grid; margin:18px 0 0 auto; border:1px solid #d8d1c6; border-radius:6px; overflow:hidden; }.invoice-totals span { display:flex; justify-content:space-between; gap:12px; padding:8px 10px; border-bottom:1px solid #ded8cd; color:#6d675e; font-size:9px; }.invoice-totals b { color:#181818; }.invoice-totals .balance { border:0; background:#1b1b1a; color:#fff; font-weight:850; }.invoice-totals .balance b { color:#edcf6a; }
.invoice-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:17px; }.invoice-actions span { padding:6px 9px; border:1px solid #cfc6b8; border-radius:5px; font-size:8px; font-weight:750; }

.recurring-grid { grid-template-columns:minmax(0,.85fr) minmax(500px,1.15fr); }
.recurring-panel { max-width:660px; width:100%; justify-self:end; }
.billing-ui-title .active-state { border-color:rgba(95,208,138,.42); color:#77d99d; }
.recurring-client { display:grid; padding:20px 22px; border-bottom:1px solid var(--line); }.recurring-client strong { margin-top:3px; font-size:15px; }
.recurring-schedule { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; padding:19px; }.recurring-schedule span { display:grid; min-height:70px; align-content:center; padding:13px; border:1px solid rgba(255,255,255,.06); border-radius:8px; background:#151515; }.recurring-schedule b { margin-top:3px; font-size:13px; }
.recurring-value { display:flex; justify-content:space-between; align-items:center; gap:20px; margin:0 19px; padding:16px; border:1px solid var(--line); border-radius:8px; color:var(--muted); font-size:10px; }.recurring-value strong { color:var(--gold-light); font-size:20px; }
.recurring-run { display:flex; align-items:center; gap:12px; margin:16px 19px 20px; padding:14px; border:1px solid rgba(95,208,138,.2); border-radius:8px; background:rgba(95,208,138,.045); }.recurring-run i { width:28px; height:28px; flex:0 0 28px; display:grid; place-items:center; border-radius:50%; background:rgba(95,208,138,.12); color:#74d99b; font-style:normal; }.recurring-run span { display:grid; }.recurring-run b { font-size:10px; }.recurring-run small { color:var(--muted); font-size:8px; }

.billing-faq { position:relative; z-index:0; }
.billing-faq .section-heading { top:112px; }

.record-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.record-cards article { padding:27px; border:1px solid var(--line); border-radius:12px; background:#121212; }.record-cards article > span { width:34px; height:34px; display:grid; place-items:center; margin-bottom:18px; border:1px solid var(--line-strong); border-radius:8px; color:var(--gold-light); font-size:9px; font-weight:850; }.record-cards h3 { margin-bottom:10px; font-size:21px; }.record-cards p { margin:0; color:var(--muted); font-size:13px; }

.workforce-bridge { padding-block:clamp(45px,5vw,68px); border-block:1px solid var(--line); background:radial-gradient(circle at 20% 50%,rgba(212,175,55,.07),transparent 30%),#0a0a09; }
.workforce-bridge-grid { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:50px; align-items:center; }.workforce-bridge h2 { margin-bottom:11px; font-size:clamp(30px,3.6vw,47px); }.workforce-bridge p:not(.eyebrow) { max-width:760px; margin:0; color:var(--muted); }.workforce-bridge .btn { white-space:nowrap; }

@media (max-width:1080px) {
  .billing-hero { min-height:0; padding-top:88px; }
  .billing-hero-grid { grid-template-columns:1fr; }
  .billing-hero-copy { max-width:760px; }
  .billing-hero-product { width:min(760px,100%); margin-inline:auto; }
  .billing-feature-grid,.recurring-grid { grid-template-columns:1fr; }
  .billing-feature-copy { max-width:760px; }
  .billing-ui-panel,.recurring-panel { width:min(800px,100%); justify-self:center; }
}

@media (max-width:768px) {
  .billing-hero { padding-block:70px 76px; }
  .billing-hero::before { background-size:44px 44px; }
  .billing-hero-grid { gap:45px; }
  .billing-overview-grid { grid-template-columns:1fr 1fr; }
  .payment-layout { grid-template-columns:1fr; }.invoice-sheet { justify-self:center; }
  .record-cards { grid-template-columns:1fr; }
  .workforce-bridge-grid { grid-template-columns:1fr; gap:26px; }.workforce-bridge .btn { width:max-content; }
  .billing-flow ol { grid-template-columns:1fr; gap:19px; }
  .billing-flow li { grid-template-columns:42px 1fr; justify-items:start; gap:0 13px; padding:0; text-align:left; }
  .billing-flow li > span { grid-row:1/3; margin:0; }.billing-flow li:not(:last-child)::after { top:40px; left:17px; width:1px; height:24px; background:linear-gradient(to bottom,var(--gold-dark),rgba(212,175,55,.08)); }
  .conversion-rail { grid-template-columns:1fr; gap:14px; }.conversion-rail > i { min-width:76px; margin:auto; flex-direction:column; gap:2px; border-radius:18px; }.conversion-action b { transform:rotate(90deg); }
}

@media (max-width:520px) {
  .billing-hero { padding-top:58px; }
  .billing-hero h1 { font-size:42px; }
  .billing-hero-copy .eyebrow { align-items:flex-start; font-size:10px; }
  .billing-hero-product { padding-bottom:68px; }
  .billing-demo-body { padding:12px; }
  .billing-demo-bar { padding-inline:12px; }.demo-only { display:none; }
  .billing-counts { grid-template-columns:1fr 1fr; }
  .billing-metrics { grid-template-columns:1fr; }
  .billing-demo-list article { grid-template-columns:minmax(0,1fr) auto; }.billing-demo-list article > strong { grid-column:1/3; }
  .accepted-quote-card { right:8px; width:min(230px,78%); }
  .billing-overview-grid { grid-template-columns:1fr; }.billing-overview-grid article { min-height:122px; }
  .billing-feature-copy h2 { font-size:36px; }
  .quote-fields { grid-template-columns:1fr; }
  .quote-row { grid-template-columns:minmax(0,1fr) 36px 70px; }.quote-row > span:nth-child(3) { display:none; }.quote-head span:nth-child(3) { display:none; }
  .quote-table { margin-inline:14px; }.quote-total { margin:14px; align-items:flex-start; flex-direction:column; }
  .conversion-rail article { min-height:140px; padding:25px; }.conversion-rail article > strong { font-size:24px; }
  .invoice-sheet { padding:18px; }.invoice-sheet-head { flex-direction:column; }.invoice-parties { grid-template-columns:1fr; }.invoice-actions { justify-content:flex-start; flex-wrap:wrap; }
  .recurring-schedule { grid-template-columns:1fr; }.recurring-value { align-items:flex-start; flex-direction:column; gap:3px; }
  .workforce-bridge .btn { width:100%; white-space:normal; }
}

@media (max-width:360px) {
  .billing-hero h1 { font-size:38px; }
  .billing-demo-heading strong { font-size:13px; }
  .billing-demo-list article { grid-template-columns:1fr; }.billing-demo-list article > strong { grid-column:auto; }.demo-status { width:max-content; }
  .accepted-quote-card { right:4px; width:88%; }
}