/* Lighter navy surfaces shared by the public site and business portals. */
:root {
    --soft-blue-start: #234777;
    --soft-blue-end: #345d91;
    --soft-blue-panel: #203f6b;
    --soft-blue-field: #2e5282;
    --soft-blue-accent: #b4edf4;
}

.top, .hero, .dark, .pagehero, .quote,
.tw-project-showcase, .tw-journey, .client-universe,
.tw-quotation-section, .tw-about-hero, .tw-cta,
.tw-service-hero, .tw-service-cta, .tw-careers-hero,
.privacy-hero, .privacy-help, .privacy-contact,
.svc-hero, .svc-foundation, .svc-cta,
.tw-featured-service, .tw-connected-outcome, .tw-social-content,
footer.nexus-footer, footer {
    background: linear-gradient(125deg, var(--soft-blue-start), var(--soft-blue-end)) !important;
}

.sidebar, .crm-nav, .navbar-dark {
    background: var(--soft-blue-start) !important;
}

.code, .quote form,
.tw-core, .svc-core, .tw-service-visual,
.tw-service-visual-body, .tw-service-visual-fallback,
.tw-timeline-card, .tw-timeline-marker span, .tw-journey-footer,
.client-logo-stream, .client-logo-card, .client-universe-cta,
.tw-quotation-form, .nexus-process-panel {
    background: var(--soft-blue-panel) !important;
    border-color: rgba(221, 233, 242, .25);
}

.tw-quotation-form input, .tw-quotation-form select,
.tw-quotation-form textarea, .tw-file-display {
    background: var(--soft-blue-field) !important;
    border-color: #7899c2 !important;
    color: #fff !important;
}

.tw-quotation-form input::placeholder,
.tw-quotation-form textarea::placeholder {
    color: #edf3f7;
}

.tw-quotation-form select option {
    color: #233654;
    background: #fff;
}

.tw-quotation-form :is(input, select, textarea):focus {
    background: #345d91 !important;
    border-color: var(--soft-blue-accent) !important;
    box-shadow: 0 0 0 3px rgba(180, 237, 244, .2);
}

.tw-quotation-intro h2 span, .tw-quotation-index span,
.tw-quotation-benefits > div > span, .tw-quote-form-header span,
.tw-journey-kicker, .client-universe-kicker,
.client-stream-top strong, .client-universe-cta-label,
.tw-timeline-content > span, .tw-journey-footer small {
    color: var(--soft-blue-accent) !important;
}

/* Match the marquee fades to the surrounding lighter section. */
.client-marquee::before, .client-marquee-fade-left {
    background: linear-gradient(to right, var(--soft-blue-panel), transparent) !important;
}

.client-marquee::after, .client-marquee-fade-right {
    background: linear-gradient(to left, var(--soft-blue-panel), transparent) !important;
}

.sidebar a:hover {
    background: #345d91;
}

/* Staff sign-in keeps its light card on the same lighter navy backdrop. */
body:has(.login-card) {
    background: linear-gradient(125deg, var(--soft-blue-start), var(--soft-blue-end)) !important;
}

/* Pure white typography on navy surfaces, including code and secondary labels. */
:root :is(.top, .hero, .dark, .pagehero, .quote, .code,
    .tw-topbar, .tw-project-showcase, .tw-journey,
    .client-universe, .tw-quotation-section, .tw-about-hero, .tw-cta,
    .tw-service-hero, .tw-service-cta, .tw-careers-hero,
    .privacy-hero, .privacy-help, .privacy-contact,
    .svc-hero, .svc-foundation, .svc-cta, .svc-core,
    .tw-core, .tw-featured-service, .tw-connected-outcome,
    .tw-social-content, .tw-floating-note, .tw-image-code,
    .tw-value-card:hover, .svc-card:hover,
    footer, .sidebar, .crm-nav, .navbar-dark) {
    color: #fff !important;
}

:root :is(.top, .hero, .dark, .pagehero, .quote, .code,
    .tw-topbar, .tw-project-showcase, .tw-journey,
    .client-universe, .tw-quotation-section, .tw-about-hero, .tw-cta,
    .tw-service-hero, .tw-service-cta, .tw-careers-hero,
    .privacy-hero, .privacy-help, .privacy-contact,
    .svc-hero, .svc-foundation, .svc-cta, .svc-core,
    .tw-core, .tw-featured-service, .tw-connected-outcome,
    .tw-social-content, .tw-floating-note, .tw-image-code,
    .tw-value-card:hover, .svc-card:hover,
    footer, .sidebar, .crm-nav, .navbar-dark)
    :is(h1, h2, h3, h4, h5, h6, p, div, span, small, strong, b, em,
        a, label, li, pre, code, button, input, select, textarea):not(:where(
        .tw-enquiry-panel, .tw-enquiry-panel *,
        .tw-score-section, .tw-score-section *,
        .tw-achievement-bar, .tw-achievement-bar *,
        .client-logo-media, .client-logo-media *,
        .btn-light, .btn-light *, .white, .white *,
        .tw-connected-outcome > a, .tw-connected-outcome > a *,
        .tech-terminal-top b)) {
    color: #fff !important;
}

.tw-quotation-form input::placeholder,
.tw-quotation-form textarea::placeholder {
    color: #fff !important;
    opacity: 1;
}