.business-dashboard::before {
    z-index: 2;
}

.business-dashboard-layer> :not(.business-dashboard-screenshot) {
    display: none;
}

.business-dashboard-screenshot {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1536 / 767;
    object-fit: cover;
    object-position: top center;
    transition: transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
}

.business-dashboard-layer:hover .business-dashboard-screenshot {
    transform: scale(1.008);
}

.business-whatsapp-widget {
    position: fixed;
    z-index: 60;
    right: 1.25rem;
    bottom: 1.25rem;
    display: inline-flex;
    min-height: 3.25rem;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 999px;
    background: linear-gradient(135deg, #25d366, #159b49);
    box-shadow: 0 18px 40px -18px rgba(4, 85, 35, 0.72);
    padding: 0.75rem 1rem;
    color: #fff;
    font-size: 0.78rem;
    font-weight: 800;
    text-decoration: none;
    transition: transform 180ms ease, box-shadow 180ms ease, filter 180ms ease;
}

.business-whatsapp-logo {
    display: grid;
    width: 1.75rem;
    height: 1.75rem;
    place-items: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.18);
}

.business-whatsapp-logo img {
    display: block;
    width: 1.08rem;
    height: 1.08rem;
}

.business-proof-strip {
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    border-bottom: 1px solid rgba(98, 216, 255, 0.13);
    background:
        radial-gradient(circle at 12% -100%, rgba(43, 130, 255, 0.24), transparent 34rem),
        radial-gradient(circle at 88% 150%, rgba(36, 199, 165, 0.13), transparent 30rem),
        linear-gradient(180deg, #051022, #081a32);
}

.business-proof-strip .business-proof-item {
    position: relative;
    min-height: 5.2rem;
    border: 1px solid rgba(255, 255, 255, 0.085);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.035);
    padding: 0.85rem;
    transition: border-color 200ms ease, background 200ms ease, transform 200ms ease;
}

.business-proof-strip .business-proof-item:hover {
    border-color: rgba(98, 216, 255, 0.24);
    background: rgba(255, 255, 255, 0.06);
    transform: translateY(-3px);
}

.business-proof-strip .business-proof-item p:first-child {
    color: #fff;
}

.business-proof-strip .business-proof-item p:last-child {
    color: rgba(255, 255, 255, 0.5);
}

.business-proof-strip .business-proof-icon {
    border-color: rgba(98, 216, 255, 0.2);
    background: rgba(43, 130, 255, 0.13);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025), 0 14px 26px -20px rgba(43, 130, 255, 0.85);
    color: #62d8ff;
}

.business-whatsapp-widget:hover {
    transform: translateY(-3px);
    box-shadow: 0 24px 50px -18px rgba(4, 85, 35, 0.82);
    filter: saturate(1.08);
}

.business-whatsapp-widget:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 3px;
}

.legal-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at 85% 4%, rgba(43, 130, 255, 0.11), transparent 24rem),
        #f5f8fc;
    color: #263b52;
    font-family: "Instrument Sans", "Segoe UI", Arial, sans-serif;
}

.legal-shell {
    width: min(100% - 2rem, 70rem);
    margin-inline: auto;
}

.legal-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    background: #07172f;
    color: #fff;
}

.legal-header-inner {
    display: flex;
    min-height: 4.75rem;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
}

.legal-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    color: #fff;
    font-size: 1rem;
    font-weight: 800;
    text-decoration: none;
}

.legal-brand-mark {
    display: grid;
    width: 2.5rem;
    height: 2.5rem;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 0.8rem;
    background: linear-gradient(145deg, #2b82ff, #0d4da6);
    color: #fff;
    font-size: 1.15rem;
    font-weight: 900;
}

.legal-nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.65rem 1rem;
    font-size: 0.8rem;
    font-weight: 700;
}

.legal-nav a {
    color: rgba(255, 255, 255, 0.74);
    text-decoration: none;
}

.legal-nav a:hover,
.legal-nav a:focus-visible {
    color: #fff;
}

.legal-hero {
    padding: clamp(4rem, 9vw, 7rem) 0 2.5rem;
}

.legal-kicker {
    color: #2563eb;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.legal-title {
    max-width: 50rem;
    margin: 0.8rem 0 0;
    color: #07172f;
    font-size: clamp(2.5rem, 7vw, 5rem);
    font-weight: 800;
    letter-spacing: -0.055em;
    line-height: 0.98;
}

.legal-lead {
    max-width: 48rem;
    margin-top: 1.4rem;
    color: #5e7186;
    font-size: 1.05rem;
    line-height: 1.8;
}

.legal-updated {
    margin-top: 1rem;
    color: #8494a6;
    font-size: 0.78rem;
}

.legal-notice {
    margin-bottom: 1.25rem;
    border: 1px solid #f1d69a;
    border-radius: 1rem;
    background: #fff8e8;
    padding: 1rem 1.15rem;
    color: #805712;
    font-size: 0.83rem;
    line-height: 1.65;
}

.legal-card {
    margin-bottom: 5rem;
    border: 1px solid #dbe6f1;
    border-radius: 1.5rem;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 28px 70px -54px rgba(7, 23, 47, 0.62);
    padding: clamp(1.35rem, 4vw, 3rem);
}

.legal-card section+section {
    margin-top: 2.2rem;
    padding-top: 2.2rem;
    border-top: 1px solid #e5edf5;
}

.legal-card h2 {
    margin: 0;
    color: #07172f;
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: -0.025em;
}

.legal-card p,
.legal-card li {
    color: #52667b;
    font-size: 0.95rem;
    line-height: 1.8;
}

.legal-card p {
    margin-top: 0.8rem;
}

.legal-card ul {
    margin: 0.8rem 0 0;
    padding-inline-start: 1.25rem;
    list-style: disc;
}

.legal-card a {
    color: #1767d5;
    font-weight: 700;
}

.legal-footer {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    background: #061326;
    color: rgba(255, 255, 255, 0.62);
}

.legal-footer-inner {
    display: flex;
    min-height: 6rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    font-size: 0.78rem;
}

.legal-footer a {
    color: #62d8ff;
    font-weight: 700;
    text-decoration: none;
}

html[dir="rtl"] .legal-kicker {
    letter-spacing: 0;
}

@media (max-width: 640px) {
    .business-whatsapp-widget {
        right: 0.85rem;
        bottom: 0.85rem;
        min-height: 3rem;
        padding: 0.65rem 0.8rem;
    }

    .legal-header-inner,
    .legal-footer-inner {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
        padding-block: 1rem;
    }

    .legal-nav {
        justify-content: flex-start;
    }
}

@media (prefers-reduced-motion: reduce) {

    .business-dashboard-screenshot,
    .business-whatsapp-widget {
        transition: none;
    }
}

