.whatsapp-float {
    position: fixed;
    bottom: 20px;
    left: 20px;
    z-index: 1000;
    display: inline-block;
    /*    background-color: #25d366;*/
    /*    border-radius: 50%;*/
    /*    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);*/
    padding: 12px;
    transition: transform 0.2s ease-in-out;
}
    .whatsapp-float img {
        width: 65px;
        height: 65px;
    }

    .whatsapp-float:hover {
        transform: scale(1.1);
    }


body {
    font-family: Inter, "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--cb-text);
}

a {
    color: var(--cb-blue);
}

a:hover,
a:focus {
    color: var(--cb-azure);
}

.btn.btn-theme,
.btn.bg-theme,
.btn-theme {
    background: var(--cb-blue);
    border-color: var(--cb-blue);
    border-radius: var(--cb-radius-button);
    color: var(--cb-white);
    font-weight: 600;
}

.btn.btn-theme:hover,
.btn.btn-theme:focus,
.btn-theme:hover,
.btn-theme:focus {
    background: #0F55DB;
    border-color: #0F55DB;
    color: var(--cb-white);
}

.btn-outline-theme {
    border-color: var(--cb-blue);
    border-radius: var(--cb-radius-button);
    color: var(--cb-blue);
    font-weight: 600;
}

.btn-outline-theme:hover,
.btn-outline-theme:focus {
    background: var(--cb-blue);
    border-color: var(--cb-blue);
    color: var(--cb-white);
}

.text-theme {
    color: var(--cb-blue) !important;
}

.bg-theme,
.badge.bg-theme {
    background: var(--cb-blue) !important;
    color: var(--cb-white);
}

.card,
.dropdown-menu,
.modal-content {
    border-color: var(--cb-border);
}

.app-sidebar,
.app-sidebar .menu {
    background: var(--cb-navy-2);
}

.app-sidebar .menu .menu-item.active > .menu-link,
.app-sidebar .menu .menu-link:hover,
.app-sidebar .menu .menu-link:focus {
    background: rgba(21, 101, 255, 0.16);
    color: var(--cb-white);
}

.app-sidebar .menu .menu-header {
    color: var(--cb-cyan);
}
.changecue-landing-app .app-header {
    box-shadow: 0 1px 0 rgba(11, 18, 32, 0.10);
}

.brand-logo-image {
    display: block;
    width: auto;
    height: 32px;
    max-width: 180px;
    object-fit: contain;
}

.landing-page {
    --landing-bg: var(--cb-slate);
    --landing-surface: var(--cb-white);
    --landing-surface-soft: var(--cb-slate);
    --landing-surface-muted: var(--cb-slate);
    --landing-text: var(--cb-text);
    --landing-muted: var(--cb-muted);
    --landing-subtle: #64748B;
    --landing-border: var(--cb-border);
    --landing-primary: var(--cb-blue);
    --landing-primary-soft: rgba(21, 101, 255, 0.12);
    --landing-success: var(--cb-cyan);
    --landing-browser-bg: var(--cb-navy);
    --landing-browser-text: var(--cb-white);
    --landing-shadow: var(--cb-shadow-soft);
    background: var(--landing-bg);
    color: var(--landing-text);
}

html[data-bs-theme="dark"] .landing-page {
    --landing-bg: var(--cb-navy);
    --landing-surface: var(--cb-navy-2);
    --landing-surface-soft: var(--cb-navy);
    --landing-surface-muted: var(--cb-navy-2);
    --landing-text: var(--cb-white);
    --landing-muted: var(--cb-slate);
    --landing-subtle: var(--cb-border);
    --landing-border: rgba(216, 225, 234, 0.24);
    --landing-primary: var(--cb-cyan);
    --landing-primary-soft: rgba(34, 211, 238, 0.14);
    --landing-success: var(--cb-cyan);
    --landing-browser-bg: var(--cb-navy);
    --landing-browser-text: var(--cb-white);
    --landing-shadow: 0 24px 60px rgba(0, 0, 0, 0.38);
}

.landing-shell {
    width: min(1160px, calc(100% - 40px));
    margin: 0 auto;
}

