.billing-page{--bill-blue:#1678f3;--bill-navy:#071f3e;--bill-green:#08b884;--bill-pink:#ff5277;--bill-purple:#7a55ff;--bill-orange:#ff8a24}.billing-page .bill-hero .inv-hero-copy h1 em{display:inline}.billing-page .bill-hero .inv-hero-copy h1{max-width:640px}.billing-page .bill-hero .inv-float-card>i{color:var(--bill-blue);background:#e8f3ff}.billing-page .bill-hero .float-two>i{color:var(--bill-purple);background:#f0ebff}.billing-page .bill-phone{height:310px}.billing-page .bill-tabs button{min-width:108px}.bill-invoice-grid,.bill-data-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:65px;align-items:center}.bill-steps{list-style:none;padding:0;margin:25px 0 0;position:relative}.bill-steps:before{content:"";position:absolute;left:20px;top:22px;bottom:22px;border-left:2px solid #b9dcff}.bill-steps li{position:relative;display:flex;align-items:center;gap:15px;margin:14px 0}.bill-steps li>i{display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border-radius:50%;background:#1478f2;color:#fff;font-style:normal;font-weight:800;box-shadow:0 8px 20px rgba(20,120,242,.22);z-index:1}.bill-steps li span{display:flex;flex-direction:column}.bill-steps li b{font-size:15px}.bill-steps li small{font-size:11px}.bill-invoice-stage{position:relative;display:grid;grid-template-columns:1fr 150px;gap:16px;align-items:center}.bill-paper{padding:30px;background:#fff;border:1px solid #d9e7f6;border-radius:20px;box-shadow:0 25px 60px rgba(11,62,113,.13)}.bill-paper>header{display:flex;justify-content:space-between;align-items:start;padding-bottom:20px;border-bottom:2px solid #edf3f9}.bill-paper header>div{display:flex;gap:8px;align-items:center}.bill-paper header>div i{color:#1478f2;font-size:22px}.bill-paper header>span{display:flex;flex-direction:column;text-align:right}.bill-paper header strong{font-size:22px}.bill-paper header small{font-size:9px}.bill-to{display:flex;justify-content:space-between;padding:20px 0}.bill-to>span{display:flex;flex-direction:column}.bill-to small{font-size:9px;text-transform:uppercase;letter-spacing:.1em}.bill-to b{font-size:14px}.bill-to em{font-size:10px;font-style:normal}.bill-to .paid{color:#08aa79}.bill-line{display:grid;grid-template-columns:1.6fr .45fr .7fr .7fr;gap:8px;padding:10px;border-bottom:1px solid #e8eff6;font-size:11px}.bill-line.head{background:#eef6ff;border-radius:8px 8px 0 0;font-weight:800;color:#2c5072}.bill-totals{width:54%;margin:17px 0 0 auto}.bill-totals span,.bill-totals strong{display:flex;justify-content:space-between;padding:4px 0;font-size:11px}.bill-totals strong{padding-top:8px;border-top:1px solid #d7e5f2}.bill-paper>footer{display:flex;justify-content:space-between;margin-top:23px;padding-top:12px;border-top:1px solid #edf2f7;font-size:9px;color:#698199}.bill-paper>footer small{font-weight:800;letter-spacing:.1em}.bill-invoice-actions{display:flex;flex-direction:column;gap:10px}.bill-invoice-actions button{display:flex;align-items:center;gap:8px;padding:12px;background:#fff;border:1px solid #d9e7f6;border-radius:11px;color:#234766;font-weight:700;font-size:11px;transition:.3s}.bill-invoice-actions button:hover{transform:translateX(4px);border-color:#9ac9fa;box-shadow:0 10px 22px rgba(17,85,151,.09)}.bill-invoice-actions i{color:#1478f2;font-size:16px}
.bill-customer-ui,.bill-payment-table{position:relative;padding:23px;background:#fff;border:1px solid #d9e7f6;border-radius:22px;box-shadow:0 22px 50px rgba(12,67,122,.09)}.bill-ui-head,.bill-payment-table>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.bill-ui-head>div{display:flex;gap:5px}.bill-ui-head button{border:0;background:#f0f6fc;border-radius:99px;padding:7px 10px;font-size:9px;font-weight:700}.bill-ui-head button.active{background:#1478f2;color:#fff}.bill-customer-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}.bill-customer-summary article{display:flex;flex-direction:column;padding:14px;background:#f3f8fe;border-radius:11px}.bill-customer-summary small{font-size:8px}.bill-customer-summary b{font-size:20px}.bill-data-row{display:grid;grid-template-columns:1.35fr .55fr .65fr .75fr;align-items:center;gap:8px;padding:12px;border-top:1px solid #e9f0f6;font-size:11px}.bill-data-row.head{background:#f8fbfe;color:#748ca3;font-size:9px}.bill-data-row em{font-style:normal;color:#08a978}.bill-data-row em.due{color:#e28a16}.bill-data-row em.late{color:#ee4d69}.bill-payment-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:22px;align-items:stretch}.bill-payment-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.bill-payment-summary article{padding:20px;background:#fff;border:1px solid #d9e7f6;border-radius:18px;display:flex;flex-direction:column}.bill-payment-summary .inv-icon{width:46px;height:46px;margin-bottom:16px}.bill-payment-summary small{font-size:10px}.bill-payment-summary b{font-size:20px;margin:4px 0}.bill-payment-summary em{font-size:8px;font-style:normal;letter-spacing:.08em;color:#08a978}.bill-payment-summary article:nth-child(2) em{color:#e28a16}.bill-payment-summary article:nth-child(3) em{color:#ed4d68}.bill-double-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.bill-module{position:relative;padding:28px;background:#fff;border:1px solid #d9e7f6;border-radius:24px;box-shadow:0 18px 42px rgba(12,67,122,.08)}.bill-module>.inv-kicker{display:block;margin-top:18px}.bill-module h2{font-size:30px;line-height:1.1;margin:8px 0 12px}.bill-module-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:18px 0}.bill-module-kpis span{padding:12px;background:#f4f9ff;border-radius:10px;display:flex;flex-direction:column}.bill-module-kpis small{font-size:8px}.bill-module-kpis b{font-size:15px}.bill-pills{display:flex;flex-wrap:wrap;gap:7px}.bill-pills span{padding:8px 11px;background:#f0ecff;color:#6847dc;border-radius:99px;font-size:9px;font-weight:700}.bill-expense-chart{height:170px;display:flex;align-items:end;gap:14px;margin-top:24px;padding:10px 8px 28px;border-bottom:1px solid #dbe7f2;background:repeating-linear-gradient(to top,transparent 0,transparent 39px,#edf3f8 40px)}.bill-expense-chart>i{position:relative;flex:1;height:var(--bar);background:linear-gradient(#24d0c2,#00a9ae);border-radius:6px 6px 0 0}.bill-expense-chart small{position:absolute;left:50%;bottom:-22px;transform:translateX(-50%);font-size:7px;font-style:normal;white-space:nowrap;color:#57718a}
.billing-page .bill-analytics h2,.billing-page .bill-analytics b{color:#fff}.bill-report-grid span{transition:.3s}.bill-report-grid span:hover{transform:translateY(-5px);border-color:#a7d2ff;box-shadow:0 15px 30px rgba(12,71,129,.1)}.bill-flow{max-width:1100px;margin:auto}.bill-role-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:13px}.bill-role-grid article{text-align:center;padding:24px 14px;background:#fff;border:1px solid #d9e7f6;border-radius:19px}.bill-role-grid .inv-icon{margin:auto}.bill-role-grid h3{font-size:16px;margin:16px 0 5px}.bill-role-grid p{font-size:11px;margin:0}.bill-transform h2,.bill-transform h3{color:#fff}.bill-faq{background:#fff}.bill-final{background:linear-gradient(120deg,#071f3e,#0f63a9)}.bill-final h2{color:#fff}.bill-final-visual{position:relative;height:320px}.bill-boxes{position:absolute;right:0;bottom:5px;width:88%;height:235px;display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:22px;background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.04));border-radius:90px 90px 18px 18px}.bill-boxes i{background:linear-gradient(145deg,#d99c4b,#ffd18a);border:5px solid #a86c27;border-radius:5px;box-shadow:inset 0 0 0 4px rgba(255,255,255,.14)}.bill-final-visual .inv-final-screen{left:0;bottom:24px}.billing-page .inv-feature::after{display:block;content:"\F138"}.billing-page .inv-feature:hover::after{transform:translateX(4px)}
@media(max-width:991px){.bill-invoice-grid,.bill-data-grid{grid-template-columns:1fr}.bill-invoice-stage{max-width:760px;margin:auto}.bill-payment-grid,.bill-double-grid{grid-template-columns:1fr}.bill-role-grid{grid-template-columns:repeat(3,1fr)}.billing-page .bill-phone{height:290px}}
@media(max-width:767px){.billing-page .bill-hero .inv-hero-copy h1 em{display:block}.bill-invoice-stage{grid-template-columns:1fr}.bill-invoice-actions{display:grid;grid-template-columns:1fr 1fr}.bill-paper{padding:19px}.bill-line{grid-template-columns:1.45fr .35fr .65fr .65fr;padding:9px 5px;font-size:9px}.bill-totals{width:72%}.bill-data-row{grid-template-columns:1.25fr .55fr .7fr}.bill-data-row>span:nth-child(2),.bill-data-row.head>span:nth-child(2){display:none}.bill-customer-summary{grid-template-columns:1fr 1fr}.bill-customer-summary article:last-child{grid-column:1/3}.bill-payment-summary{grid-template-columns:1fr}.bill-module-kpis{grid-template-columns:1fr 1fr}.bill-double-grid{gap:15px}.bill-module h2{font-size:25px}.bill-role-grid{grid-template-columns:1fr 1fr}.bill-final-visual{height:250px}.bill-boxes{height:190px}.billing-page .bill-phone{height:260px}.billing-page .inv-feature::after{display:none;content:none}}
@media(max-width:420px){.bill-invoice-actions{grid-template-columns:1fr}.bill-paper>header,.bill-to{gap:12px}.bill-paper header strong{font-size:18px}.bill-totals{width:100%}.bill-role-grid{grid-template-columns:1fr}.bill-final-visual .inv-final-screen{width:175px}.bill-boxes{width:96%}}
@media(prefers-reduced-motion:reduce){.bill-expense-chart>i{animation:none}.bill-invoice-actions button{transition:none}}

/* ================================================
   BILLING FAQ - Premium Accordion (contact-us.html style)
   ================================================ */
.bill-faq-accordion {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.bill-faq-item {
    border: 1px solid #e0e9f5 !important;
    border-radius: 14px !important;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 4px 20px rgba(20, 80, 160, 0.05);
    transition: box-shadow 0.35s ease, transform 0.35s ease;
}

.bill-faq-item:hover {
    box-shadow: 0 8px 35px rgba(20, 80, 160, 0.12);
    transform: translateY(-2px);
}

.bill-faq-btn {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    padding: 20px 24px;
    background: #fff;
    border: none;
    color: #0d1f3c;
    font-size: 16px;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
    transition: background 0.3s ease, color 0.3s ease;
    border-radius: 14px;
}

.bill-faq-btn:not(.collapsed) {
    background: linear-gradient(90deg, #eef4ff 0%, #f5f9ff 100%);
    color: #1678f3;
    border-radius: 14px 14px 0 0;
}

.bill-faq-btn:focus {
    box-shadow: none;
    outline: none;
}

.bill-faq-btn::after {
    content: "\F4FE";
    font-family: "bootstrap-icons";
    margin-left: auto;
    font-size: 18px;
    color: #b0c4dd;
    transition: transform 0.35s ease, color 0.3s ease;
    flex-shrink: 0;
}

.bill-faq-btn:not(.collapsed)::after {
    transform: rotate(45deg);
    color: #1678f3;
}

.bill-faq-icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    border-radius: 10px;
    background: #eef4ff;
    color: #1678f3;
    font-size: 18px;
    transition: background 0.3s ease;
}

.bill-faq-btn:not(.collapsed) .bill-faq-icon {
    background: #1678f3;
    color: #fff;
}

.bill-faq-body {
    padding: 6px 24px 24px 80px;
    font-size: 15px;
    color: #5a7090;
    line-height: 1.7;
    border-top: 1px solid #edf3fc;
    background: #fafdff;
}

@media (max-width: 767px) {
    .bill-faq-btn {
        padding: 16px 18px;
        font-size: 14px;
        gap: 10px;
    }
    .bill-faq-icon {
        width: 36px;
        height: 36px;
        font-size: 15px;
    }
    .bill-faq-body {
        padding: 8px 18px 18px 64px;
        font-size: 13px;
    }
}