/* Mobile composition: compact, aligned layouts for phones and small tablets. */
@media (max-width: 767px) {
    .business-page { --mobile-gutter: clamp(.875rem, 4vw, 1.5rem); }
    .business-page img, .business-page svg { max-width: 100%; }
    .business-shell { width: calc(100% - (var(--mobile-gutter) * 2)); max-width: none; }

    .business-header > .business-shell:first-child { height: 4rem; gap: .75rem; }
    .business-header .business-brand-mark { width: 2.25rem; height: 2.25rem; border-radius: .7rem; }
    .business-header .business-brand-mark svg { width: 1.75rem; height: 1.75rem; }
    .business-brand-title { font-size: .95rem; }
    .business-brand-tagline { margin-top: .2rem; font-size: .5rem; letter-spacing: .14em; }
    .business-menu-button { width: 2.75rem; height: 2.75rem; border-radius: .75rem; }
    .business-mobile-menu nav { max-height: calc(100dvh - 4rem); overflow-y: auto; padding-block: .75rem 1rem; }

    .business-section { padding-block: 2.75rem; }
    .business-heading { font-size: clamp(1.5rem, 7vw, 2rem); line-height: 1.16; letter-spacing: -.035em; }
    .business-copy { font-size: .9rem; line-height: 1.65; }
    .business-kicker { gap: .45rem; font-size: .64rem; letter-spacing: .13em; }
    .business-kicker::before { width: 1.15rem; }
    .business-button { min-height: 2.75rem; border-radius: .75rem; padding: .65rem 1rem; font-size: .82rem; }

    .business-hero { min-height: 0; }
    .business-hero-shell { min-height: 0; gap: 1.5rem; padding-top: 5.25rem; padding-bottom: 2rem; }
    .business-hero-copy > div:first-child { gap: .45rem; padding: .45rem .65rem; font-size: .58rem; letter-spacing: .1em; }
    .business-hero-copy h1 { margin-top: 1rem; font-size: clamp(1.85rem, 9vw, 2.45rem); line-height: 1.08; letter-spacing: -.045em; }
    .business-hero-copy > p { margin-top: .85rem; max-width: 35rem; font-size: .9rem; line-height: 1.55; }
    .business-hero-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin-top: 1.15rem; }
    .business-hero-actions .business-button { width: 100%; padding-inline: .65rem; white-space: nowrap; }
    .business-hero-promises { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem .75rem; margin-top: 1rem; font-size: .7rem; line-height: 1.35; }
    .business-hero-promises > span { min-width: 0; align-items: flex-start; gap: .4rem; }
    .business-hero-promises > span > span { width: 1.1rem; height: 1.1rem; flex: 0 0 auto; }
    .business-hero-media, .business-dashboard-layer { min-height: 0; margin-top: 0; }
    .business-dashboard { border-radius: 1rem; box-shadow: 0 24px 55px -34px rgba(0,0,0,.92); }
    .business-hero-orbit { width: 24rem; top: -14rem; right: -15rem; }

    .business-proof-strip .business-shell { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; padding-block: 1rem; }
    .business-proof-strip .business-proof-item { min-height: 4.25rem; gap: .6rem; border-radius: .8rem; padding: .65rem; }
    .business-proof-strip .business-proof-item:last-child:nth-child(odd) { grid-column: 1 / -1; }
    .business-proof-icon { width: 2rem; height: 2rem; border-radius: .65rem; }
    .business-proof-icon svg { width: 1rem; height: 1rem; }
    .business-proof-item p:first-child { font-size: .72rem; line-height: 1.25; }
    .business-proof-item p:last-child { display: -webkit-box; margin-top: .2rem; overflow: hidden; font-size: .62rem; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

    #journey > .business-shell:first-child, #service-catalog > .business-shell,
    #demo > .business-shell, main > .business-section > .business-shell.grid { gap: 1.75rem; }
    .business-care-photo { aspect-ratio: 1.35; border-radius: 1.15rem; }
    .business-care-photo::before, .business-care-photo-metric { display: none; }
    .business-care-photo-badge { top: .65rem; inset-inline-start: .65rem; padding: .45rem .55rem; font-size: .58rem; }
    .business-care-photo-status { right: .65rem; bottom: .65rem; left: .65rem; border-radius: .75rem; padding: .55rem .65rem; }
    .business-care-photo-status small, .business-care-progress { display: none; }
    #journey .business-heading, main > .business-section .business-heading { margin-top: .85rem; }
    #journey .business-copy, main > .business-section .business-copy { margin-top: .85rem; }
    .business-care-point { gap: .65rem; border-radius: .8rem; padding: .7rem; }
    .business-care-point > span { width: 2rem; height: 2rem; }
    .business-care-point p { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
    #journey > .business-shell.mt-14 { margin-top: 1.75rem; }
    .business-care-journey-panel { border-radius: 1rem; }
    .business-care-journey-head { gap: .55rem; padding: .9rem; }
    .business-care-journey-head h3 { margin-top: .45rem; font-size: 1rem; }
    .business-care-journey-head p { font-size: .7rem; line-height: 1.5; }
    .business-care-journey { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem; padding: .55rem; }
    .business-care-journey-step { border: 1px solid rgba(220,230,241,.82); border-radius: .75rem; background: rgba(255,255,255,.55); padding: .65rem .45rem; }
    .business-care-journey-icon { width: 2.25rem; height: 2.25rem; }
    .business-care-journey-icon svg { width: 1rem; height: 1rem; }
    .business-care-journey-step h4 { margin-top: .5rem; font-size: .66rem; }
    .business-care-journey-step p { display: -webkit-box; margin-top: .25rem; overflow: hidden; font-size: .58rem; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

    #capabilities .business-stagger { gap: .9rem; margin-top: 1.75rem; }
    .business-feature-card { min-height: 0; border-radius: 1rem; }
    .business-feature-card.has-photo .business-feature-visual, .business-feature-visual { min-height: 9rem; }
    .business-feature-icon { top: .75rem; inset-inline-start: .75rem; width: 2.25rem; height: 2.25rem; }
    .business-feature-photo-badge { top: .75rem; inset-inline-end: .75rem; }
    .business-feature-photo-status { bottom: .65rem; inset-inline-start: .75rem; }
    .business-feature-card > .flex-1 { padding: 1rem; }
    .business-feature-card h3 { font-size: 1rem; line-height: 1.3; }
    .business-feature-card h3 + p { display: -webkit-box; margin-top: .45rem; overflow: hidden; font-size: .78rem; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
    .business-feature-card .mt-auto { padding-top: .75rem; }
    .business-feature-tag { padding: .28rem .42rem; font-size: .53rem; }

    .business-catalog-list { gap: .6rem; }
    .business-catalog-list > a { grid-template-columns: 2.5rem minmax(0, 1fr) auto; align-items: center; gap: .7rem; border-radius: .9rem; padding: .75rem; }
    .business-catalog-icon { width: 2.5rem; height: 2.5rem; border-radius: .75rem; }
    .business-catalog-list > a p:last-child { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

    .business-security-grid { gap: .75rem; margin-top: 1.75rem; }
    .business-security-card { min-height: 0; border-radius: 1rem; padding: 1rem; }
    .business-security-card > span { width: 2.25rem; height: 2.25rem; }
    .business-security-card h3 { margin-top: .75rem; font-size: .92rem; }
    .business-security-card p { display: -webkit-box; margin-top: .4rem; overflow: hidden; font-size: .75rem; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }

    .business-cta-band { border-radius: 1rem; padding: 1.5rem 1rem; }
    .business-cta-band > div { gap: 1.1rem; }
    .business-cta-band h2 { margin-top: .65rem; font-size: 1.55rem; line-height: 1.15; }
    .business-cta-band h2 + p { margin-top: .75rem; font-size: .86rem; line-height: 1.55; }
    .business-cta-band .business-button { width: 100%; }
    #deployment .business-stagger { gap: .65rem; margin-top: 1rem; }
    #deployment .business-stagger article { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .2rem .75rem; border-radius: .9rem; padding: .9rem; }
    #deployment .business-stagger article > span { grid-row: 1 / 3; padding-top: .2rem; }
    #deployment .business-stagger h3, #deployment .business-stagger p { margin-top: 0; }

    #demo { padding-block: 2.75rem; }
    #demo h2 { margin-top: .7rem; font-size: clamp(1.7rem, 8vw, 2.2rem); line-height: 1.12; }
    #demo h2 + p { margin-top: .85rem; font-size: .9rem; line-height: 1.6; }
    #demo .business-form-card { border-radius: 1rem; padding: 1rem; }
    #demo form, #demo form > .grid { gap: .8rem; }
    #demo label { margin-bottom: .35rem; }
    .business-field { min-height: 2.875rem; border-radius: .7rem; padding: .65rem .75rem; font-size: .82rem; }
    textarea.business-field { min-height: 5.5rem; }

    footer > .business-shell { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 1rem; padding-block: 2rem; }
    footer > .business-shell > div:first-child, footer > .business-shell > div:last-child { grid-column: 1 / -1; }
    footer > .business-shell > div:first-child p { margin-top: .75rem; }
    footer .mt-4.grid { margin-top: .65rem; gap: .55rem; }
    .business-whatsapp-widget { right: var(--mobile-gutter); bottom: .75rem; width: 2.9rem; min-height: 2.9rem; padding: 0; }
    .business-whatsapp-widget > span:last-child { display: none; }

    .business-reveal { transform: translateY(12px); transition-duration: 420ms; }
    .business-feature-card:hover, .business-security-card:hover,
    .business-journey-step:hover .business-journey-card { transform: translateY(-2px); }
}

@media (max-width: 374px) {
    .business-page { --mobile-gutter: .75rem; }
    .business-brand-tagline { display: none; }
    .business-hero-actions, .business-proof-strip .business-shell { grid-template-columns: 1fr; }
    .business-proof-strip .business-proof-item:last-child:nth-child(odd) { grid-column: auto; }
}

@media (min-width: 480px) and (max-width: 767px) {
    .business-security-grid, #capabilities .business-stagger { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .business-feature-card.has-photo .business-feature-visual, .business-feature-visual { min-height: 8rem; }
    .business-feature-card > .flex-1 { padding: .9rem; }
}

/* Keep the fixed header and hero content visually connected at every width. */
@media (min-width: 1280px) {
    .business-hero-shell { padding-top: 4.25rem; }
}

@media (min-width: 768px) and (max-width: 1279px) {
    .business-hero-shell { padding-top: 3.75rem; }
}

@media (max-width: 767px) {
    .business-hero-shell { padding-top: 5rem; }
}

/* Dark surfaces: keep decorative light blobs quiet and grounded. */
[data-theme="dark"] .business-grid-bg {
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.022) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.022) 1px, transparent 1px);
    background-size: 44px 44px;
}

[data-theme="dark"] .business-care-section,
[data-theme="dark"] .business-journey-section,
[data-theme="dark"] #capabilities,
[data-theme="dark"] #service-catalog {
    background: #081a32;
}

