/* ============================================================
       HEADER — Default (Light, for all pages)
       ============================================================ */
    .workroomly-site-header.navbar {
        isolation: isolate;
        overflow: visible;
        border-bottom: 1px solid rgba(18, 42, 82, 0.075);
        background:
            rgba(255, 255, 255, 0.988) !important;
        background-color: rgba(251, 253, 255, 0.985);
        background-position: -8px -20px, -8px -20px, 0 0;
        background-size: 54px 54px, 54px 54px, auto;
        box-shadow: 0 10px 30px rgba(15, 35, 72, 0.035);
        backdrop-filter: blur(18px) saturate(1.04);
        -webkit-backdrop-filter: blur(18px) saturate(1.04);
        padding: 14px 0;
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .workroomly-site-header.navbar::before {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background:
            rgba(255, 255, 255, 0.54);
    }

    .workroomly-site-header.navbar .container {
        position: relative;
        z-index: 1;
    }

    .workroomly-site-header .navbar-toggler {
        border-color: rgba(13, 45, 91, 0.14);
        background: rgba(255, 255, 255, 0.72);
    }

    .workroomly-site-header .nav-link {
        color: #132251;
        font-weight: 500;
        font-size: 0.92rem;
        transition: color 0.25s ease;
    }

    .workroomly-site-header .nav-link:hover,
    .workroomly-site-header .nav-link:focus {
        color: #1457e6;
    }

    @media (max-width: 991.98px) {
        .workroomly-site-header .navbar-collapse {
            margin-top: 0.75rem;
            padding: 0.85rem;
            border: 1px solid rgba(13, 45, 91, 0.08);
            border-radius:  0;
            background:
                rgba(255, 255, 255, 0.972);
            background-size: 48px 48px, 48px 48px, auto;
            box-shadow: 0 18px 40px rgba(9, 28, 69, 0.1);
        }
    }

    /* ============================================================
       HEADER — Dark variant (Pages with dark heroes)
       ============================================================ */
    .home-page .workroomly-site-header.navbar,
    .pricing-page .workroomly-site-header.navbar,
    .features-page .workroomly-site-header.navbar,
    .terms-page .workroomly-site-header.navbar,
    .privacy-page .workroomly-site-header.navbar,
    .dpa-page .workroomly-site-header.navbar,
    .compliance-page .workroomly-site-header.navbar,
    .contact-page .workroomly-site-header.navbar,
    .careers-page .workroomly-site-header.navbar {
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
        background: rgba(5, 13, 31, 0.72) !important;
        background-color: rgba(5, 13, 31, 0.72);
        box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.04);
        backdrop-filter: blur(20px) saturate(1.2);
        -webkit-backdrop-filter: blur(20px) saturate(1.2);
    }

    .home-page .workroomly-site-header.navbar::before,
    .pricing-page .workroomly-site-header.navbar::before {
        background:
            transparent;
    }

    .home-page .workroomly-site-header .navbar-brand img,
    .pricing-page .workroomly-site-header .navbar-brand img {
        filter: brightness(0) invert(1);
    }

    .home-page .workroomly-site-header .navbar-toggler,
    .pricing-page .workroomly-site-header .navbar-toggler {
        border-color: rgba(255, 255, 255, 0.15);
        background: rgba(255, 255, 255, 0.06);
    }

    .home-page .workroomly-site-header .navbar-toggler-icon,
    .pricing-page .workroomly-site-header .navbar-toggler-icon {
        filter: invert(1);
    }

    .home-page .workroomly-site-header .nav-link,
    .pricing-page .workroomly-site-header .nav-link {
        color: rgba(255, 255, 255, 0.75);
    }

    .home-page .workroomly-site-header .nav-link:hover,
    .home-page .workroomly-site-header .nav-link:focus,
    .pricing-page .workroomly-site-header .nav-link:hover,
    .pricing-page .workroomly-site-header .nav-link:focus {
        color: #ffffff;
    }

    .home-page .workroomly-site-header .nav-link::after,
    .pricing-page .workroomly-site-header .nav-link::after {
        background: #4fc4ff !important;
    }

    .home-page .workroomly-site-header .platform-caret,
    .pricing-page .workroomly-site-header .platform-caret {
        color: rgba(255, 255, 255, 0.4);
    }

    /* CTA buttons — dark variant */
    .home-page .workroomly-site-header .navbar-cta .btn-outline-primary,
    .pricing-page .workroomly-site-header .navbar-cta .btn-outline-primary {
        color: rgba(255, 255, 255, 0.85);
        border-color: rgba(255, 255, 255, 0.18);
        background: rgba(255, 255, 255, 0.04);
    }

    .home-page .workroomly-site-header .navbar-cta .btn-outline-primary:hover,
    .pricing-page .workroomly-site-header .navbar-cta .btn-outline-primary:hover {
        color: #ffffff;
        border-color: rgba(255, 255, 255, 0.3);
        background: rgba(255, 255, 255, 0.1);
    }

    .home-page .workroomly-site-header .navbar-cta .btn-primary,
    .pricing-page .workroomly-site-header .navbar-cta .btn-primary {
        background: #1457e6;
        border: none;
        color: #ffffff;
        box-shadow: 0 2px 12px rgba(20, 87, 230, 0.3);
    }

    .home-page .workroomly-site-header .navbar-cta .btn-primary:hover,
    .pricing-page .workroomly-site-header .navbar-cta .btn-primary:hover {
        background: #1a5ff0;
        box-shadow: 0 4px 20px rgba(20, 87, 230, 0.45);
        transform: translateY(-1px);
    }

    /* Scrolled state */
    .home-page .workroomly-site-header.navbar.scrolled,
    .pricing-page .workroomly-site-header.navbar.scrolled {
        background: rgba(5, 13, 31, 0.92) !important;
        border-bottom-color: rgba(255, 255, 255, 0.08);
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
    }

    @media (max-width: 991.98px) {
        .home-page .workroomly-site-header .navbar-collapse,
        .pricing-page .workroomly-site-header .navbar-collapse {
            border: 1px solid rgba(255, 255, 255, 0.08);
            background: rgba(10, 18, 42, 0.95);
            box-shadow: 0 20px 48px rgba(0, 0, 0, 0.3);
        }

    }

    /* Features page — inherit all dark header styles */
    .features-page .workroomly-site-header.navbar::before { background: transparent; }
    .features-page .workroomly-site-header .navbar-brand img { filter: brightness(0) invert(1); }
    .features-page .workroomly-site-header .navbar-toggler { border-color: rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.06); }
    .features-page .workroomly-site-header .navbar-toggler-icon { filter: invert(1); }
    .features-page .workroomly-site-header .nav-link { color: rgba(255, 255, 255, 0.75); }
    .features-page .workroomly-site-header .nav-link:hover,
    .features-page .workroomly-site-header .nav-link:focus { color: #ffffff; }
    .features-page .workroomly-site-header .nav-link::after { background: #4fc4ff !important; }
    .features-page .workroomly-site-header .platform-caret { color: rgba(255, 255, 255, 0.4); }
    .features-page .workroomly-site-header .navbar-cta .btn-outline-primary { color: rgba(255, 255, 255, 0.85); border-color: rgba(255, 255, 255, 0.18); background: rgba(255, 255, 255, 0.04); }
    .features-page .workroomly-site-header .navbar-cta .btn-outline-primary:hover { color: #ffffff; border-color: rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.1); }
    .features-page .workroomly-site-header .navbar-cta .btn-primary { background: #1457e6; border: none; color: #ffffff; box-shadow: 0 2px 12px rgba(20, 87, 230, 0.3); }
    .features-page .workroomly-site-header .navbar-cta .btn-primary:hover { background: #1a5ff0; box-shadow: 0 4px 20px rgba(20, 87, 230, 0.45); transform: translateY(-1px); }
    .features-page .workroomly-site-header.navbar.scrolled { background: rgba(5, 13, 31, 0.92) !important; border-bottom-color: rgba(255, 255, 255, 0.08); box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25); }
    @media (max-width: 991.98px) {
        .features-page .workroomly-site-header .navbar-collapse { border: 1px solid rgba(255, 255, 255, 0.08); background: rgba(10, 18, 42, 0.95); box-shadow: 0 20px 48px rgba(0, 0, 0, 0.3); }
    }
    /* Terms page — dark header */
    .terms-page .workroomly-site-header.navbar::before { background: transparent; }
    .terms-page .workroomly-site-header .navbar-brand img { filter: brightness(0) invert(1); }
    .terms-page .workroomly-site-header .navbar-toggler { border-color: rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.06); }
    .terms-page .workroomly-site-header .navbar-toggler-icon { filter: invert(1); }
    .terms-page .workroomly-site-header .nav-link { color: rgba(255, 255, 255, 0.75); }
    .terms-page .workroomly-site-header .nav-link:hover,
    .terms-page .workroomly-site-header .nav-link:focus { color: #ffffff; }
    .terms-page .workroomly-site-header .nav-link::after { background: #4fc4ff !important; }
    .terms-page .workroomly-site-header .platform-caret { color: rgba(255, 255, 255, 0.4); }
    .terms-page .workroomly-site-header .navbar-cta .btn-outline-primary { color: rgba(255, 255, 255, 0.85); border-color: rgba(255, 255, 255, 0.18); background: rgba(255, 255, 255, 0.04); }
    .terms-page .workroomly-site-header .navbar-cta .btn-outline-primary:hover { color: #ffffff; border-color: rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.1); }
    .terms-page .workroomly-site-header .navbar-cta .btn-primary { background: #1457e6; border: none; color: #ffffff; box-shadow: 0 2px 12px rgba(20, 87, 230, 0.3); }
    .terms-page .workroomly-site-header .navbar-cta .btn-primary:hover { background: #1a5ff0; box-shadow: 0 4px 20px rgba(20, 87, 230, 0.45); transform: translateY(-1px); }
    .terms-page .workroomly-site-header.navbar.scrolled { background: rgba(5, 13, 31, 0.92) !important; border-bottom-color: rgba(255, 255, 255, 0.08); box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25); }
    @media (max-width: 991.98px) {
        .terms-page .workroomly-site-header .navbar-collapse { border: 1px solid rgba(255, 255, 255, 0.08); background: rgba(10, 18, 42, 0.95); box-shadow: 0 20px 48px rgba(0, 0, 0, 0.3); }
    }

    /* Privacy page — dark header */
    .privacy-page .workroomly-site-header.navbar::before { background: transparent; }
    .privacy-page .workroomly-site-header .navbar-brand img { filter: brightness(0) invert(1); }
    .privacy-page .workroomly-site-header .navbar-toggler { border-color: rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.06); }
    .privacy-page .workroomly-site-header .navbar-toggler-icon { filter: invert(1); }
    .privacy-page .workroomly-site-header .nav-link { color: rgba(255, 255, 255, 0.75); }
    .privacy-page .workroomly-site-header .nav-link:hover,
    .privacy-page .workroomly-site-header .nav-link:focus { color: #ffffff; }
    .privacy-page .workroomly-site-header .nav-link::after { background: #4fc4ff !important; }
    .privacy-page .workroomly-site-header .platform-caret { color: rgba(255, 255, 255, 0.4); }
    .privacy-page .workroomly-site-header .navbar-cta .btn-outline-primary { color: rgba(255, 255, 255, 0.85); border-color: rgba(255, 255, 255, 0.18); background: rgba(255, 255, 255, 0.04); }
    .privacy-page .workroomly-site-header .navbar-cta .btn-outline-primary:hover { color: #ffffff; border-color: rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.1); }
    .privacy-page .workroomly-site-header .navbar-cta .btn-primary { background: #1457e6; border: none; color: #ffffff; box-shadow: 0 2px 12px rgba(20, 87, 230, 0.3); }
    .privacy-page .workroomly-site-header .navbar-cta .btn-primary:hover { background: #1a5ff0; box-shadow: 0 4px 20px rgba(20, 87, 230, 0.45); transform: translateY(-1px); }
    .privacy-page .workroomly-site-header.navbar.scrolled { background: rgba(5, 13, 31, 0.92) !important; border-bottom-color: rgba(255, 255, 255, 0.08); box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25); }
    @media (max-width: 991.98px) {
        .privacy-page .workroomly-site-header .navbar-collapse { border: 1px solid rgba(255, 255, 255, 0.08); background: rgba(10, 18, 42, 0.95); box-shadow: 0 20px 48px rgba(0, 0, 0, 0.3); }
    }

    /* DPA + Compliance pages — dark header */
    .dpa-page .workroomly-site-header.navbar::before,
    .compliance-page .workroomly-site-header.navbar::before { background: transparent; }
    .dpa-page .workroomly-site-header .navbar-brand img,
    .compliance-page .workroomly-site-header .navbar-brand img { filter: brightness(0) invert(1); }
    .dpa-page .workroomly-site-header .navbar-toggler,
    .compliance-page .workroomly-site-header .navbar-toggler { border-color: rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.06); }
    .dpa-page .workroomly-site-header .navbar-toggler-icon,
    .compliance-page .workroomly-site-header .navbar-toggler-icon { filter: invert(1); }
    .dpa-page .workroomly-site-header .nav-link,
    .compliance-page .workroomly-site-header .nav-link { color: rgba(255, 255, 255, 0.75); }
    .dpa-page .workroomly-site-header .nav-link:hover,
    .dpa-page .workroomly-site-header .nav-link:focus,
    .compliance-page .workroomly-site-header .nav-link:hover,
    .compliance-page .workroomly-site-header .nav-link:focus { color: #ffffff; }
    .dpa-page .workroomly-site-header .nav-link::after,
    .compliance-page .workroomly-site-header .nav-link::after { background: #4fc4ff !important; }
    .dpa-page .workroomly-site-header .platform-caret,
    .compliance-page .workroomly-site-header .platform-caret { color: rgba(255, 255, 255, 0.4); }
    .dpa-page .workroomly-site-header .navbar-cta .btn-outline-primary,
    .compliance-page .workroomly-site-header .navbar-cta .btn-outline-primary { color: rgba(255, 255, 255, 0.85); border-color: rgba(255, 255, 255, 0.18); background: rgba(255, 255, 255, 0.04); }
    .dpa-page .workroomly-site-header .navbar-cta .btn-outline-primary:hover,
    .compliance-page .workroomly-site-header .navbar-cta .btn-outline-primary:hover { color: #ffffff; border-color: rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.1); }
    .dpa-page .workroomly-site-header .navbar-cta .btn-primary,
    .compliance-page .workroomly-site-header .navbar-cta .btn-primary { background: #1457e6; border: none; color: #ffffff; box-shadow: 0 2px 12px rgba(20, 87, 230, 0.3); }
    .dpa-page .workroomly-site-header .navbar-cta .btn-primary:hover,
    .compliance-page .workroomly-site-header .navbar-cta .btn-primary:hover { background: #1a5ff0; box-shadow: 0 4px 20px rgba(20, 87, 230, 0.45); transform: translateY(-1px); }
    .dpa-page .workroomly-site-header.navbar.scrolled,
    .compliance-page .workroomly-site-header.navbar.scrolled { background: rgba(5, 13, 31, 0.92) !important; border-bottom-color: rgba(255, 255, 255, 0.08); box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25); }
    @media (max-width: 991.98px) {
        .dpa-page .workroomly-site-header .navbar-collapse,
        .compliance-page .workroomly-site-header .navbar-collapse { border: 1px solid rgba(255, 255, 255, 0.08); background: rgba(10, 18, 42, 0.95); box-shadow: 0 20px 48px rgba(0, 0, 0, 0.3); }
    }

    /* Contact page — dark header */
    .contact-page .workroomly-site-header.navbar::before { background: transparent; }
    .contact-page .workroomly-site-header .navbar-brand img { filter: brightness(0) invert(1); }
    .contact-page .workroomly-site-header .navbar-toggler { border-color: rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.06); }
    .contact-page .workroomly-site-header .navbar-toggler-icon { filter: invert(1); }
    .contact-page .workroomly-site-header .nav-link { color: rgba(255, 255, 255, 0.75); }
    .contact-page .workroomly-site-header .nav-link:hover,
    .contact-page .workroomly-site-header .nav-link:focus { color: #ffffff; }
    .contact-page .workroomly-site-header .nav-link::after { background: #4fc4ff !important; }
    .contact-page .workroomly-site-header .platform-caret { color: rgba(255, 255, 255, 0.4); }
    .contact-page .workroomly-site-header .navbar-cta .btn-outline-primary { color: rgba(255, 255, 255, 0.85); border-color: rgba(255, 255, 255, 0.18); background: rgba(255, 255, 255, 0.04); }
    .contact-page .workroomly-site-header .navbar-cta .btn-outline-primary:hover { color: #ffffff; border-color: rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.1); }
    .contact-page .workroomly-site-header .navbar-cta .btn-primary { background: #1457e6; border: none; color: #ffffff; box-shadow: 0 2px 12px rgba(20, 87, 230, 0.3); }
    .contact-page .workroomly-site-header .navbar-cta .btn-primary:hover { background: #1a5ff0; box-shadow: 0 4px 20px rgba(20, 87, 230, 0.45); transform: translateY(-1px); }
    .contact-page .workroomly-site-header.navbar.scrolled { background: rgba(5, 13, 31, 0.92) !important; border-bottom-color: rgba(255, 255, 255, 0.08); box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25); }
    @media (max-width: 991.98px) {
        .contact-page .workroomly-site-header .navbar-collapse { border: 1px solid rgba(255, 255, 255, 0.08); background: rgba(10, 18, 42, 0.95); box-shadow: 0 20px 48px rgba(0, 0, 0, 0.3); }
    }

    /* Careers page — dark header */
    .careers-page .workroomly-site-header.navbar::before { background: transparent; }
    .careers-page .workroomly-site-header .navbar-brand img { filter: brightness(0) invert(1); }
    .careers-page .workroomly-site-header .navbar-toggler { border-color: rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.06); }
    .careers-page .workroomly-site-header .navbar-toggler-icon { filter: invert(1); }
    .careers-page .workroomly-site-header .nav-link { color: rgba(255, 255, 255, 0.75); }
    .careers-page .workroomly-site-header .nav-link:hover,
    .careers-page .workroomly-site-header .nav-link:focus { color: #ffffff; }
    .careers-page .workroomly-site-header .platform-caret { color: rgba(255, 255, 255, 0.4); }
    .careers-page .workroomly-site-header .navbar-cta .btn-outline-primary { color: rgba(255, 255, 255, 0.85); border-color: rgba(255, 255, 255, 0.18); background: rgba(255, 255, 255, 0.04); }
    .careers-page .workroomly-site-header .navbar-cta .btn-primary { background: #1457e6; border: none; color: #ffffff; box-shadow: 0 2px 12px rgba(20, 87, 230, 0.3); }
    .careers-page .workroomly-site-header.navbar.scrolled { background: rgba(5, 13, 31, 0.92) !important; }
    @media (max-width: 991.98px) {
        .careers-page .workroomly-site-header .navbar-collapse { border: 1px solid rgba(255, 255, 255, 0.08); background: rgba(10, 18, 42, 0.95); box-shadow: 0 20px 48px rgba(0, 0, 0, 0.3); }
    }