.landing-hero {
    min-height: calc(100vh - 3.75rem);
    display: flex;
    align-items: center;
    background: var(--landing-surface-soft);
    border-bottom: 1px solid var(--landing-border);
}

.landing-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(420px, 1.05fr);
    gap: 48px;
    align-items: center;
    padding: 72px 0;
}

.landing-eyebrow,
.landing-kicker,
.landing-section-heading span {
    color: var(--landing-primary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0;
    font-size: 0.75rem;
}

.landing-status-dot {
    display: inline-block;
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 50%;
    background: var(--landing-success);
    margin-right: 0.5rem;
}

.landing-copy h1 {
    margin: 1rem 0;
    font-size: 3.25rem;
    line-height: 1.02;
    max-width: 760px;
    color: var(--landing-text);
}

.landing-lead {
    color: var(--landing-muted);
    font-size: 1.125rem;
    line-height: 1.65;
    max-width: 680px;
    margin-bottom: 1.5rem;
}

.landing-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.landing-proof {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    max-width: 680px;
}

.landing-proof div,
.landing-feature,
.landing-checklist,
.landing-process > div,
.landing-product-visual {
    background: var(--landing-surface);
    border: 1px solid var(--landing-border);
    border-radius: var(--cb-radius-card);
}

.landing-proof div {
    padding: 1rem;
}

.landing-proof strong,
.landing-proof span {
    display: block;
}

.landing-proof span {
    color: var(--landing-subtle);
    font-size: 0.8125rem;
    margin-top: 0.25rem;
}

.landing-product-visual {
    overflow: hidden;
    box-shadow: var(--landing-shadow);
}

.landing-browser-bar {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1rem;
    background: var(--landing-browser-bg);
    color: var(--landing-browser-text);
}

.landing-browser-bar span {
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 50%;
    background: var(--landing-subtle);
}

.landing-browser-bar span:first-child {
    background: #e6180d;
}

.landing-browser-bar span:nth-child(2) {
    background: #ff9500;
}

.landing-browser-bar span:nth-child(3) {
    background: var(--landing-success);
}

.landing-browser-bar strong {
    margin-left: 0.5rem;
    font-size: 0.875rem;
}

.landing-dashboard {
    display: grid;
    grid-template-columns: 170px 1fr;
    min-height: 360px;
}

.landing-dashboard-nav {
    background: var(--landing-surface-soft);
    border-right: 1px solid var(--landing-border);
    padding: 1rem;
}

.landing-dashboard-nav div {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    color: var(--landing-subtle);
    padding: 0.75rem;
    border-radius: var(--cb-radius-button);
    font-weight: 600;
}

.landing-dashboard-nav .active {
    background: var(--landing-primary-soft);
    color: var(--landing-primary);
}

.landing-dashboard-main {
    padding: 1.25rem;
}

.landing-score {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--landing-surface-muted);
    border-radius: var(--cb-radius-button);
    padding: 1.25rem;
}

.landing-score span {
    color: var(--landing-muted);
    font-weight: 600;
}

.landing-score strong {
    color: var(--landing-primary);
    font-size: 2.25rem;
}

.landing-bars {
    display: grid;
    gap: 0.75rem;
    margin: 1.25rem 0;
}

.landing-bars span {
    display: block;
    height: 0.75rem;
    border-radius: var(--cb-radius-button);
    background: var(--landing-primary);
}

.landing-bars span:nth-child(2) {
    background: var(--cb-azure);
}

.landing-bars span:nth-child(3) {
    background: var(--landing-success);
}

.landing-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.landing-metrics div {
    border: 1px solid var(--landing-border);
    border-radius: var(--cb-radius-button);
    padding: 1rem;
}

.landing-metrics i,
.landing-metrics strong,
.landing-metrics span {
    display: block;
}

.landing-metrics i {
    margin-bottom: 0.625rem;
    font-size: 1.25rem;
}

.landing-metrics span {
    color: var(--landing-subtle);
    font-size: 0.8125rem;
}

.landing-section {
    padding: 88px 0;
    background: var(--landing-surface);
}

.landing-section-muted {
    background: var(--landing-surface-muted);
    border-top: 1px solid var(--landing-border);
    border-bottom: 1px solid var(--landing-border);
}