[data-theme="dark"] #service-catalog > .pointer-events-none {
    opacity: 0.22;
}

[data-theme="dark"] #service-catalog > .pointer-events-none.bg-blue-200\/35 {
    background-color: rgba(43, 130, 255, 0.26) !important;
}

[data-theme="dark"] #service-catalog > .pointer-events-none.bg-teal-200\/30 {
    background-color: rgba(36, 199, 165, 0.20) !important;
}

[data-theme="dark"] .business-page .bg-blue-100\/50 {
    background-color: rgba(43, 130, 255, 0.10) !important;
    opacity: 0.45;
}



/* ===== WATEEN THEME SYSTEM ===== */
/*
 * Wateen HMS dark/light theme.
 * Light is the default presentation; the navy/cyan presentation is preserved under data-theme="dark".
 */

:root {
    color-scheme: light;
}

:root[data-theme="light"] {
    color-scheme: light;
}

:root[data-theme="dark"] {
    color-scheme: dark;
}

/* Core palette */
[data-theme="dark"] .business-page {
    --business-navy: #0d2546;
    --business-midnight: #061326;
    --business-blue: #2b82ff;
    --business-cyan: #62d8ff;
    --business-mint: #24c7a5;
    --business-amber: #ffca61;
    --business-paper: #061326;
    --business-line: rgba(255, 255, 255, 0.11);
    --business-muted: rgba(231, 240, 255, 0.66);
    background:
        radial-gradient(circle at 10% 14%, rgba(43, 130, 255, 0.08), transparent 32rem),
        #061326;
    color: #eef4ff;
}

[data-theme="dark"] .business-heading {
    color: #f4f8ff;
}

[data-theme="dark"] .business-copy {
    color: rgba(231, 240, 255, 0.66);
}

[data-theme="dark"] .business-kicker {
    color: #34d7c4;
}

[data-theme="dark"] .business-footer-whatsapp {
    color: #25d366;
}

/* Page canvas / alternating sections */
[data-theme="dark"] section.bg-white,
[data-theme="dark"] section.bg-\[\#f5f8fc\],
[data-theme="dark"] section.bg-\[\#fbfdff\],
[data-theme="dark"] section.bg-\[\#f7fafe\] {
    background-color: #07172f;
}

[data-theme="dark"] section.bg-white:nth-of-type(even),
[data-theme="dark"] section.bg-\[\#f5f8fc\] {
    background-color: #081a32;
}

[data-theme="dark"] .business-care-section {
    background:
        radial-gradient(circle at 14% 75%, rgba(36, 199, 165, 0.11), transparent 28rem),
        radial-gradient(circle at 88% 12%, rgba(43, 130, 255, 0.10), transparent 26rem),
        linear-gradient(180deg, #07172f, #081a32);
}

[data-theme="dark"] .business-journey-section {
    background:
        radial-gradient(circle at 8% 15%, rgba(43, 130, 255, 0.12), transparent 26rem),
        radial-gradient(circle at 92% 85%, rgba(36, 199, 165, 0.10), transparent 25rem),
        #081a32;
}

[data-theme="dark"] #capabilities {
    background:
        radial-gradient(circle at 90% 10%, rgba(43, 130, 255, 0.08), transparent 28rem),
        #07172f;
}

[data-theme="dark"] #service-catalog {
    background:
        radial-gradient(circle at 8% 25%, rgba(36, 199, 165, 0.08), transparent 25rem),
        #081a32;
}

[data-theme="dark"] #deployment {
    background: #07172f;
}

/* Tailwind utility surfaces used throughout the markup */
[data-theme="dark"] .bg-white:not(section),
[data-theme="dark"] .bg-\[\#fbfdff\]:not(section),
[data-theme="dark"] .bg-\[\#f7fafe\]:not(section),
[data-theme="dark"] .bg-slate-50:not(section),
[data-theme="dark"] .bg-slate-100:not(section) {
    background-color: #0d2546;
}

[data-theme="dark"] .bg-slate-50\/70 {
    background-color: rgba(13, 37, 70, 0.78);
}

[data-theme="dark"] .hover\:bg-white:hover,
[data-theme="dark"] .hover\:bg-slate-50:hover {
    background-color: #123052;
}

[data-theme="dark"] .bg-blue-50 {
    background-color: rgba(43, 130, 255, 0.14);
}

[data-theme="dark"] .bg-blue-100 {
    background-color: rgba(43, 130, 255, 0.20);
}

[data-theme="dark"] .bg-blue-200 {
    background-color: rgba(43, 130, 255, 0.30);
}

[data-theme="dark"] .bg-emerald-50 {
    background-color: rgba(36, 199, 165, 0.14);
}

[data-theme="dark"] .bg-emerald-100 {
    background-color: rgba(36, 199, 165, 0.20);
}

[data-theme="dark"] .bg-teal-200 {
    background-color: rgba(36, 199, 165, 0.30);
}

/* Text utilities */
[data-theme="dark"] .text-\[\#07172f\] {
    color: #eef4ff;
}

[data-theme="dark"] .text-slate-900,
[data-theme="dark"] .text-slate-800 {
    color: #f1f6ff;
}

[data-theme="dark"] .text-slate-700 {
    color: rgba(255, 255, 255, 0.84);
}

[data-theme="dark"] .text-slate-600 {
    color: rgba(255, 255, 255, 0.72);
}

[data-theme="dark"] .text-slate-500 {
    color: rgba(255, 255, 255, 0.61);
}

[data-theme="dark"] .text-slate-400 {
    color: rgba(255, 255, 255, 0.48);
}

[data-theme="dark"] .text-blue-600,
[data-theme="dark"] .text-blue-700 {
    color: #62d8ff;
}

[data-theme="dark"] .text-emerald-600,
[data-theme="dark"] .text-emerald-700 {
    color: #34d7b5;
}

/* Borders / rings */
[data-theme="dark"] .border-slate-200 {
    border-color: rgba(255, 255, 255, 0.12);
}

[data-theme="dark"] .border-slate-200\/80 {
    border-color: rgba(255, 255, 255, 0.16);
}

[data-theme="dark"] .border-slate-100 {
    border-color: rgba(255, 255, 255, 0.10);
}

[data-theme="dark"] .ring-slate-200,
[data-theme="dark"] .ring-slate-200\/70 {
    --tw-ring-color: rgba(255, 255, 255, 0.15);
}

[data-theme="dark"] .hover\:border-blue-200:hover {
    border-color: rgba(98, 216, 255, 0.42);
}

/* Header - keep one continuous navy plane in dark mode */
[data-theme="dark"] .business-header,
[data-theme="dark"] .business-header.is-scrolled {
    border-color: rgba(255, 255, 255, 0.10);
    background: rgba(4, 15, 32, 0.90);
    box-shadow: 0 18px 48px -36px rgba(0, 0, 0, 0.95);
    backdrop-filter: blur(18px);
}

[data-theme="dark"] .business-header .business-brand-title,
[data-theme="dark"] .business-header .business-nav-link,
[data-theme="dark"] .business-header .business-header-sign-in {
    color: rgba(255, 255, 255, 0.88);
}

[data-theme="dark"] .business-header .business-brand-tagline {
    color: rgba(255, 255, 255, 0.45);
}

[data-theme="dark"] .business-header.is-scrolled .business-brand-mark {
    background: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .business-header .business-language-switch {
    border-color: rgba(255, 255, 255, 0.15);
    background: rgba(5, 16, 34, 0.46);
}

[data-theme="dark"] .business-header .business-language-switch a {
    color: rgba(255, 255, 255, 0.60);
}

[data-theme="dark"] .business-header .business-language-switch a.is-active {
    background: rgba(255, 255, 255, 0.12);
    box-shadow: none;
    color: #fff;
}

[data-theme="dark"] .business-header .business-menu-button {
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(5, 16, 34, 0.55);
    color: #fff;
}

[data-theme="dark"] .business-nav-link:hover,
[data-theme="dark"] .business-nav-link.is-active {
    color: #fff;
}

[data-theme="dark"] .business-button-primary {
    border: 1px solid rgba(98, 216, 255, 0.16);
    background: #12345a;
    color: #fff;
}

[data-theme="dark"] .business-button-primary:hover {
    background: #17436f;
}

[data-theme="dark"] .business-header .business-button-primary {
    border-color: transparent;
    background: var(--business-amber);
    color: var(--business-midnight);
}

[data-theme="dark"] .business-header .business-button-primary:hover {
    background: #ffd77f;
}

/* Keep the original CTA colors; only trim their vertical size. */
[data-theme="dark"] .business-page .business-button-primary,
[data-theme="dark"] .business-page .business-button-amber {
    min-height: 2.7rem;
}

[data-theme="dark"] .business-header .business-button-primary {
    height: 2.75rem;
    min-height: 2.75rem;
    padding-block: 0;
}

/* Mobile menu */
[data-theme="dark"] .business-mobile-menu {
    border-color: rgba(255, 255, 255, 0.10);
    background: rgba(6, 19, 38, 0.98) !important;
    box-shadow: 0 24px 60px -40px rgba(0, 0, 0, 0.95);
}

[data-theme="dark"] .business-mobile-menu .bg-slate-100 {
    background: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .business-mobile-menu .bg-white {
    background: rgba(255, 255, 255, 0.10);
}

/* Care / patient context cards */
[data-theme="dark"] .business-care-photo {
    border-color: rgba(98, 216, 255, 0.20);
    background: #0b2542;
    box-shadow: 0 34px 80px -52px rgba(0, 0, 0, 0.95);
}

[data-theme="dark"] .business-care-photo-badge,
[data-theme="dark"] .business-care-photo-status,
[data-theme="dark"] .business-care-photo-metric {
    border-color: rgba(255, 255, 255, 0.15);
    background: rgba(6, 25, 48, 0.82);
    color: #eef4ff;
}

[data-theme="dark"] .business-care-photo-metric>span,
[data-theme="dark"] .business-care-point>span {
    background: rgba(36, 199, 165, 0.14);
    color: #34d7b5;
}

[data-theme="dark"] .business-care-photo-metric strong,
[data-theme="dark"] .business-care-photo-status strong {
    color: #f4f8ff;
}

[data-theme="dark"] .business-care-photo-metric small,
[data-theme="dark"] .business-care-photo-status small {
    color: rgba(255, 255, 255, 0.55);
}

/* Simplify the handoff status label so it reads like a practical UI note. */
[data-theme="dark"] .business-care-photo-status {
    border-color: rgba(255, 255, 255, 0.10);
    border-radius: 0.75rem;
    background: #081a32;
    padding: 0.6rem 0.8rem;
    backdrop-filter: none;
}

[data-theme="dark"] .business-care-progress {
    width: 7.2rem;
}

[data-theme="dark"] .business-care-progress i {
    border-color: #0b2542;
}

[data-theme="dark"] .business-care-point,
[data-theme="dark"] .business-care-journey-panel {
    border-color: rgba(255, 255, 255, 0.10);
    background: rgba(13, 37, 70, 0.72);
}

[data-theme="dark"] .business-care-point:hover {
    border-color: rgba(98, 216, 255, 0.30);
    background: rgba(18, 48, 82, 0.92);
}

[data-theme="dark"] .business-care-point h3,
[data-theme="dark"] .business-care-journey-head h3 {
    color: #f3f7ff;
}

[data-theme="dark"] .business-care-point p,
[data-theme="dark"] .business-care-journey-head p,
[data-theme="dark"] .business-care-journey-step p {
    color: rgba(231, 240, 255, 0.60);
}

[data-theme="dark"] .business-care-journey-head {
    border-color: rgba(255, 255, 255, 0.10);
}

[data-theme="dark"] .business-care-journey-step h4 {
    color: #eef4ff;
}

/* Patient journey / dashboard cards */
[data-theme="dark"] .business-journey-board {
    border-color: rgba(255, 255, 255, 0.10);
    background:
        radial-gradient(circle at 88% 14%, rgba(43, 130, 255, 0.10), transparent 20rem),
        #0a1f3a;
    box-shadow: 0 42px 90px -56px rgba(0, 0, 0, 0.95);
}

[data-theme="dark"] .business-journey-board-head,
[data-theme="dark"] .business-journey-board-foot {
    border-color: rgba(255, 255, 255, 0.10);
}

[data-theme="dark"] .business-journey-card {
    border-color: rgba(255, 255, 255, 0.10);
    background: #0d2546;
}

[data-theme="dark"] .business-journey-card h3 {
    color: #f3f7ff;
}

[data-theme="dark"] .business-journey-card p {
    color: rgba(231, 240, 255, 0.60);
}

/* Workflow feature cards */
[data-theme="dark"] .business-feature-card {
    border-color: rgba(255, 255, 255, 0.10);
    background: #0d2546;
    box-shadow: 0 24px 60px -48px rgba(0, 0, 0, 0.95);
}

[data-theme="dark"] .business-feature-card:hover {
    border-color: rgba(98, 216, 255, 0.28);
    box-shadow: 0 34px 70px -46px rgba(0, 0, 0, 0.98);
}

[data-theme="dark"] .business-feature-card.has-photo .business-feature-icon {
    border-color: rgba(98, 216, 255, 0.28);
    background: rgba(13, 37, 70, 0.92);
    color: #62d8ff;
}

[data-theme="dark"] .business-feature-visual {
    border-color: rgba(255, 255, 255, 0.09);
    background:
        radial-gradient(circle at 85% 10%, rgba(43, 130, 255, 0.16), transparent 34%),
        linear-gradient(145deg, #0a1f3a, #0d2546);
}

[data-theme="dark"] .business-mini-window {
    border-color: rgba(255, 255, 255, 0.10);
    background: rgba(8, 27, 52, 0.96);
    box-shadow: 0 18px 42px -30px rgba(0, 0, 0, 0.95);
}

[data-theme="dark"] .business-mini-bar {
    border-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .business-mini-bar i {
    background: rgba(255, 255, 255, 0.22);
}

[data-theme="dark"] .business-token {
    background: rgba(43, 130, 255, 0.16);
    color: #7fc6ff;
}

[data-theme="dark"] .business-bed {
    border-color: rgba(255, 255, 255, 0.13);
    background: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .business-bed::before {
    background: rgba(255, 255, 255, 0.20);
}

[data-theme="dark"] .business-bed.is-occupied {
    border-color: rgba(36, 199, 165, 0.40);
    background: rgba(36, 199, 165, 0.13);
}

[data-theme="dark"] .business-bed.is-cleaning {
    border-color: rgba(255, 202, 97, 0.42);
    background: rgba(255, 202, 97, 0.12);
}

[data-theme="dark"] .business-feature-tag:nth-child(4n + 1) {
    border-color: rgba(98, 166, 255, 0.32);
    background: rgba(43, 130, 255, 0.12);
    color: #8bc5ff;
}

[data-theme="dark"] .business-feature-tag:nth-child(4n + 2) {
    border-color: rgba(36, 199, 165, 0.30);
    background: rgba(36, 199, 165, 0.12);
    color: #59dfc3;
}

[data-theme="dark"] .business-feature-tag:nth-child(4n + 3) {
    border-color: rgba(158, 134, 255, 0.30);
    background: rgba(124, 92, 246, 0.12);
    color: #b9a6ff;
}

[data-theme="dark"] .business-feature-tag:nth-child(4n + 4) {
    border-color: rgba(255, 202, 97, 0.30);
    background: rgba(255, 202, 97, 0.11);
    color: #ffd987;
}

/* Service catalogue and pricing-like cards built with utility classes */
[data-theme="dark"] .business-catalog-list>a {
    border-color: rgba(255, 255, 255, 0.10) !important;
    background: rgba(13, 37, 70, 0.76) !important;
}

[data-theme="dark"] .business-catalog-list>a:hover {
    border-color: rgba(98, 216, 255, 0.28) !important;
    background: #123052 !important;
}

/* Keep dark-only security and demo areas harmonized */
[data-theme="dark"] .business-security-card {
    background: rgba(255, 255, 255, 0.045);
}

[data-theme="dark"] .business-cta-band {
    border: 1px solid rgba(98, 216, 255, 0.14);
    box-shadow: 0 36px 90px -54px rgba(0, 0, 0, 0.95);
}

/* Form notice colours in dark mode */
[data-theme="dark"] [data-demo-notice] {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

/* Theme toggle */
.business-theme-toggle {
    display: inline-flex;
    height: 2.5rem;
    width: 2.5rem;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(5, 16, 34, 0.28);
    color: #fff;
    transition: background 180ms ease, border-color 180ms ease, transform 180ms ease, color 180ms ease;
}

.business-theme-toggle:hover {
    transform: translateY(-2px);
}

.business-header.is-scrolled .business-theme-toggle {
    border-color: #dbe5ef;
    background: #fff;
    color: #07172f;
}

[data-theme="dark"] .business-header.is-scrolled .business-theme-toggle {
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(5, 16, 34, 0.55);
    color: #fff;
}

.business-theme-toggle svg {
    width: 1.08rem;
    height: 1.08rem;
}

.business-mobile-theme-toggle {
    display: inline-flex;
    width: 100%;
    min-height: 2.75rem;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    border: 1px solid #dbe5ef;
    border-radius: 0.75rem;
    background: #f4f7fb;
    color: #526178;
    font-size: 0.78rem;
    font-weight: 800;
}

[data-theme="dark"] .business-mobile-theme-toggle {
    border-color: rgba(255, 255, 255, 0.13);
    background: rgba(255, 255, 255, 0.055);
    color: rgba(255, 255, 255, 0.78);
}

.business-mobile-theme-toggle svg {
    width: 1rem;
    height: 1rem;
}

/* Legal pages */
.legal-theme-toggle {
    display: inline-flex;
    height: 2.35rem;
    width: 2.35rem;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 0.7rem;
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    transition: background 180ms ease, transform 180ms ease;
}

.legal-theme-toggle:hover {
    transform: translateY(-2px);
}

.legal-theme-toggle svg {
    width: 1.05rem;
    height: 1.05rem;
}

[data-theme="light"] .legal-theme-toggle {
    border-color: rgba(255, 255, 255, 0.20);
    background: rgba(255, 255, 255, 0.10);
    color: #fff;
}

[data-theme="dark"] .legal-page {
    background:
        radial-gradient(circle at 85% 4%, rgba(43, 130, 255, 0.16), transparent 24rem),
        #07172f;
    color: rgba(255, 255, 255, 0.78);
}

[data-theme="dark"] .legal-title {
    color: #eef4ff;
}

[data-theme="dark"] .legal-lead {
    color: rgba(255, 255, 255, 0.68);
}

[data-theme="dark"] .legal-updated {
    color: rgba(255, 255, 255, 0.45);
}

[data-theme="dark"] .legal-kicker {
    color: #62d8ff;
}

[data-theme="dark"] .legal-notice {
    border-color: rgba(255, 202, 97, 0.35);
    background: rgba(255, 202, 97, 0.08);
    color: #ffca61;
}

[data-theme="dark"] .legal-card {
    border-color: rgba(255, 255, 255, 0.12);
    background: rgba(13, 37, 70, 0.58);
    box-shadow: 0 28px 70px -54px rgba(0, 0, 0, 0.75);
}

[data-theme="dark"] .legal-card section+section {
    border-top-color: rgba(255, 255, 255, 0.10);
}

[data-theme="dark"] .legal-card h2 {
    color: #eef4ff;
}

[data-theme="dark"] .legal-card p,
[data-theme="dark"] .legal-card li {
    color: rgba(255, 255, 255, 0.68);
}

[data-theme="dark"] .legal-card a {
    color: #62d8ff;
}

[data-theme="dark"] .legal-footer {
    border-color: rgba(255, 255, 255, 0.10);
    color: rgba(255, 255, 255, 0.55);
}

@media (prefers-reduced-motion: reduce) {

    .business-theme-toggle,
    .business-mobile-theme-toggle,
    .legal-theme-toggle {
        transition: none;
    }
}

/* Final dark-surface pass: override utility glow layers after theme rules. */
[data-theme="dark"] .business-care-section,
[data-theme="dark"] .business-journey-section,
[data-theme="dark"] #capabilities,
[data-theme="dark"] #service-catalog {
    background: #081a32 !important;
}

[data-theme="dark"] #service-catalog > .pointer-events-none {
    opacity: 0.18;
}

[data-theme="dark"] #service-catalog > .pointer-events-none.bg-blue-200\/35 {
    background-color: rgba(43, 130, 255, 0.22) !important;
}

[data-theme="dark"] #service-catalog > .pointer-events-none.bg-teal-200\/30 {
    background-color: rgba(36, 199, 165, 0.16) !important;
}

[data-theme="dark"] .business-page .bg-blue-100\/50 {
    background-color: rgba(43, 130, 255, 0.08) !important;
    opacity: 0.4;
}

/* Keep feature-card copy and tags in one compact reading group on larger screens. */
@media (min-width: 1024px) {
    .business-feature-card > .flex-1 {
        padding: 1.35rem 1.5rem 1.15rem;
    }

    .business-feature-card h3 + p {
        margin-top: 0.65rem;
    }

    .business-feature-card .mt-auto {
        margin-top: 1.15rem !important;
        padding-top: 0.1rem;
    }

    #capabilities .business-feature-card {
        height: 27rem;
        min-height: 0;
    }

    #capabilities .business-feature-card > .flex-1 {
        min-height: 0;
        padding-bottom: 1.1rem;
        background: linear-gradient(180deg, #ffffff 0%, #ffffff 62%, #f7fbff 100%);
    }

    #capabilities .business-feature-card .mt-auto {
        margin-top: auto !important;
        padding-top: 0.85rem;
        border-top: 1px solid #e1eaf3;
    }
}

/* The card footer is the single supporting-content treatment; avoid stacked utility rows. */
.business-feature-summary { display: none !important; }

/* Reduce the rounded treatment on primary landing-page surfaces. */
.business-page .business-hero-photo-card,
.business-page .business-dashboard,
.business-page .business-care-photo,
.business-page .business-care-journey-panel,
.business-page .business-feature-card,
.business-page .business-security-card,
.business-page .business-cta-band,
.business-page .business-form-card {
    border-radius: 1rem;
}

.business-page .business-button,
.business-page .business-theme-toggle,
.business-page .business-menu-button,
.business-page .business-field,
.business-page .business-care-point,
.business-page .business-proof-item {
    border-radius: 0.65rem;
}

.business-page .business-feature-tag,
.business-page .business-feature-photo-badge,
.business-page .business-feature-photo-status,
.business-page .business-care-photo-badge,
.business-page .business-care-photo-status {
    border-radius: 0.55rem;
}

/* Demo section photo remains behind the content in dark mode. */
#demo {
    background-image:
        linear-gradient(90deg, rgba(5, 16, 34, 0.98) 0%, rgba(7, 23, 47, 0.92) 46%, rgba(7, 23, 47, 0.78) 100%),
        url("../images/demo-facility-walkthrough.png") !important;
    background-position: center, center right;
    background-size: cover;
}

/* Keep the demo photo behind the content in light mode, with a readable wash. */
[data-theme="light"] #demo,
:root:not([data-theme="dark"]) #demo {
    background-color: #ffffff;
    background-image:
        linear-gradient(90deg, rgba(255, 255, 255, 0.94) 0%, rgba(255, 255, 255, 0.76) 42%, rgba(255, 255, 255, 0.30) 100%),
        url("../images/demo-facility-walkthrough.png") !important;
    background-position: center, 72% center;
    background-size: cover;
    color: #07172f;
}