.landing-section-heading {
    max-width: 720px;
    margin-bottom: 2rem;
}

.landing-section-heading h2,
.landing-split h2,
.landing-cta h2 {
    margin: 0.5rem 0 0.75rem;
    font-size: 2.25rem;
    line-height: 1.15;
    color: var(--landing-text);
}

.landing-section-heading p,
.landing-split p,
.landing-cta p {
    color: var(--landing-muted);
    font-size: 1rem;
    line-height: 1.7;
}

.landing-feature-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.landing-feature {
    padding: 1.25rem;
}

.landing-feature i {
    color: var(--landing-primary);
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.landing-feature h3 {
    font-size: 1.05rem;
    margin-bottom: 0.5rem;
    color: var(--landing-text);
}

.landing-feature p {
    color: var(--landing-muted);
    line-height: 1.6;
    margin: 0;
}

.landing-split {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(360px, 0.65fr);
    gap: 48px;
    align-items: center;
}

.landing-text-link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--landing-primary);
    font-weight: 700;
    text-decoration: none;
}

.landing-checklist {
    padding: 1rem;
}

.landing-checklist div {
    display: flex;
    gap: 0.75rem;
    padding: 0.875rem;
    color: var(--landing-muted);
    font-weight: 600;
}

.landing-checklist i {
    color: var(--landing-success);
    margin-top: 0.125rem;
}

.landing-process {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.landing-process > div {
    padding: 1.25rem;
}

.landing-plan-card {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    min-height: 100%;
}

.landing-plan-featured {
    border-color: var(--landing-primary) !important;
    box-shadow: 0 16px 34px rgba(21, 101, 255, 0.12);
}

.landing-plan-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 0;
}

.landing-process strong {
    display: block;
    color: var(--landing-primary);
    font-size: 1.5rem;
    margin-bottom: 0;
}

.landing-plan-heading em {
    color: var(--landing-primary);
    background: var(--landing-primary-soft);
    border-radius: 999px;
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 700;
    padding: 0.25rem 0.6rem;
}

.landing-plan-price {
    background: transparent;
    border: 0;
    border-radius: 0;
    color: var(--landing-text);
    font-size: 1.75rem;
    font-weight: 800;
    line-height: 1.1;
    padding: 0;
}

.landing-process span {
    color: var(--landing-muted);
    line-height: 1.6;
}

.landing-plan-limits {
    display: grid;
    gap: 0.5rem;
    list-style: none;
    margin: 0 0 0.25rem;
    padding: 0;
}

.landing-plan-limits li {
    color: var(--landing-muted);
    font-size: 0.9rem;
}

.landing-plan-limits li::before {
    color: var(--landing-success);
    content: "\f00c";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 0.5rem;
}

.landing-cta {
    text-align: center;
    padding: 72px 0;
    background: var(--landing-surface-soft);
    border-top: 1px solid var(--landing-border);
}

.landing-page .btn-outline-default {
    color: var(--landing-text);
    border-color: var(--landing-border);
}

.landing-page .btn-outline-default:hover,
.landing-page .btn-outline-default:focus {
    color: var(--landing-browser-text);
    background: var(--landing-browser-bg);
    border-color: var(--landing-browser-bg);
}

.dropdown-notification .notification-action {
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

@media (max-width: 991.98px) {
    .landing-hero-grid,
    .landing-split {
        grid-template-columns: 1fr;
    }

    .landing-copy h1 {
        font-size: 2.5rem;
    }

    .landing-feature-grid,
    .landing-process {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .landing-shell {
        width: min(100% - 32px, 1160px);
    }

    .landing-hero-grid {
        padding: 48px 0;
    }

    .landing-copy h1 {
        font-size: 2rem;
    }

    .landing-proof,
    .landing-dashboard,
    .landing-metrics,
    .landing-feature-grid,
    .landing-process {
        grid-template-columns: 1fr;
    }

    .landing-dashboard-nav {
        border-right: 0;
        border-bottom: 1px solid var(--landing-border);
    }

    .landing-section,
    .landing-cta {
        padding: 56px 0;
    }
}