[data-theme="light"] #demo > .business-grid-bg,
:root:not([data-theme="dark"]) #demo > .business-grid-bg { display: none; }

[data-theme="light"] #demo .business-form-card,
:root:not([data-theme="dark"]) #demo .business-form-card {
    border-color: #dbe5ef;
    background: rgba(247, 250, 253, 0.93);
    box-shadow: 0 24px 60px -44px rgba(7, 23, 47, 0.34);
}

[data-theme="light"] #demo h2,
[data-theme="light"] #demo label,
:root:not([data-theme="dark"]) #demo h2,
:root:not([data-theme="dark"]) #demo label { color: #07172f; }

[data-theme="light"] #demo .business-reveal:first-child p,
[data-theme="light"] #demo .business-reveal:first-child span,
:root:not([data-theme="dark"]) #demo .business-reveal:first-child p,
:root:not([data-theme="dark"]) #demo .business-reveal:first-child span { color: #52667b; }

[data-theme="light"] #demo .business-field,
:root:not([data-theme="dark"]) #demo .business-field {
    border-color: #cbd9e7;
    background: #ffffff;
    color: #07172f;
}

[data-theme="light"] #demo label .font-medium,
[data-theme="light"] #demo form > p:last-child,
:root:not([data-theme="dark"]) #demo label .font-medium,
:root:not([data-theme="dark"]) #demo form > p:last-child { color: #64748b; }

/* Responsive image framing for both photo-backed sections. */
@media (max-width: 1023px) {
    #demo {
        background-position: center, 68% center;
        background-size: cover;
    }

    [data-theme="light"] #demo,
    :root:not([data-theme="dark"]) #demo { background-position: center, 68% center; }

    #security {
        background-image:
            linear-gradient(rgba(4, 16, 35, 0.90), rgba(4, 16, 35, 0.94)),
            url("../images/hero-clinical-team.webp");
        background-position: center, 62% center;
        background-size: cover;
    }
}

/* Light theme security section. */
[data-theme="light"] #security,
:root:not([data-theme="dark"]) #security {
    background: #ffffff;
    color: #07172f;
}

@media (max-width: 1023px) {
    [data-theme="light"] #security,
    :root:not([data-theme="dark"]) #security {
        background-image:
            linear-gradient(rgba(255, 255, 255, 0.84), rgba(255, 255, 255, 0.89)),
            url("../images/hero-clinical-team.webp");
        background-position: center, 62% center;
        background-size: cover;
    }
}

[data-theme="light"] #security::before,
:root:not([data-theme="dark"]) #security::before {
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.55)),
        url("../images/hero-clinical-team.webp") center / cover;
    opacity: 1;
}

[data-theme="light"] #security h2,
[data-theme="light"] #security .business-security-card h3,
:root:not([data-theme="dark"]) #security h2,
:root:not([data-theme="dark"]) #security .business-security-card h3 { color: #07172f; }

[data-theme="light"] #security > .business-shell > .business-reveal > p,
:root:not([data-theme="dark"]) #security > .business-shell > .business-reveal > p { color: #425a70 !important; }

[data-theme="light"] #security .business-security-card,
:root:not([data-theme="dark"]) #security .business-security-card {
    border-color: #dbe5ef;
    background: rgba(247, 250, 253, 0.94);
    box-shadow: 0 18px 40px -30px rgba(7, 23, 47, 0.30);
}

[data-theme="light"] #security .business-security-card p,
:root:not([data-theme="dark"]) #security .business-security-card p { color: #52667b; }

/* Give each service a recognisable accent instead of repeating one blue icon. */
.business-feature-card:nth-child(1) .business-feature-icon { background: rgba(43, 130, 255, 0.18); color: #62b4ff; border-color: rgba(98, 180, 255, 0.36); }
.business-feature-card:nth-child(2) .business-feature-icon { background: rgba(142, 124, 242, 0.18); color: #b9adff; border-color: rgba(185, 173, 255, 0.34); }
.business-feature-card:nth-child(3) .business-feature-icon { background: rgba(36, 199, 165, 0.18); color: #55e0c3; border-color: rgba(85, 224, 195, 0.34); }
.business-feature-card:nth-child(4) .business-feature-icon { background: rgba(255, 202, 97, 0.18); color: #ffd77f; border-color: rgba(255, 215, 127, 0.34); }
.business-feature-card:nth-child(5) .business-feature-icon { background: rgba(98, 216, 255, 0.16); color: #8be5ff; border-color: rgba(139, 229, 255, 0.34); }
.business-feature-card:nth-child(6) .business-feature-icon { background: rgba(224, 112, 155, 0.18); color: #ff9fc4; border-color: rgba(255, 159, 196, 0.34); }

/* Tighter page rhythm: keep sections distinct without leaving oversized voids. */
.business-section {
    padding-block: clamp(4rem, 6vw, 5.5rem);
}

#journey > .business-shell.mt-14,
#capabilities .business-stagger,
#security .business-security-grid {
    margin-top: 2.5rem;
}

#demo {
    padding-block: clamp(3.5rem, 6vw, 5rem) !important;
}

/* Security section: a grounded clinical image with a readable dark wash. */
#security {
    isolation: isolate;
    background-image:
        linear-gradient(90deg, rgba(4, 16, 35, 0.96), rgba(5, 24, 48, 0.88) 48%, rgba(4, 16, 35, 0.94)),
        url("../images/hero-clinical-team.webp");
    background-position: center, center 42%;
    background-size: cover;
}

#security .business-security-card {
    border-color: rgba(255, 255, 255, 0.14);
    background: rgba(7, 25, 49, 0.88);
    box-shadow: 0 18px 40px -30px rgba(0, 0, 0, 0.9);
}

#security .business-security-card p {
    color: rgba(239, 246, 255, 0.70);
}

#security .business-security-card:nth-child(n) { border-color: rgba(255, 255, 255, 0.14); background: rgba(7, 25, 49, 0.88); }
#security .business-security-card:nth-child(2) { border-color: rgba(185, 173, 255, 0.38); background: rgba(35, 32, 78, 0.88); }
#security .business-security-card:nth-child(3) { border-color: rgba(85, 224, 195, 0.38); background: rgba(8, 61, 65, 0.88); }
#security .business-security-card:nth-child(4) { border-color: rgba(255, 215, 127, 0.38); background: rgba(70, 54, 32, 0.86); }
#security .business-security-card:nth-child(5) { border-color: rgba(139, 229, 255, 0.38); background: rgba(10, 48, 68, 0.88); }
#security .business-security-card:nth-child(6) { border-color: rgba(255, 159, 196, 0.34); background: rgba(62, 31, 58, 0.86); }

#security .business-security-card:nth-child(1) > span { background: rgba(43, 130, 255, 0.22); color: #8bd1ff; }
#security .business-security-card:nth-child(2) > span { background: rgba(142, 124, 242, 0.22); color: #c1b8ff; }
#security .business-security-card:nth-child(3) > span { background: rgba(36, 199, 165, 0.22); color: #6de7cb; }
#security .business-security-card:nth-child(4) > span { background: rgba(255, 202, 97, 0.22); color: #ffdc8c; }
#security .business-security-card:nth-child(5) > span { background: rgba(98, 216, 255, 0.20); color: #9ceaff; }
#security .business-security-card:nth-child(6) > span { background: rgba(224, 112, 155, 0.22); color: #ffb1ce; }

#security .business-security-card:hover {
    background: rgba(20, 53, 84, 0.94);
    transform: translateY(-5px);
}

@media (max-width: 767px) {
    .business-section { padding-block: 2.5rem; }
    #journey > .business-shell.mt-14,
    #capabilities .business-stagger,
    #security .business-security-grid { margin-top: 1.5rem; }
    #demo { padding-block: 2.75rem !important; }
}

/* A small, tactile hover state for each patient-journey step. */
.business-care-journey-step {
    transition: transform 220ms ease;
}

.business-care-journey-icon {
    transition: transform 220ms ease, box-shadow 220ms ease;
}

.business-care-journey-step:hover,
.business-care-journey-step:focus-within {
    transform: translateY(-4px);
}

.business-care-journey-step:hover .business-care-journey-icon,
.business-care-journey-step:focus-within .business-care-journey-icon {
    transform: translateY(-2px) scale(1.06);
    box-shadow: 0 16px 30px -16px var(--journey-accent);
}

/* Keep the four security cards neutral and consistent. */
#security .business-security-card:nth-child(n) {
    border-color: rgba(255, 255, 255, 0.14);
    background: rgba(7, 25, 49, 0.88);
}

#security .business-security-card:nth-child(n) > span {
    background: rgba(98, 216, 255, 0.10);
    color: #62d8ff;
}

/* Professional card proportions on larger screens: less empty height, same breathing room. */
@media (min-width: 768px) {
    #deployment .business-cta-band {
        padding-block: 3rem !important;
    }

    .business-feature-card { min-height: 24rem; }
    .business-security-card { min-height: 10rem; }
    .business-journey-card { min-height: 13rem; }
}

/* Security redesign: solid reading canvas with the clinical photo kept to one side. */
@media (min-width: 1024px) {
    #security {
        position: relative;
        overflow: hidden;
        background: #061326;
    }

    #security::before {
        position: absolute;
        z-index: 0;
        top: 0;
        right: 0;
        bottom: 0;
        left: 52%;
        background:
            linear-gradient(90deg, #061326 0%, rgba(6, 19, 38, 0.76) 24%, rgba(6, 19, 38, 0.28) 100%),
            url("../images/hero-clinical-team.webp") center / cover;
        content: '';
        opacity: 0.9;
    }

    #security > .business-shell {
        position: relative;
        z-index: 1;
    }

    #security .business-security-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 0.85rem;
    }

    #security .business-security-card {
        min-height: 11rem;
        padding: 1.2rem;
        border-radius: 1rem;
        background: rgba(7, 25, 49, 0.92);
    }
}

/* Match the header CTA to the theme toggle exactly. */
.business-header .business-button-primary {
    height: 2.5rem !important;
    min-height: 2.5rem !important;
    padding-block: 0 !important;
}

[data-theme="dark"] #capabilities .business-feature-card > .flex-1 {
    background: linear-gradient(180deg, #0d2546 0%, #0d2546 62%, #0b203d 100%);
}

[data-theme="dark"] #capabilities .business-feature-card .mt-auto {
    border-top-color: rgba(255, 255, 255, 0.10);
}

.business-feature-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
    margin-top: 1rem;
    padding-block: 0.7rem;
    border-block: 1px solid #e1eaf3;
    color: #526f8d;
    font-size: 0.62rem;
    font-weight: 700;
    line-height: 1.35;
}

.business-feature-summary span {
    position: relative;
    padding-inline-start: 0.7rem;
}

.business-feature-summary span::before {
    position: absolute;
    top: 0.38rem;
    inset-inline-start: 0;
    width: 0.28rem;
    height: 0.28rem;
    border-radius: 50%;
    background: #2b82ff;
    content: '';
}

[data-theme="dark"] .business-feature-summary {
    border-color: rgba(255, 255, 255, 0.10);
    color: rgba(231, 240, 255, 0.68);
}

/* Align the three workflow cues into a calm, evenly weighted utility row. */
.business-feature-summary {
    border-block: 0;
    align-items: stretch;
    padding-block: 0.7rem;
}

.business-feature-summary span {
    display: flex;
    min-height: 2.1rem;
    align-items: center;
    padding-inline: 0.8rem;
}

.business-feature-summary span + span {
    border-inline-start: 1px solid #e1eaf3;
}

[data-theme="dark"] .business-feature-summary span + span {
    border-inline-start-color: rgba(255, 255, 255, 0.10);
}

@media (max-width: 767px) {
    .business-feature-summary {
        grid-template-columns: 1fr;
        gap: 0.35rem;
        margin-top: 0.75rem;
        padding-block: 0.55rem;
        font-size: 0.6rem;
    }

    .business-feature-summary span + span { border-inline-start: 0; }
}

/* Shorter deployment callout and a proper light-theme surface. */
#deployment { padding-block: clamp(2.75rem, 4vw, 3.75rem); }
#deployment .business-cta-band { padding: 2rem 2.5rem !important; }
#deployment .business-cta-band > div { gap: 2rem; }
#deployment .business-cta-band h2 { font-size: clamp(1.65rem, 3.1vw, 2.35rem); line-height: 1.15; }
#deployment .business-cta-band h2 + p { margin-top: .8rem; font-size: .97rem; line-height: 1.55; }
:root:not([data-theme="dark"]) #deployment .business-cta-band {
    border: 1px solid #c8e1e9;
    background: linear-gradient(115deg, #f3f9fc 0%, #e5f3f4 100%);
    color: #0b2940;
    box-shadow: 0 18px 42px -34px rgba(16, 67, 91, .28);
}
:root:not([data-theme="dark"]) #deployment .business-cta-band > div > div > p:first-child { color: #087b8a; }
:root:not([data-theme="dark"]) #deployment .business-cta-band h2 + p { color: #4a6475; }

/* Distinct, readable CTA colors across themes. */
:root:not([data-theme="dark"]) .business-page .business-button-primary { border: 1px solid #1761a2; background: #206eb5; color: #fff; box-shadow: 0 12px 25px -18px rgba(28,99,169,.62); }
:root:not([data-theme="dark"]) .business-page .business-button-primary:hover { background: #185d9d; }
:root:not([data-theme="dark"]) .business-header .business-button-primary {
    border-color: transparent;
    background: #efb947;
    color: #10243a;
    box-shadow: 0 12px 26px -18px rgba(176, 114, 18, .48);
}
:root:not([data-theme="dark"]) .business-header .business-button-primary:hover { background: #e5a931; }
:root:not([data-theme="dark"]) .business-page .business-button-amber { background: #efb947; color: #10243a; box-shadow: 0 12px 26px -18px rgba(176,114,18,.48); }
:root:not([data-theme="dark"]) .business-page .business-button-amber:hover { background: #e5a931; }
:root:not([data-theme="dark"]) #deployment .business-button-amber,
:root:not([data-theme="dark"]) #service-catalog .business-button-primary { border-color: #08766f; background: #0c827b; color: #fff; }
:root:not([data-theme="dark"]) #deployment .business-button-amber:hover,
:root:not([data-theme="dark"]) #service-catalog .business-button-primary:hover { background: #086e68; }
[data-theme="dark"] .business-page .business-button-primary { background: #1d567f; color: #fff; }
[data-theme="dark"] .business-page .business-button-primary:hover { background: #246b9b; }
[data-theme="dark"] .business-header .business-button-primary { background: var(--business-amber); color: var(--business-midnight); }
[data-theme="dark"] .business-header .business-button-primary:hover { background: #ffd77f; }
[data-theme="dark"] #service-catalog .business-button-primary { background: #116e75; color: #fff; }
[data-theme="dark"] #service-catalog .business-button-primary:hover { background: #16818a; }
.business-page .business-button:focus-visible { outline: 3px solid #54bce8; outline-offset: 3px; }

@media (max-width: 1023px) {
    .business-journey-card { min-height: 0; height: auto; }
}
@media (max-width: 767px) {
    #deployment { padding-block: 2.5rem; }
    #deployment .business-cta-band { padding: 1.3rem 1.1rem !important; }
    #deployment .business-cta-band > div { gap: 1rem; }
    #deployment .business-cta-band h2 { margin-top: .5rem; font-size: clamp(1.45rem, 6.4vw, 1.8rem); }
    #deployment .business-cta-band h2 + p { margin-top: .6rem; font-size: .82rem; line-height: 1.5; }
    .business-record-section .business-shell { gap: 1.35rem !important; }
    .business-record-points { margin-top: 1.1rem; gap: .55rem; }
    .business-record-point { align-items: flex-start; gap: .65rem; border-radius: .8rem; padding: .7rem .8rem; }
    .business-record-point > span { width: 1.8rem; height: 1.8rem; border-radius: .55rem; }
    .business-record-point > div { min-width: 0; }
    .business-record-point p:first-child { font-size: .83rem; line-height: 1.3; }
    .business-record-point p + p { margin-top: .2rem; font-size: .73rem; line-height: 1.45; }
    .business-journey-card { padding: .8rem; }
    #deployment .business-stagger article { padding: .75rem .8rem; }
    #deployment .business-stagger article h3 { font-size: .87rem; line-height: 1.3; }
    #deployment .business-stagger article p { font-size: .75rem; line-height: 1.45; }
}
@media (max-width: 479px) {
    #capabilities .business-feature-visual { min-height: 8rem; }
}

/* Mobile journey tiles must stay dark when the page switches themes. */
@media (max-width: 767px) {
    [data-theme="dark"] #journey .business-care-journey-step {
        border-color: rgba(145, 186, 216, .26);
        background: #183452;
    }
    [data-theme="dark"] #journey .business-care-journey-step:hover,
    [data-theme="dark"] #journey .business-care-journey-step:focus-within { background: #1d3d5d; }
    [data-theme="dark"] #journey .business-care-journey-step h4 { color: #fff; }
    [data-theme="dark"] #journey .business-care-journey-step p { color: #cfdeed; }
}

/* Security controls: compact reading cards on phones and small tablets. */
@media (max-width: 1023px) {
    #security .business-security-grid { gap: .65rem; }
    #security .business-security-card { min-height: 0; }
}
@media (max-width: 767px) {
    #security .business-security-grid { margin-top: 1.1rem; gap: .55rem; }
    #security .business-security-card {
        display: grid;
        grid-template-columns: 1.7rem minmax(0, 1fr);
        align-content: start;
        align-items: center;
        gap: .3rem .65rem;
        padding: .7rem .8rem;
        border-radius: .8rem;
    }
    #security .business-security-card::after { display: none; }
    #security .business-security-card > span { grid-column: 1; width: 1.7rem; height: 1.7rem; border-radius: .5rem; }
    #security .business-security-card > span svg { width: .9rem; height: .9rem; }
    #security .business-security-card h3 { grid-column: 2; margin: 0; font-size: .84rem; line-height: 1.28; }
    #security .business-security-card p {
        grid-column: 1 / -1;
        display: block;
        margin: 0;
        overflow: visible;
        font-size: .72rem;
        line-height: 1.45;
        -webkit-line-clamp: unset;
    }
}
@media (min-width: 768px) and (max-width: 1023px) {
    #security .business-security-card { padding: 1rem; }
    #security .business-security-card h3 { margin-top: .75rem; }
    #security .business-security-card p { margin-top: .35rem; }
}

/* Native form controls must follow the active theme, including open select menus. */
:root:not([data-theme="dark"]) #demo .business-field { color-scheme: light; }
:root:not([data-theme="dark"]) #demo .business-field::placeholder { color: #70849a; opacity: 1; }
:root:not([data-theme="dark"]) #demo .business-field:focus {
    border-color: #4c96df;
    background: #fff;
    box-shadow: none;
}
:root:not([data-theme="dark"]) #demo .business-field option { background: #fff; color: #07172f; }
:root:not([data-theme="dark"]) #demo .business-field option:disabled { color: #64748b; }
[data-theme="dark"] #demo .business-field { color-scheme: dark; }
[data-theme="dark"] #demo .business-field:focus { box-shadow: none; }
[data-theme="dark"] #demo .business-field::placeholder { color: rgba(231, 240, 255, .56); opacity: 1; }
[data-theme="dark"] #demo .business-field option { background: #0d2546; color: #f3f7ff; }
[data-theme="dark"] #demo .business-field option:disabled { color: #a7bad0; }

/* Catalogue rows: keep the content column usable on narrow screens. */
@media (max-width: 767px) {
    #service-catalog .business-catalog-panel { padding: .8rem; border-radius: .85rem; }
    #service-catalog .business-catalog-panel > div:first-child { gap: .5rem; padding-bottom: .7rem; }
    #service-catalog .business-catalog-panel > div:first-child p { margin-top: .35rem; font-size: 1rem; }
    #service-catalog .business-catalog-panel > div:first-child > span:last-child { display: none; }
    #service-catalog .business-catalog-list { margin-top: .75rem; gap: .5rem; }
    #service-catalog .business-catalog-list > a {
        grid-template-columns: 2rem minmax(0, 1fr) 1rem;
        align-items: center;
        gap: .55rem;
        padding: .65rem;
        border-radius: .7rem;
    }
    #service-catalog .business-catalog-icon { width: 2rem; height: 2rem; border-radius: .55rem; }
    #service-catalog .business-catalog-icon svg { width: .95rem; height: .95rem; }
    #service-catalog .business-catalog-list > a > span:nth-child(2) { min-width: 0; }
    #service-catalog .business-catalog-list > a > span:nth-child(2) > span:first-child { font-size: .83rem; line-height: 1.3; }
    #service-catalog .business-catalog-list > a > span:nth-child(2) > span:nth-child(2) { margin-top: .2rem; font-size: .75rem; line-height: 1.4; }
    #service-catalog .business-catalog-list > a > span:nth-child(2) > span:last-child { display: none; }
    #service-catalog .business-catalog-list > a > span:last-child { justify-self: end; }
    #service-catalog .business-catalog-list > a > span:last-child > span { font-size: 0; }
    #service-catalog .business-catalog-list > a > span:last-child > span::after { content: "↗"; font-size: 1rem; line-height: 1; }
    #service-catalog .business-catalog-panel > div:last-child { margin-top: .7rem; gap: .4rem; padding: .7rem; }
}

/* Keep one usable navigation mode at every viewport width. */
@media (max-width: 1279px) {
    .business-header .business-desktop-nav,
    .business-header .business-header-actions { display: none !important; }
    .business-header .business-menu-button { display: grid !important; }
    .business-header .business-mobile-menu { display: block !important; }
    .business-header .business-mobile-menu .business-shell {
        height: auto;
        max-height: calc(100dvh - 4.65rem);
        overflow-y: auto;
    }
}
@media (min-width: 1280px) {
    .business-header .business-desktop-nav,
    .business-header .business-header-actions { display: flex !important; }
    .business-header .business-menu-button,
    .business-header .business-mobile-menu { display: none !important; }
}