:root {
    --bg: #0B1D36;
    --bg-soft: #10233f;
    --card: rgba(255,255,255,.06);
    --card-border: rgba(148,163,184,.20);
    --text: #f8fafc;
    --muted: #94A3B8;
    --slate: #475569;
    --brand-primary: #14B8A6;
    --brand-secondary: #2563EB;
    --brand-primary-soft: rgba(20,184,166,.16);
    --gold: var(--brand-primary);
    --gold-soft: var(--brand-primary-soft);
    --line: rgba(148,163,184,.16);
    --radius: 28px;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: var(--bg);
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    overflow-x: hidden;
}

    body::before {
        content: "";
        position: fixed;
        inset: 0;
        pointer-events: none;
        background: radial-gradient(circle at 20% 10%, rgba(20,184,166,.18), transparent 28%), radial-gradient(circle at 82% 6%, rgba(37,99,235,.20), transparent 26%), linear-gradient(180deg, #0B1D36 0%, #10233f 42%, #071427 100%);
        z-index: -2;
    }

.noise {
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: .045;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
    z-index: -1;
}

.navbar {
    backdrop-filter: blur(18px);
    background: rgba(5,7,11,.78);
    border-bottom: 1px solid var(--line);
}

.navbar-brand,
.nav-link {
    color: var(--text) !important;
}

.nav-link {
    color: var(--muted) !important;
    font-size: .95rem;
    white-space: nowrap;
}

    .nav-link:hover {
        color: var(--text) !important;
    }

.navbar .nav-link.active,
.navbar .nav-link.show {
    color: var(--text) !important;
}

.landing-header__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.landing-header__languages {
    display: flex;
    align-items: center;
    gap: 4px;
}

@media (min-width: 992px) {
    .navbar .navbar-nav {
        flex-wrap: nowrap;
    }

    .navbar .navbar-collapse > .d-flex {
        flex-wrap: nowrap !important;
    }

    .navbar .nav-link {
        font-size: .86rem;
        padding-left: .35rem;
        padding-right: .35rem;
    }

    .navbar .btn {
        padding: .62rem .95rem;
    }
}

@media (max-width: 1199.98px) {
    .landing-header__actions {
        justify-content: flex-start;
        margin-top: 12px;
    }

    .navbar .dropdown-menu {
        margin: 4px 0 10px;
    }
}

.text-gold {
    color: var(--gold) !important;
}

.brand-mark {
    width: 38px;
    height: 38px;
    border-radius: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #0B1D36;
    border: 1px solid rgba(94,234,212,.25);
    box-shadow: 0 16px 36px rgba(37,99,235,.22);
    overflow: hidden;
}

.brand-mark img {
    width: 100%;
    height: 100%;
    display: block;
}

.brand-lockup {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    line-height: 1;
}

.brand-word {
    font-size: 1.34rem;
    font-weight: 820;
    letter-spacing: .01em;
}

.brand-tagline {
    margin-top: .26rem;
    color: var(--muted);
    font-size: .57rem;
    font-weight: 700;
    letter-spacing: .19em;
    text-transform: uppercase;
}

.btn-gold {
    background: linear-gradient(135deg, #5EEAD4, #14B8A6, #2563EB);
    color: #fff;
    border: 0;
    font-weight: 700;
    border-radius: 999px;
    padding: .85rem 1.25rem;
    box-shadow: 0 18px 48px rgba(20,184,166,.22);
    white-space: nowrap;
}

    .btn-gold:hover {
        color: #fff;
        filter: brightness(1.05);
    }

.btn-ghost {
    border: 1px solid rgba(255,255,255,.16);
    color: var(--text);
    border-radius: 999px;
    padding: .85rem 1.25rem;
    background: rgba(255,255,255,.04);
    white-space: nowrap;
}

    .btn-ghost:hover {
        color: var(--text);
        background: rgba(255,255,255,.08);
    }

.section {
    padding: 110px 0;
    scroll-margin-top: 86px;
}

.section-tight {
    padding: 78px 0;
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .42rem .75rem;
    border: 1px solid rgba(20,184,166,.28);
    border-radius: 999px;
    background: var(--gold-soft);
    color: #ffe8a3;
    font-size: .86rem;
    margin-bottom: 1.1rem;
}

.hero {
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding-top: 110px;
}

.placeholder-page {
    min-height: 100vh;
}

.docs-page {
    background:
        radial-gradient(circle at 18% 0%, rgba(20,184,166,.12), transparent 28%),
        radial-gradient(circle at 82% 12%, rgba(56,189,248,.10), transparent 30%),
        #070b12;
    color: #f8fafc;
}

.docs-hero {
    padding: 154px 0 82px;
    border-bottom: 1px solid var(--line);
    background:
        linear-gradient(135deg, rgba(8,12,20,.72), rgba(15,23,42,.42)),
        radial-gradient(circle at 74% 26%, rgba(20,184,166,.12), transparent 28%);
}

.docs-hero__content {
    max-width: 900px;
}

.docs-hero h1,
.docs-page-title h1 {
    margin: 18px 0 0;
    font-size: clamp(2.5rem, 5vw, 5.2rem);
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0;
}

.docs-hero p,
.docs-page-title p {
    margin: 22px 0 0;
    max-width: 820px;
    color: var(--muted);
    font-size: clamp(1.05rem, 1.7vw, 1.35rem);
    line-height: 1.75;
}

.docs-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 30px;
}

.docs-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: .48rem .72rem;
    border: 1px solid rgba(20,184,166,.38);
    border-radius: 999px;
    background: rgba(20,184,166,.12);
    color: #f8d766;
    font-weight: 850;
    font-size: .82rem;
}

.docs-main {
    padding: 84px 0 110px;
}

.docs-main--with-hero {
    padding-top: 128px;
}

.docs-shell {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 50px;
    align-items: start;
}

.docs-sidebar {
    position: sticky;
    top: 98px;
    display: grid;
    gap: 6px;
    padding: 18px;
    border: 1px solid var(--card-border);
    border-radius: 22px;
    background: rgba(255,255,255,.045);
    box-shadow: 0 18px 52px rgba(0,0,0,.22);
}

.docs-sidebar strong {
    display: block;
    margin-bottom: 8px;
    color: #fff;
    font-size: .9rem;
}

.docs-sidebar a {
    display: block;
    padding: .72rem .82rem;
    border-radius: 14px;
    color: var(--muted);
    text-decoration: none;
    font-weight: 750;
    font-size: .92rem;
}

.docs-sidebar a:hover,
.docs-sidebar a.active {
    color: #fff;
    background: rgba(20,184,166,.13);
}

.docs-content {
    max-width: 930px;
    min-width: 0;
}

.docs-page-title {
    padding-bottom: 34px;
    margin-bottom: 36px;
    border-bottom: 1px solid var(--line);
}

.docs-section {
    scroll-margin-top: 110px;
    margin-bottom: 52px;
}

.docs-section h2 {
    margin: 0 0 18px;
    font-size: clamp(1.65rem, 3vw, 2.55rem);
    line-height: 1.12;
    font-weight: 900;
    letter-spacing: 0;
}

.docs-section h3 {
    margin-top: 18px;
    font-size: 1.05rem;
    font-weight: 850;
}

.docs-section p,
.docs-section li {
    color: var(--muted);
    line-height: 1.75;
}

.docs-step-list {
    display: grid;
    gap: 12px;
    padding-left: 1.2rem;
}

[dir="rtl"] .docs-step-list {
    padding-right: 1.2rem;
    padding-left: 0;
}

[dir="rtl"] .docs-code,
[dir="rtl"] .docs-code code,
[dir="rtl"] .docs-table code,
[dir="rtl"] .docs-chip-grid code,
[dir="rtl"] pre,
[dir="rtl"] code {
    direction: ltr;
    text-align: left;
    unicode-bidi: isolate;
}

.docs-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.docs-card-grid--compact {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.docs-card,
.docs-card-static,
.docs-callout,
.docs-release,
.docs-endpoint {
    border: 1px solid var(--card-border);
    border-radius: 20px;
    background: rgba(255,255,255,.045);
    box-shadow: 0 16px 48px rgba(0,0,0,.18);
}

.docs-card {
    display: block;
    min-height: 210px;
    padding: 24px;
    color: inherit;
    text-decoration: none;
}

.docs-card:hover {
    color: inherit;
    border-color: rgba(20,184,166,.36);
    transform: translateY(-2px);
}

.docs-card i {
    display: inline-flex;
    width: 48px;
    height: 48px;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    border-radius: 16px;
    color: var(--gold);
    background: rgba(20,184,166,.12);
}

.docs-card h3 {
    margin: 0 0 10px;
    color: #fff;
    font-size: 1.08rem;
}

.docs-card p {
    margin: 0;
    color: var(--muted);
    line-height: 1.65;
}

.docs-card-static {
    padding: 16px;
    color: #f8fafc;
    font-weight: 850;
}

.docs-code {
    overflow-x: auto;
    margin: 16px 0 0;
    padding: 18px;
    border: 1px solid rgba(148,163,184,.22);
    border-radius: 16px;
    background: #0b1220;
    color: #e5e7eb;
    direction: ltr;
    text-align: left;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

.docs-code code {
    color: #e5e7eb;
    direction: ltr;
    text-align: left;
    white-space: pre;
    font-size: .92rem;
    line-height: 1.7;
}

.docs-callout {
    padding: 20px 22px;
    margin-top: 18px;
}

.docs-callout strong {
    display: block;
    margin-bottom: 8px;
    color: #fff;
}

.docs-callout p {
    margin: 0;
}

.docs-callout--info {
    border-color: rgba(56,189,248,.32);
    background: rgba(56,189,248,.08);
}

.docs-callout--warning,
.docs-callout--preview {
    border-color: rgba(20,184,166,.34);
    background: rgba(20,184,166,.09);
}

.docs-endpoint {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 12px 0;
    padding: 14px 16px;
}

.docs-method {
    display: inline-flex;
    min-width: 58px;
    justify-content: center;
    padding: .34rem .52rem;
    border-radius: 10px;
    color: #06111f;
    font-weight: 900;
    font-size: .8rem;
}

.docs-method--get {
    background: #7dd3fc;
}

.docs-method--post {
    background: #f8d766;
}

.docs-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--card-border);
    border-radius: 18px;
}

.docs-table {
    width: 100%;
    min-width: 640px;
    border-collapse: collapse;
}

.docs-table th,
.docs-table td {
    padding: 15px 16px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    color: var(--muted);
    vertical-align: top;
}

.docs-table th {
    color: #fff;
    font-weight: 850;
    background: rgba(255,255,255,.045);
}

.docs-table tr:last-child td {
    border-bottom: 0;
}

.docs-table code,
.docs-chip-grid code,
.docs-chip-grid span {
    color: #f8fafc;
}

.dev-docs-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 420px);
    gap: 42px;
    align-items: end;
}

.dev-docs-action-panel {
    display: grid;
    gap: 10px;
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    padding: 18px;
    background:
        radial-gradient(circle at 86% 0%, rgba(20,184,166,.12), transparent 30%),
        var(--card);
    box-shadow: 0 24px 76px rgba(0,0,0,.28);
}

.dev-docs-action-panel a {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 48px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 16px;
    padding: 12px 14px;
    color: #f8fafc;
    text-decoration: none;
    font-weight: 800;
    background: rgba(255,255,255,.055);
}

.dev-docs-action-panel a:hover {
    border-color: rgba(20,184,166,.40);
    color: #fff;
}

.dev-docs-action-panel i {
    color: var(--gold);
}

.dev-docs-shell {
    grid-template-columns: 300px minmax(0, 1fr);
}

.dev-docs-sidebar {
    max-height: calc(100vh - 118px);
    overflow-y: auto;
}

.dev-docs-sidebar strong:not(:first-child) {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}

.dev-docs-content code {
    color: #f8d766;
}

.dev-docs-flow {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.dev-docs-flow span {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    border: 1px solid rgba(20,184,166,.24);
    border-radius: 999px;
    padding: 9px 13px;
    background: rgba(20,184,166,.09);
    color: #f8fafc;
    font-weight: 800;
}

.dev-docs-endpoint {
    flex-wrap: wrap;
    background:
        radial-gradient(circle at 90% 10%, rgba(20,184,166,.09), transparent 30%),
        rgba(255,255,255,.045);
}

.dev-docs-endpoint > code {
    color: #f8fafc;
    font-weight: 850;
}

.dev-docs-scope {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-inline-start: auto;
    border: 1px solid rgba(125,211,252,.22);
    border-radius: 999px;
    padding: 7px 10px;
    color: #c7d2fe;
    background: rgba(56,189,248,.08);
    font-size: .82rem;
    font-weight: 800;
}

.dev-docs-scope code {
    color: #e0f2fe;
}

.dev-docs-code-wrap {
    position: relative;
}

.dev-docs-copy {
    position: absolute;
    top: 10px;
    inset-inline-end: 10px;
    z-index: 2;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    padding: 5px 10px;
    color: #f8fafc;
    background: rgba(255,255,255,.08);
    font-size: .76rem;
    font-weight: 850;
}

.dev-docs-copy:hover {
    border-color: rgba(20,184,166,.42);
    color: #fff;
}

.dev-docs-list {
    display: grid;
    gap: 10px;
    padding-inline-start: 1.2rem;
}

[dir="rtl"] .dev-docs-list {
    padding-inline-start: 0;
    padding-inline-end: 1.2rem;
}

.docs-chip-grid,
.docs-chip-list,
.docs-status-flow {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.docs-chip-grid code,
.docs-chip-grid span,
.docs-chip-list span,
.docs-status-flow span {
    display: inline-flex;
    padding: .62rem .78rem;
    border: 1px solid rgba(20,184,166,.22);
    border-radius: 999px;
    background: rgba(255,255,255,.055);
    color: #f8fafc;
}

.docs-next-prev {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding-top: 30px;
    border-top: 1px solid var(--line);
}

.docs-next-prev a {
    color: var(--gold);
    font-weight: 850;
    text-decoration: none;
}

.docs-release {
    padding: 26px;
}

.docs-release > span {
    color: var(--gold);
    font-weight: 850;
}

.docs-link-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.docs-link-row a {
    display: inline-flex;
    padding: .52rem .7rem;
    border: 1px solid rgba(20,184,166,.22);
    border-radius: 999px;
    color: #f8d766;
    text-decoration: none;
    font-weight: 800;
    font-size: .9rem;
}

.docs-link-row a:hover {
    background: rgba(20,184,166,.11);
    color: #fff;
}

.connect-page {
    background: var(--bg);
}

.connect-hero {
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding: 132px 0 72px;
}

.connect-hero .hero-title {
    font-size: clamp(2.75rem, 5vw, 5.25rem);
    line-height: .96;
    letter-spacing: -.045em;
}

.connect-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .82fr);
    gap: 54px;
    align-items: center;
}

.connect-cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 30px;
}

.connect-visual,
.connect-card,
.connect-api-panel,
.connect-final-card,
.connect-faq details {
    border: 1px solid var(--card-border);
    background: var(--card);
    border-radius: var(--radius);
    box-shadow: 0 24px 76px rgba(0,0,0,.28);
}

.connect-visual {
    overflow: hidden;
    background:
        radial-gradient(circle at 76% 12%, rgba(20,184,166,.18), transparent 28%),
        rgba(255,255,255,.045);
}

.connect-visual__bar {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 16px 18px;
    border-bottom: 1px solid rgba(255,255,255,.1);
}

.connect-visual__bar span {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.28);
}

.connect-visual__bar strong {
    margin-inline-start: 10px;
    color: #dbe3f2;
    font-size: .9rem;
}

.connect-flow-preview {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 18px;
}

.connect-flow-preview article {
    position: relative;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 20px;
    background: rgba(8,12,20,.74);
    padding: 18px;
}

.connect-flow-preview article::after {
    content: "\F138";
    font-family: "bootstrap-icons";
    position: absolute;
    inset-inline-end: 18px;
    top: 18px;
    color: rgba(20,184,166,.72);
}

.connect-flow-preview__highlight {
    border-color: rgba(20,184,166,.36) !important;
    background: linear-gradient(180deg, rgba(20,184,166,.13), rgba(8,12,20,.74)) !important;
}

.connect-flow-preview span {
    display: block;
    color: var(--gold);
    font-size: .75rem;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 9px;
}

.connect-flow-preview h2 {
    font-size: 1.08rem;
    margin: 0 0 12px;
    font-weight: 850;
}

.connect-flow-preview p {
    color: var(--muted);
    margin: 0 0 7px;
    line-height: 1.45;
    font-size: .9rem;
}

.connect-flow-preview em {
    display: inline-flex;
    margin-top: 8px;
    padding: .42rem .62rem;
    border-radius: 999px;
    background: rgba(20,184,166,.13);
    color: #ffe8a3;
    font-style: normal;
    font-size: .82rem;
}

.connect-section {
    padding: 98px 0;
    scroll-margin-top: 88px;
}

.connect-section--soft {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background:
        radial-gradient(circle at 82% 14%, rgba(20,184,166,.08), transparent 28%),
        rgba(255,255,255,.022);
}

.connect-card-grid {
    display: grid;
    gap: 18px;
}

.connect-card-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.connect-card-grid--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.connect-card-grid--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.connect-card {
    padding: 26px;
    min-height: 230px;
}

.connect-card--tall {
    min-height: 260px;
}

.connect-card--usecase {
    min-height: 270px;
}

.connect-card i,
.connect-mini-grid i {
    width: 50px;
    height: 50px;
    border-radius: 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    background: var(--gold-soft);
    color: var(--gold);
    font-size: 1.35rem;
}

.connect-card h3,
.connect-mini-grid h3 {
    font-weight: 850;
    font-size: 1.08rem;
    margin-bottom: 10px;
}

.connect-card p,
.connect-mini-grid p,
.connect-faq p {
    color: var(--muted);
    line-height: 1.65;
    margin: 0;
}

.connect-split {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(320px, .75fr);
    gap: 46px;
    align-items: center;
}

.connect-split--wide {
    grid-template-columns: minmax(0, .78fr) minmax(360px, 1fr);
}

.connect-benefit-list,
.connect-chip-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.connect-benefit-list span,
.connect-chip-cloud span,
.connect-status-flow span {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: .75rem .88rem;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    background: rgba(255,255,255,.055);
    color: #dbe3f2;
}

.connect-benefit-list i {
    color: #45d291;
}

.connect-workflow {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.connect-workflow article {
    position: relative;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 22px;
    background: rgba(255,255,255,.045);
    padding: 24px;
    min-height: 240px;
}

.connect-workflow span {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    border-radius: 50%;
    background: var(--gold-soft);
    border: 1px solid rgba(20,184,166,.35);
    color: var(--gold);
    font-weight: 850;
}

.connect-workflow h3 {
    font-size: 1.04rem;
    font-weight: 850;
}

.connect-workflow p {
    color: var(--muted);
    line-height: 1.62;
    margin: 0;
}

.connect-status-flow {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
}

.connect-status-flow span {
    position: relative;
    border-color: rgba(20,184,166,.22);
}

.connect-api-panel {
    display: grid;
    grid-template-columns: minmax(0, .72fr) minmax(360px, 1fr);
    gap: 36px;
    padding: 38px;
    background:
        radial-gradient(circle at 76% 10%, rgba(20,184,166,.16), transparent 30%),
        rgba(255,255,255,.045);
}

.connect-mini-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.connect-mini-grid article {
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 20px;
    background: rgba(8,12,20,.55);
    padding: 22px;
}

.connect-faq {
    max-width: 940px;
    margin-inline: auto;
    display: grid;
    gap: 14px;
}

.connect-faq details {
    padding: 22px 24px;
}

.connect-faq summary {
    cursor: pointer;
    font-weight: 850;
    font-size: 1.04rem;
}

.connect-faq summary::marker {
    color: var(--gold);
}

.connect-faq p {
    padding-top: 14px;
}

.connect-final-cta {
    padding: 96px 0 118px;
}

.connect-final-card {
    padding: clamp(32px, 6vw, 58px);
    background:
        radial-gradient(circle at 50% 0%, rgba(20,184,166,.18), transparent 34%),
        rgba(255,255,255,.055);
}

.connect-final-card h2 {
    font-size: clamp(2rem, 4vw, 4rem);
    font-weight: 900;
    letter-spacing: 0;
}

.connect-final-card p {
    max-width: 720px;
    margin: 14px auto 0;
    color: var(--muted);
    line-height: 1.7;
}

.smart-ai-page {
    background: var(--bg);
}

.smart-ai-hero {
    position: relative;
    overflow: hidden;
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding: 132px 0 72px;
    background:
        radial-gradient(circle at 82% 16%, rgba(20,184,166,.08), transparent 28%),
        var(--bg);
    color: #fff;
}

.smart-ai-hero__grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .82fr);
    gap: 54px;
    align-items: center;
}

.smart-ai-hero__content {
    max-width: 760px;
}

.smart-ai-hero__text {
    margin-top: 18px;
    max-width: 720px;
    color: var(--muted);
    line-height: 1.72;
}

.smart-ai-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 32px;
}

.smart-ai-panel,
.smart-ai-card,
.smart-ai-final-card,
.smart-ai-faq details {
    border: 1px solid var(--card-border);
    background: var(--card);
    border-radius: var(--radius);
    box-shadow: 0 24px 76px rgba(0,0,0,.28);
}

.smart-ai-panel {
    overflow: hidden;
    padding: 28px;
    background:
        radial-gradient(circle at 76% 12%, rgba(20,184,166,.18), transparent 28%),
        rgba(255,255,255,.045);
}

.smart-ai-panel__header {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-bottom: 24px;
}

.smart-ai-panel__header span {
    border-radius: 999px;
    padding: 6px 10px;
    font-size: .78rem;
    background: rgba(255,255,255,.10);
    color: rgba(255,255,255,.78);
}

.smart-ai-panel__score {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 18px 0;
    border-top: 1px solid rgba(255,255,255,.12);
    border-bottom: 1px solid rgba(255,255,255,.12);
}

.smart-ai-panel__score span,
.smart-ai-panel__metrics span,
.smart-ai-panel__recommendation span,
.smart-ai-panel__reason span {
    display: block;
    margin-bottom: 6px;
    font-size: .78rem;
    color: rgba(255,255,255,.62);
}

.smart-ai-panel__score strong {
    font-size: 3.4rem;
    line-height: 1;
}

.smart-ai-panel__metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 18px;
}

.smart-ai-panel__metrics--single {
    grid-template-columns: 1fr;
}

.smart-ai-panel__metrics div,
.smart-ai-panel__recommendation,
.smart-ai-panel__reason {
    border-radius: 18px;
    padding: 16px;
    background: rgba(255,255,255,.08);
}

.smart-ai-panel__metrics strong {
    display: block;
    color: rgba(255,255,255,.94);
}

.smart-ai-panel__recommendation,
.smart-ai-panel__reason {
    margin-top: 18px;
}

.smart-ai-panel__recommendation p,
.smart-ai-panel__reason p {
    margin: 0;
    color: rgba(255,255,255,.86);
}

.smart-ai-section {
    padding: 98px 0;
    scroll-margin-top: 88px;
}

.smart-ai-section--soft {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background:
        radial-gradient(circle at 16% 12%, rgba(56,189,248,.08), transparent 28%),
        rgba(255,255,255,.022);
}

.smart-ai-card-grid {
    display: grid;
    gap: 18px;
}

.smart-ai-card-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.smart-ai-card-grid--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.smart-ai-card {
    padding: 26px;
    min-height: 230px;
    background: var(--card);
}

.smart-ai-card--factor {
    min-height: 250px;
}

.smart-ai-card i,
.smart-ai-mini-grid i {
    width: 50px;
    height: 50px;
    border-radius: 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    background: var(--gold-soft);
    color: var(--gold);
    font-size: 1.35rem;
}

.smart-ai-card h3,
.smart-ai-mini-grid h3 {
    font-weight: 850;
    font-size: 1.08rem;
    margin-bottom: 10px;
}

.smart-ai-card p,
.smart-ai-mini-grid p,
.smart-ai-faq p {
    color: var(--muted);
    line-height: 1.65;
    margin: 0;
}

.smart-ai-split {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(320px, .75fr);
    gap: 46px;
    align-items: center;
}

.smart-ai-split--wide {
    grid-template-columns: minmax(0, .78fr) minmax(360px, 1fr);
}

.smart-ai-benefit-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.smart-ai-benefit-list span,
.smart-ai-flow article {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: .75rem .88rem;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    background: rgba(255,255,255,.055);
    color: #dbe3f2;
}

.smart-ai-benefit-list i {
    color: #45d291;
}

.smart-ai-timeline {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.smart-ai-timeline article {
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 22px;
    background: rgba(255,255,255,.045);
    padding: 24px;
    min-height: 230px;
}

.smart-ai-timeline span {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    border-radius: 50%;
    background: var(--gold-soft);
    border: 1px solid rgba(20,184,166,.35);
    color: var(--gold);
    font-weight: 850;
}

.smart-ai-timeline h3 {
    font-size: 1.04rem;
    font-weight: 850;
}

.smart-ai-timeline p {
    color: var(--muted);
    line-height: 1.62;
    margin: 0;
}

.smart-ai-mini-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.smart-ai-mini-grid article {
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 20px;
    background: rgba(8,12,20,.55);
    padding: 22px;
}

.smart-ai-flow {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
}

.smart-ai-flow article {
    min-height: 126px;
    border-radius: 22px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    position: relative;
}

.smart-ai-flow article:not(:last-child)::after {
    content: "\F138";
    font-family: "bootstrap-icons";
    position: absolute;
    inset-inline-end: -15px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(20,184,166,.72);
    z-index: 2;
}

.smart-ai-flow strong {
    color: var(--text);
}

.smart-ai-flow span {
    color: var(--muted);
    font-size: .9rem;
}

.smart-ai-faq {
    max-width: 940px;
    margin-inline: auto;
    display: grid;
    gap: 14px;
}

.smart-ai-faq details {
    padding: 22px 24px;
    background: var(--card);
}

.smart-ai-faq summary {
    cursor: pointer;
    font-weight: 850;
    font-size: 1.04rem;
}

.smart-ai-faq summary::marker {
    color: var(--gold);
}

.smart-ai-faq p {
    padding-top: 14px;
}

.smart-ai-final-cta {
    padding: 96px 0 118px;
}

.smart-ai-final-card {
    padding: clamp(32px, 6vw, 58px);
    background:
        radial-gradient(circle at 50% 0%, rgba(20,184,166,.18), transparent 34%),
        rgba(255,255,255,.055);
}

.smart-ai-final-card h2 {
    font-size: clamp(2rem, 4vw, 4rem);
    font-weight: 900;
    letter-spacing: 0;
}

.smart-ai-final-card p {
    max-width: 720px;
    margin: 14px auto 0;
    color: var(--muted);
    line-height: 1.7;
}

.customer-ops-page {
    background:
        radial-gradient(circle at 18% 0%, rgba(20,184,166,.13), transparent 27%),
        radial-gradient(circle at 78% 12%, rgba(255,255,255,.08), transparent 25%),
        #05070b;
}

.customer-ops-hero {
    padding: 154px 0 92px;
    border-bottom: 1px solid var(--line);
}

.customer-ops-hero__grid,
.customer-ops-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .86fr);
    gap: clamp(32px, 6vw, 72px);
    align-items: center;
}

.customer-ops-hero h1,
.customer-ops-split h2,
.customer-ops-final-card h2 {
    font-size: clamp(2.8rem, 5.6vw, 6rem);
    line-height: .95;
    letter-spacing: 0;
    font-weight: 900;
}

.customer-ops-hero p,
.customer-ops-split p,
.customer-ops-final-card p {
    margin-top: 22px;
    color: var(--muted);
    font-size: clamp(1.06rem, 1.5vw, 1.28rem);
    line-height: 1.75;
}

.customer-ops-cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 30px;
}

.customer-ops-hero-mockup,
.customer-ops-card,
.customer-ops-feature-row,
.customer-ops-faq details,
.customer-ops-final-card {
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035));
    box-shadow: 0 28px 86px rgba(0,0,0,.32);
}

.customer-ops-hero-mockup {
    padding: clamp(22px, 3vw, 34px);
    position: relative;
    overflow: hidden;
}

.customer-ops-hero-mockup::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(135deg, rgba(20,184,166,.16), transparent 30%),
        radial-gradient(circle at 84% 18%, rgba(20,184,166,.14), transparent 22%);
}

.customer-ops-hero-mockup > * {
    position: relative;
    z-index: 1;
}

.customer-ops-hero-mockup--home {
    min-height: 430px;
}

.customer-ops-mockup-header {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(255,255,255,.1);
}

.customer-ops-mockup-header span,
.customer-ops-mini-kpis span,
.customer-ops-timeline span {
    color: #f7d56d;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 850;
    font-size: .72rem;
}

.customer-ops-mockup-header strong {
    color: #fff;
    font-size: clamp(1.05rem, 2vw, 1.35rem);
    text-align: end;
}

.customer-ops-profile-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 18px 0;
}

.customer-ops-profile-strip span,
.customer-ops-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: .48rem .68rem;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    background: rgba(255,255,255,.06);
    color: #dbe3f2;
    font-size: .82rem;
}

.customer-ops-profile-strip i {
    color: var(--gold);
}

.customer-ops-mini-kpis {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.customer-ops-mini-kpis article {
    padding: 18px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 20px;
    background: rgba(5,7,11,.56);
}

.customer-ops-mini-kpis strong {
    display: block;
    margin-top: 8px;
    color: #fff;
    font-size: 1.08rem;
}

.customer-ops-mini-kpis em {
    display: block;
    margin-top: 6px;
    color: var(--muted);
    font-style: normal;
    font-size: .9rem;
}

.customer-ops-timeline {
    margin-top: 18px;
    padding: 18px 18px 18px 24px;
    border: 1px solid rgba(20,184,166,.22);
    border-radius: 22px;
    background: rgba(20,184,166,.08);
}

.customer-ops-timeline p {
    position: relative;
    margin: 12px 0 0;
    padding-inline-start: 22px;
    color: #e8eef8;
    font-size: .92rem;
}

.customer-ops-timeline p::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: .55rem;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--gold);
    box-shadow: 0 0 0 4px rgba(20,184,166,.12);
}

.customer-ops-section {
    padding: 104px 0;
}

.customer-ops-section--soft,
.customer-ops-home {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: rgba(255,255,255,.025);
}

.customer-ops-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.customer-ops-card {
    padding: 26px;
    min-height: 250px;
}

.customer-ops-card i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 18px;
    background: var(--gold-soft);
    color: var(--gold);
    font-size: 1.25rem;
    margin-bottom: 18px;
}

.customer-ops-card h3,
.customer-ops-feature-row h3 {
    color: #fff;
    font-size: 1.16rem;
    font-weight: 850;
    letter-spacing: 0;
}

.customer-ops-card p,
.customer-ops-feature-row p,
.customer-ops-faq p {
    color: var(--muted);
    line-height: 1.7;
}

.customer-ops-workflow {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.customer-ops-workflow article {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 18px;
    background: rgba(255,255,255,.05);
}

.customer-ops-workflow span {
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--gold-soft);
    color: var(--gold);
    font-weight: 900;
    font-size: .82rem;
}

.customer-ops-workflow strong {
    color: #eef3fb;
    font-size: .9rem;
}

.customer-ops-feature-stack {
    display: grid;
    gap: 18px;
}

.customer-ops-feature-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1.2fr) minmax(260px, .8fr);
    gap: 22px;
    align-items: start;
    padding: 28px;
}

.customer-ops-feature-row--highlight {
    border-color: rgba(20,184,166,.34);
    background: linear-gradient(135deg, rgba(20,184,166,.13), rgba(255,255,255,.045));
}

.customer-ops-feature-row ul {
    display: grid;
    gap: 10px;
    padding: 0;
    margin: 0;
    list-style: none;
    color: #dbe3f2;
}

.customer-ops-feature-row li {
    position: relative;
    padding-inline-start: 24px;
}

.customer-ops-feature-row li::before {
    content: "\F26A";
    font-family: "bootstrap-icons";
    position: absolute;
    inset-inline-start: 0;
    color: var(--gold);
}

.customer-ops-faq {
    max-width: 920px;
    margin-inline: auto;
    display: grid;
    gap: 14px;
}

.customer-ops-faq details {
    padding: 22px 24px;
}

.customer-ops-faq summary {
    cursor: pointer;
    color: #fff;
    font-weight: 850;
}

.customer-ops-faq summary::marker {
    color: var(--gold);
}

.customer-ops-faq p {
    margin: 14px 0 0;
}

.customer-ops-final-cta {
    padding: 104px 0 118px;
}

.customer-ops-final-card {
    padding: clamp(30px, 5vw, 58px);
    background: linear-gradient(135deg, rgba(20,184,166,.14), rgba(255,255,255,.045));
}

.customer-ops-workflow-inline {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.customer-ops-workflow-inline span {
    position: relative;
    padding: 12px 14px 12px 36px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 16px;
    background: rgba(255,255,255,.06);
    color: #eef3fb;
    font-weight: 750;
    font-size: .88rem;
}

.customer-ops-workflow-inline span::before {
    content: "";
    position: absolute;
    inset-inline-start: 14px;
    top: 50%;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--gold);
    transform: translateY(-50%);
    box-shadow: 0 0 0 4px rgba(20,184,166,.12);
}

.customer-portal-hero {
    padding: 150px 0 88px;
    position: relative;
}

.customer-portal-hero__grid,
.customer-portal-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .9fr);
    gap: 48px;
    align-items: center;
}

.customer-portal-hero h1 {
    color: #fff;
    font-size: clamp(3rem, 7vw, 6.1rem);
    font-weight: 850;
    letter-spacing: 0;
    line-height: .95;
}

.customer-portal-split h2,
.customer-portal-final-card h2 {
    color: #fff;
    font-size: clamp(2.15rem, 4vw, 3.7rem);
    font-weight: 850;
    letter-spacing: 0;
    line-height: 1.04;
}

.customer-portal-hero p,
.customer-portal-split p,
.customer-portal-final-card p {
    color: var(--muted);
    font-size: 1.08rem;
    line-height: 1.75;
    max-width: 760px;
}

.customer-portal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 28px;
}

.customer-portal-mockup,
.customer-portal-card,
.customer-portal-workflow article,
.customer-portal-deny-list,
.customer-portal-principle,
.customer-portal-trust-matrix article,
.customer-portal-final-card,
.customer-portal-faq details {
    background: linear-gradient(145deg, rgba(20, 22, 28, .92), rgba(8, 9, 12, .92));
    border: 1px solid rgba(255, 255, 255, .1);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .34);
}

.customer-portal-mockup {
    border-radius: 30px;
    padding: 28px;
    overflow: hidden;
    position: relative;
}

.customer-portal-mockup::before {
    content: "";
    position: absolute;
    inset: -40% -25% auto auto;
    width: 260px;
    height: 260px;
    border-radius: 999px;
    background: rgba(20, 184, 166, .2);
    filter: blur(28px);
}

.customer-portal-mockup > * {
    position: relative;
    z-index: 1;
}

.customer-portal-mockup__header {
    display: grid;
    gap: 5px;
    padding: 18px;
    border-radius: 20px;
    background: rgba(255, 255, 255, .045);
    border: 1px solid rgba(20, 184, 166, .22);
}

.customer-portal-mockup__header span,
.customer-portal-status-grid span,
.customer-portal-status-grid em {
    color: var(--muted);
    font-size: .82rem;
}

.customer-portal-mockup__header strong {
    color: #fff;
    font-size: 1.25rem;
}

.customer-portal-mockup__header em {
    color: var(--gold);
    font-style: normal;
}

.customer-portal-status-grid,
.customer-portal-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.customer-portal-status-grid {
    margin-top: 18px;
}

.customer-portal-status-grid article {
    padding: 18px;
    border-radius: 18px;
    background: rgba(255, 255, 255, .045);
    border: 1px solid rgba(255, 255, 255, .08);
}

.customer-portal-status-grid strong {
    display: block;
    margin: 6px 0;
    color: #fff;
    font-size: 1.05rem;
}

.customer-portal-flow,
.customer-portal-status-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.customer-portal-flow span,
.customer-portal-status-strip span {
    color: #f8f3dc;
    border: 1px solid rgba(20, 184, 166, .26);
    background: rgba(20, 184, 166, .11);
    border-radius: 999px;
    padding: 8px 12px;
    font-size: .85rem;
    font-weight: 700;
}

.customer-portal-section {
    padding: 94px 0;
}

.customer-portal-section--soft {
    background: linear-gradient(180deg, rgba(255, 255, 255, .025), rgba(255, 255, 255, 0));
}

.customer-portal-card-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.customer-portal-card {
    border-radius: 24px;
    padding: 25px;
}

.customer-portal-card i {
    color: var(--gold);
    font-size: 1.6rem;
}

.customer-portal-card h3,
.customer-portal-trust-matrix h3,
.customer-portal-faq summary {
    color: #fff;
    font-weight: 800;
    letter-spacing: 0;
}

.customer-portal-card p,
.customer-portal-faq p {
    color: var(--muted);
    line-height: 1.65;
}

.customer-portal-workflow {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.customer-portal-workflow article {
    display: flex;
    align-items: center;
    gap: 13px;
    border-radius: 18px;
    padding: 16px;
}

.customer-portal-workflow span {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    color: #08090c;
    background: var(--gold);
    font-weight: 900;
    flex: 0 0 auto;
}

.customer-portal-workflow strong {
    color: #f8f3dc;
}

.customer-portal-deny-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    border-radius: 24px;
    padding: 24px;
}

.customer-portal-deny-list span,
.customer-portal-trust-matrix span {
    display: flex;
    gap: 10px;
    color: var(--muted);
    align-items: flex-start;
}

.customer-portal-deny-list i,
.customer-portal-trust-matrix i {
    color: var(--gold);
}

.customer-portal-principle {
    display: grid;
    gap: 6px;
    max-width: 880px;
    margin: 26px auto 0;
    padding: 20px 24px;
    border-radius: 20px;
    border-color: rgba(20, 184, 166, .28);
}

.customer-portal-principle strong {
    color: var(--gold);
}

.customer-portal-principle span {
    color: var(--muted);
}

.customer-portal-trust-matrix {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.customer-portal-trust-matrix article {
    display: grid;
    gap: 13px;
    border-radius: 24px;
    padding: 28px;
}

.customer-portal-final-card {
    border-radius: 30px;
    padding: 48px;
}

.customer-portal-faq {
    display: grid;
    gap: 14px;
    max-width: 980px;
    margin-inline: auto;
}

.customer-portal-faq details {
    border-radius: 18px;
    padding: 20px 24px;
}

.customer-portal-faq summary {
    cursor: pointer;
}

.customer-portal-faq summary::marker {
    color: var(--gold);
}

.connect-payload-card,
.planning-context-mockup,
.mobile-context-mockup,
.usecase-customer-visit-card {
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    background:
        linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035));
    box-shadow: 0 26px 78px rgba(0,0,0,.28);
}

.connect-payload-card {
    padding: 24px;
}

.connect-payload-card pre {
    margin: 18px 0;
    padding: 18px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 18px;
    background: rgba(5,7,11,.7);
    color: #e8eef8;
    white-space: pre-wrap;
    font-size: .82rem;
    line-height: 1.55;
}

.connect-payload-card p {
    margin: 0;
    color: var(--muted);
    line-height: 1.65;
}

.planning-context-mockup,
.mobile-context-mockup {
    padding: 26px;
}

.planning-context-mockup dl,
.visit-report-mini-card dl {
    display: grid;
    gap: 12px;
    margin: 20px 0 0;
}

.planning-context-mockup dl div,
.visit-report-mini-card dl div {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center;
    padding: 13px 15px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 15px;
    background: rgba(255,255,255,.055);
}

.planning-context-mockup dt,
.visit-report-mini-card dt {
    color: var(--muted);
    font-size: .84rem;
}

.planning-context-mockup dd,
.visit-report-mini-card dd {
    margin: 0;
    color: #fff;
    font-weight: 820;
    text-align: end;
}

.feature-privacy-note {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-top: 20px;
    padding: 14px 16px;
    border: 1px solid rgba(20,184,166,.22);
    border-radius: 18px;
    background: rgba(20,184,166,.08);
}

.feature-privacy-note i {
    color: var(--gold);
}

.mobile-context-mockup {
    display: grid;
    gap: 16px;
}

.mobile-context-card,
.visit-report-mini-card {
    padding: 20px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 22px;
    background: rgba(5,7,11,.52);
}

.mobile-context-card span,
.visit-report-mini-card span {
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 850;
    font-size: .72rem;
}

.mobile-context-card h3 {
    margin: 10px 0 14px;
    color: #fff;
}

.mobile-context-card p {
    margin: 8px 0;
}

.mobile-context-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.mobile-context-actions button,
.visit-report-mini-card button {
    border: 0;
    border-radius: 999px;
    padding: 10px 14px;
    background: rgba(255,255,255,.08);
    color: #fff;
    font-weight: 780;
}

.mobile-context-actions button:first-child,
.visit-report-mini-card button {
    background: linear-gradient(135deg, #5EEAD4, #14B8A6, #2563EB);
    color: #111;
}

.usecase-customer-visit-card {
    padding: 24px;
}

.hero-title {
    font-size: clamp(3rem, 7vw, 6.1rem);
    letter-spacing: -.05em;
    line-height: .92;
    font-weight: 850;
}

    .hero-title .accent {
        background: linear-gradient(135deg, #A7F3D0, #14B8A6 48%, #1D4ED8);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

.hero-subtitle {
    max-width: 760px;
    color: var(--muted);
    font-size: clamp(1.05rem, 2vw, 1.35rem);
    line-height: 1.65;
}

.hero-proof-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.hero-proof-row span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: .58rem .78rem;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    background: rgba(255,255,255,.055);
    color: #dbe3f2;
    font-size: .9rem;
}

.hero-proof-row i {
    color: var(--gold);
}

.hero-panel {
    border: 1px solid var(--card-border);
    background: radial-gradient(circle at top right, rgba(20,184,166,.18), transparent 28%), rgba(255,255,255,.045);
    border-radius: var(--radius);
    min-height: 430px;
    box-shadow: 0 32px 100px rgba(0,0,0,.45);
    overflow: hidden;
}

.app-window {
    margin: 28px;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(8,12,20,.78);
    overflow: hidden;
}

.window-bar {
    display: flex;
    gap: 7px;
    padding: 14px 16px;
    border-bottom: 1px solid rgba(255,255,255,.09);
}

.dot {
    width: 10px;
    height: 10px;
    border-radius: 99px;
    background: rgba(255,255,255,.28);
}

.dashboard-row {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 16px;
    padding: 18px;
}

.product-flow-window {
    min-height: 370px;
}

.route-demo-shell {
    padding: 18px;
}

.route-demo-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 18px;
}

.route-demo-header strong,
.demo-label {
    display: block;
}

.demo-label {
    color: var(--muted);
    font-size: .82rem;
    margin-bottom: 4px;
}

.route-score {
    white-space: nowrap;
    border-radius: 999px;
    padding: .48rem .7rem;
    background: rgba(69,210,145,.13);
    border: 1px solid rgba(69,210,145,.32);
    color: #b9f6d8;
    font-size: .82rem;
    font-weight: 700;
}

.capacity-strip {
    display: flex;
    height: 12px;
    overflow: hidden;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.08);
}

.capacity-strip span:nth-child(1) {
    background: #45d291;
}

.capacity-strip span:nth-child(2) {
    background: #6aa7ff;
}

.capacity-strip span:nth-child(3) {
    background: var(--gold);
}

.capacity-legend {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px;
    margin: 10px 0 18px;
    color: var(--muted);
    font-size: .78rem;
}

.route-demo-grid {
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: 14px;
}

.route-stop-list {
    display: grid;
    gap: 10px;
}

.route-stop {
    display: grid;
    grid-template-columns: 32px minmax(0,1fr);
    gap: 10px;
    align-items: center;
    padding: 10px;
    border-radius: 16px;
    background: rgba(255,255,255,.055);
    border: 1px solid rgba(255,255,255,.1);
}

.route-stop.active {
    border-color: rgba(20,184,166,.36);
    background: rgba(20,184,166,.1);
}

.route-stop.muted {
    opacity: .72;
}

.route-stop > span {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--gold-soft);
    color: var(--gold);
    font-weight: 800;
}

.route-stop small {
    display: block;
    color: var(--muted);
    overflow-wrap: anywhere;
}

.route-map-preview {
    position: relative;
    min-height: 250px;
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.1);
    background:
        linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px),
        linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
        rgba(255,255,255,.04);
    background-size: 34px 34px;
}

.map-road {
    position: absolute;
    border-radius: 999px;
    background: rgba(20,184,166,.28);
    transform-origin: center;
}

.road-a {
    width: 210px;
    height: 5px;
    top: 122px;
    left: 20px;
    transform: rotate(-24deg);
}

.road-b {
    width: 180px;
    height: 5px;
    top: 143px;
    left: 46px;
    transform: rotate(34deg);
}

.map-pin {
    position: absolute;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #10151f;
    background: var(--gold);
    color: #111;
    font-weight: 800;
    box-shadow: 0 14px 30px rgba(0,0,0,.32);
}

.pin-a { top: 40px; left: 42px; }
.pin-b { top: 92px; right: 42px; }
.pin-c { bottom: 42px; left: 88px; }
.depot {
    right: 24px;
    bottom: 28px;
    background: #45d291;
}

.operations-flow-shell {
    min-height: 370px;
}

.operations-flow-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.flow-column {
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 18px;
    background: rgba(255,255,255,.055);
    padding: 16px;
    min-height: 252px;
}

.flow-column-highlight {
    border-color: rgba(20,184,166,.34);
    background: linear-gradient(180deg, rgba(20,184,166,.12), rgba(255,255,255,.055));
}

.flow-kicker {
    display: block;
    color: var(--gold);
    font-size: .76rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 10px;
}

.flow-column h3 {
    font-size: 1.05rem;
    margin-bottom: 14px;
}

.flow-column p {
    color: var(--muted);
    font-size: .86rem;
    line-height: 1.5;
    margin-bottom: 9px;
}

.mobile-status-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 10px;
}

.mobile-status-list li {
    position: relative;
    color: #dbe3f2;
    font-size: .88rem;
    padding-inline-start: 24px;
}

.mobile-status-list li::before {
    content: "\F26A";
    font-family: "bootstrap-icons";
    position: absolute;
    inset-inline-start: 0;
    color: #45d291;
}

.fake-card {
    border-radius: 18px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.09);
    padding: 18px;
    min-height: 110px;
}

.fake-line {
    height: 9px;
    border-radius: 999px;
    background: rgba(255,255,255,.18);
    margin-bottom: 10px;
}

    .fake-line.gold {
        background: linear-gradient(90deg, #14B8A6, rgba(20,184,166,.2));
    }

.metric-card,
.feature-card,
.usecase-card,
.split-card,
.contact-card,
.login-card {
    border: 1px solid var(--card-border);
    background: var(--card);
    border-radius: var(--radius);
    box-shadow: 0 22px 70px rgba(0,0,0,.24);
}

.metric-card {
    padding: 24px;
}

.metric-value {
    font-size: 2.1rem;
    font-weight: 800;
    letter-spacing: -.04em;
}

.metric-label {
    color: var(--muted);
    font-size: .92rem;
}

.section-title {
    font-size: clamp(2.2rem, 4vw, 4.2rem);
    letter-spacing: -.055em;
    line-height: 1;
    font-weight: 850;
}

.section-text {
    color: var(--muted);
    font-size: 1.1rem;
    line-height: 1.75;
}

.feature-card {
    padding: 28px;
    min-height: 260px;
    transition: transform .22s ease, border-color .22s ease;
}

    .feature-card:hover {
        transform: translateY(-5px);
        border-color: rgba(20,184,166,.34);
    }

.icon-pill {
    width: 52px;
    height: 52px;
    border-radius: 18px;
    background: var(--gold-soft);
    color: var(--gold);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
    margin-bottom: 1.1rem;
}

.usecase-card {
    padding: 24px;
    height: 100%;
}

.feature-card-link {
    display: block;
    color: inherit;
    text-decoration: none;
}

.feature-card-link:hover {
    color: inherit;
}

.navbar .dropdown-menu {
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 16px;
    padding: 8px;
    background: rgba(15, 23, 42, .96);
    box-shadow: 0 18px 52px rgba(0, 0, 0, .24);
    min-width: 220px;
}

.navbar .dropdown-item {
    border-radius: 10px;
    color: rgba(255, 255, 255, .78);
}

.navbar .dropdown-item:hover,
.navbar .dropdown-item:focus {
    background: rgba(250, 204, 21, .14);
    color: #fff;
}

    .usecase-card i {
        color: var(--gold);
    }

.split-card {
    min-height: 320px;
    padding: 34px;
}

.workflow-section {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: rgba(255,255,255,.025);
}

.workflow-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.smart-ai-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.smart-ai-spotlight {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background:
        radial-gradient(circle at 82% 18%, rgba(20,184,166,.12), transparent 26%),
        rgba(255,255,255,.025);
}

.workflow-step,
.module-card,
.trial-cta-card {
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    background: var(--card);
    box-shadow: 0 22px 70px rgba(0,0,0,.24);
}

.workflow-step {
    padding: 24px;
}

.workflow-step span {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    border-radius: 50%;
    background: var(--gold-soft);
    border: 1px solid rgba(20,184,166,.35);
    color: var(--gold);
    font-weight: 850;
}

.workflow-step p {
    color: var(--muted);
    margin: 0;
    line-height: 1.65;
}

.product-module-section {
    padding-top: 88px;
}

.module-card {
    padding: 30px;
}

.module-card-highlight {
    border-color: rgba(20,184,166,.34);
    background: linear-gradient(180deg, rgba(20,184,166,.12), rgba(255,255,255,.055));
}

.module-list {
    display: grid;
    gap: 10px;
    padding: 0;
    margin: 22px 0 0;
    list-style: none;
    color: #dbe3f2;
}

.module-list li {
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.module-list li::before {
    content: "\F26A";
    font-family: "bootstrap-icons";
    color: var(--gold);
}

.trial-cta-section {
    padding-top: 80px;
}

.trial-cta-card {
    padding: clamp(28px, 5vw, 54px);
    background:
        linear-gradient(135deg, rgba(20,184,166,.12), rgba(255,255,255,.045));
}

.trial-checklist {
    display: grid;
    gap: 12px;
}

.trial-checklist div {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 18px;
    background: rgba(255,255,255,.05);
}

.trial-checklist i {
    color: #45d291;
}

.contact-card,
.login-card {
    padding: 34px;
}

.form-control,
.form-select {
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.13);
    color: var(--text);
    border-radius: 16px;
    padding: .85rem 1rem;
}

    .form-control:focus {
        background: rgba(255,255,255,.08);
        border-color: rgba(20,184,166,.55);
        color: var(--text);
        box-shadow: 0 0 0 .25rem rgba(20,184,166,.12);
    }

    .form-control::placeholder {
        color: rgba(255,255,255,.38);
    }

label {
    color: #dbe3f2;
}

.footer {
    border-top: 1px solid var(--line);
    color: var(--muted);
}

.landing-footer__grid {
    display: grid;
    grid-template-columns: minmax(180px, 1.2fr) repeat(3, minmax(150px, .8fr));
    gap: 24px;
    align-items: start;
}

.footer-brand {
    display: inline-block;
    margin-bottom: 8px;
    color: #fff;
    font-weight: 900;
    text-decoration: none;
}

.footer-link-group {
    display: grid;
    gap: 8px;
}

.footer-link-group strong {
    color: #fff;
    font-size: .9rem;
}

.footer-link-group a {
    color: var(--muted);
    text-decoration: none;
}

.footer-link-group a:hover {
    color: var(--text);
}

@media (max-width: 900px) {
    .landing-footer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .landing-footer__grid {
        grid-template-columns: 1fr;
    }
}

.lang-link {
    font-size: .82rem;
    color: var(--muted);
    text-decoration: none;
    padding: .35rem .55rem;
    border-radius: 999px;
    border: 1px solid transparent;
}

    .lang-link:hover,
    .lang-link.active {
        color: var(--text);
        border-color: rgba(255,255,255,.16);
        background: rgba(255,255,255,.06);
    }

.max-760 {
    max-width: 760px;
}

.max-820 {
    max-width: 820px;
}

[dir="rtl"] .me-2 {
    margin-left: .5rem !important;
    margin-right: 0 !important;
}

@media (max-width: 991px) {
    .dev-docs-hero__grid {
        grid-template-columns: 1fr;
    }

    .docs-shell {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .docs-sidebar {
        position: static;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .docs-sidebar strong {
        grid-column: 1 / -1;
    }

    .dev-docs-sidebar {
        max-height: none;
    }

    .docs-main--with-hero {
        padding-top: 112px;
    }

    .docs-card-grid,
    .docs-card-grid--compact {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hero {
        min-height: auto;
        padding: 130px 0 70px;
    }

    .section {
        padding: 76px 0;
    }

    .hero-panel {
        margin-top: 2rem;
    }

    .dashboard-row {
        grid-template-columns: 1fr;
    }

    .route-demo-grid,
    .operations-flow-grid,
    .workflow-grid,
    .smart-ai-grid {
        grid-template-columns: 1fr;
    }

    .flow-column {
        min-height: auto;
    }

    .route-map-preview {
        min-height: 210px;
    }
}

.trial-hero {
    padding-top: 150px;
}

.trial-title {
    max-width: 760px;
}

.trial-benefits,
.trial-process {
    display: grid;
    gap: 14px;
}

.trial-benefit-item,
.trial-step {
    border: 1px solid rgba(255,255,255,.1);
    background: rgba(255,255,255,.045);
}

.trial-benefit-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 18px;
}

.trial-step {
    position: relative;
    padding: 18px 18px 18px 72px;
    border-radius: 22px;
}

[dir="rtl"] .trial-step {
    padding: 18px 72px 18px 18px;
}

.trial-step span {
    position: absolute;
    left: 18px;
    top: 18px;
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(20,184,166,.35);
    border-radius: 50%;
    background: var(--gold-soft);
    color: var(--gold);
    font-weight: 800;
}

[dir="rtl"] .trial-step span {
    right: 18px;
    left: auto;
}

.trial-step strong {
    display: block;
    margin-bottom: 4px;
}

.trial-step p {
    margin: 0;
    color: var(--muted);
    font-size: .95rem;
    line-height: 1.55;
}

.trial-form-card {
    padding: 34px;
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    background: rgba(255,255,255,.065);
    box-shadow: 0 32px 100px rgba(0,0,0,.38);
}

.trial-info-box,
.trial-alert-success,
.trial-alert-error {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    border-radius: 18px;
    line-height: 1.55;
}

.trial-info-box {
    border: 1px solid rgba(20,184,166,.25);
    background: rgba(20,184,166,.1);
    color: #ffe8a3;
    font-size: .95rem;
}

.trial-alert-success {
    border: 1px solid rgba(69,210,145,.38);
    background: rgba(69,210,145,.12);
    color: #b9f6d8;
}

.trial-alert-error {
    border: 1px solid rgba(255,112,112,.38);
    background: rgba(255,112,112,.12);
    color: #ffc6c6;
}

.trial-alert-success p,
.trial-alert-error p {
    margin: 3px 0 0;
}

.trial-submit {
    padding: 1rem 1.25rem;
}

.trial-small-note {
    color: var(--muted);
    font-size: .9rem;
    text-align: center;
}

.trial-honeypot {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.trial-areas-section {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: rgba(255,255,255,.025);
}

.trial-area-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.trial-area {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 72px;
    padding: 16px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 18px;
    background: rgba(255,255,255,.045);
}

.trial-area i {
    color: var(--gold);
    font-size: 1.25rem;
}

.trial-faq-section {
    padding-top: 88px;
}

.trial-faq-accordion {
    max-width: 980px;
    margin: 0 auto;
}

.trial-faq-accordion .accordion-item {
    margin-bottom: 14px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 20px;
    background: rgba(255,255,255,.055);
    color: var(--text);
}

.trial-faq-accordion .accordion-button {
    padding: 20px 22px;
    background: rgba(255,255,255,.04);
    color: var(--text);
    box-shadow: none;
    font-weight: 700;
}

.trial-faq-accordion .accordion-button:not(.collapsed) {
    background: rgba(20,184,166,.12);
    color: #ffe8a3;
}

.trial-faq-accordion .accordion-button::after {
    filter: invert(1);
}

.trial-faq-accordion .accordion-body {
    padding: 22px;
    color: var(--muted);
    line-height: 1.75;
}

.form-select:focus {
    border-color: rgba(20,184,166,.55);
    box-shadow: 0 0 0 .25rem rgba(20,184,166,.12);
}

.form-select option {
    background: #111827;
    color: var(--text);
}

.form-check-input {
    background-color: rgba(255,255,255,.08);
    border-color: rgba(255,255,255,.22);
}

.form-check-input:checked {
    border-color: var(--gold);
    background-color: var(--gold);
}

.trial-funnel-page {
    overflow: hidden;
}

.trial-funnel-hero {
    padding: 150px 0 86px;
}

.trial-funnel-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
    gap: clamp(28px, 5vw, 64px);
    align-items: start;
}

.trial-funnel-title {
    font-size: clamp(3.25rem, 7vw, 6.8rem);
    line-height: .9;
    letter-spacing: 0;
    font-weight: 900;
    max-width: 780px;
    margin: 22px 0 24px;
}

.trial-funnel-lead {
    color: var(--text);
    font-size: clamp(1.18rem, 1.8vw, 1.55rem);
    line-height: 1.45;
    max-width: 760px;
}

.trial-funnel-text,
.trial-audience {
    color: var(--muted);
    line-height: 1.75;
    max-width: 760px;
}

.trial-hero-actions,
.trial-hero-meta,
.trial-started-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.trial-hero-meta span,
.trial-started-meta span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    padding: 9px 13px;
    color: var(--muted);
    background: rgba(255,255,255,.04);
    font-size: .92rem;
}

.trial-hero-meta i,
.trial-started-meta i {
    color: var(--gold);
}

.trial-mini-product-flow,
.trial-start-card,
.workspace-panel,
.compare-card,
.trial-final-card,
.trial-started-card {
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    background:
        radial-gradient(circle at top left, rgba(20,184,166,.14), transparent 42%),
        rgba(255,255,255,.055);
    box-shadow: 0 24px 80px rgba(0,0,0,.24);
}

.trial-mini-product-flow {
    max-width: 680px;
    margin-top: 34px;
    padding: 22px;
}

.trial-process-flow {
    display: grid;
    gap: 12px;
}

.trial-process-flow span {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 48px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 16px;
    padding: 11px 14px;
    background: rgba(255,255,255,.055);
    color: var(--text);
    font-weight: 800;
}

.trial-process-flow span:not(:last-child)::after {
    content: "";
    position: absolute;
    inset-inline-start: 26px;
    bottom: -13px;
    width: 2px;
    height: 13px;
    background: linear-gradient(180deg, rgba(20,184,166,.7), transparent);
}

.trial-process-flow--compact {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 18px 0;
}

.trial-process-flow--compact span {
    justify-content: center;
    text-align: center;
    font-size: .84rem;
}

.trial-process-flow--compact span:not(:last-child)::after {
    inset-inline-start: auto;
    inset-inline-end: -10px;
    top: 50%;
    bottom: auto;
    width: 10px;
    height: 2px;
    transform: translateY(-50%);
    background: linear-gradient(90deg, rgba(20,184,166,.72), transparent);
}

.trial-start-card {
    position: sticky;
    top: 104px;
    padding: clamp(24px, 3vw, 34px);
}

.trial-start-card h2 {
    font-weight: 900;
    margin: 8px 0 8px;
}

.trial-start-card p {
    color: var(--muted);
    margin: 0;
}

.trial-form {
    display: grid;
    gap: 16px;
}

.trial-form-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.trial-form .form-group {
    display: grid;
    gap: 7px;
}

.trial-form label,
.checkbox-row {
    color: var(--text);
    font-size: .93rem;
    font-weight: 700;
}

.trial-form input,
.trial-form select,
.trial-form textarea {
    width: 100%;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 14px;
    padding: 12px 14px;
    background: rgba(5,7,11,.58);
    color: var(--text);
    outline: none;
}

.trial-form textarea {
    resize: vertical;
    min-height: 98px;
}

.trial-form input:focus,
.trial-form select:focus,
.trial-form textarea:focus {
    border-color: rgba(20,184,166,.6);
    box-shadow: 0 0 0 .24rem rgba(20,184,166,.12);
}

.trial-form select option {
    background: #111827;
    color: var(--text);
}

.checkbox-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    line-height: 1.45;
}

.checkbox-row input {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    accent-color: var(--gold);
}

.checkbox-row a {
    color: #5EEAD4;
}

.btn-full {
    width: 100%;
    justify-content: center;
}

.trial-form-note {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin: 0;
    color: var(--muted);
    text-align: center;
    font-size: .88rem;
}

.trial-section {
    padding: 88px 0;
    scroll-margin-top: 88px;
}

.section-heading {
    max-width: 880px;
    margin: 0 auto;
}

.section-heading h2,
.workspace-panel h2,
.trial-final-card h2,
.trial-started-card h1 {
    font-size: clamp(2rem, 4vw, 3.6rem);
    font-weight: 900;
    letter-spacing: 0;
}

.section-heading p,
.workspace-panel p,
.trial-final-card p {
    color: var(--muted);
    line-height: 1.7;
}

.trial-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 38px;
}

.trial-feature-card {
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 22px;
    padding: 26px;
    background: rgba(255,255,255,.045);
    min-height: 220px;
}

.trial-feature-card i {
    color: var(--gold);
    font-size: 1.7rem;
}

.trial-feature-card h3,
.trial-steps h3,
.compare-card h3 {
    margin: 18px 0 10px;
    font-weight: 850;
}

.trial-feature-card p,
.trial-steps p,
.compare-card p,
.compare-card li {
    color: var(--muted);
    line-height: 1.65;
}

.trial-workflow-section,
.trial-compare-section {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: rgba(255,255,255,.018);
}

.trial-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 38px;
}

.trial-steps--seven {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.trial-steps article {
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 22px;
    padding: 24px;
    background: rgba(255,255,255,.045);
}

.trial-steps span,
.trial-started-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: linear-gradient(135deg, #5EEAD4, #14B8A6);
    color: #111;
    font-weight: 900;
}

.trial-steps span {
    width: 38px;
    height: 38px;
}

.workspace-panel {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
    gap: 32px;
    align-items: center;
    padding: clamp(28px, 5vw, 54px);
}

.trial-connect-demo,
.trial-smart-ai-demo {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
    gap: 32px;
    align-items: center;
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    padding: clamp(28px, 5vw, 54px);
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.12), transparent 38%),
        radial-gradient(circle at bottom left, rgba(20,184,166,.12), transparent 42%),
        rgba(255,255,255,.05);
    box-shadow: 0 24px 80px rgba(0,0,0,.24);
}

.trial-connect-demo h2,
.trial-smart-ai-demo h2 {
    font-size: clamp(2rem, 4vw, 3.6rem);
    font-weight: 900;
    letter-spacing: 0;
}

.trial-connect-demo p,
.trial-smart-ai-demo p {
    color: var(--muted);
    line-height: 1.72;
}

.workspace-data-list {
    display: grid;
    gap: 12px;
}

.workspace-data-list span {
    display: flex;
    gap: 10px;
    align-items: center;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 16px;
    padding: 12px 14px;
    background: rgba(255,255,255,.04);
    color: var(--text);
}

.workspace-data-list i {
    color: var(--gold);
}

.compare-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    margin-top: 38px;
}

.compare-card {
    padding: clamp(26px, 4vw, 38px);
}

.compare-card-highlight {
    border-color: rgba(20,184,166,.34);
}

.compare-card ul {
    display: grid;
    gap: 10px;
    padding-left: 1.1rem;
    margin: 20px 0 26px;
}

.trial-final-card {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: center;
    padding: clamp(28px, 5vw, 48px);
}

.trial-started-page {
    min-height: 100vh;
}

.trial-started-card {
    max-width: 980px;
    margin: 80px auto 0;
    padding: clamp(30px, 6vw, 64px);
    text-align: center;
}

.trial-started-icon {
    width: 72px;
    height: 72px;
    font-size: 2.25rem;
    margin-bottom: 24px;
}

.trial-next-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 36px;
    text-align: left;
}

.trial-next-steps article {
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 18px;
    padding: 20px;
    background: rgba(255,255,255,.04);
}

.trial-next-steps span {
    color: var(--gold);
    font-weight: 900;
}

.legal-page {
    min-height: 100vh;
    color: var(--ink);
    background:
        radial-gradient(circle at top left, rgba(214, 168, 58, 0.16), transparent 34%),
        linear-gradient(135deg, #080b12 0%, #111827 52%, #0b1019 100%);
}

.legal-hero {
    padding: 112px 0 32px;
}

.legal-section {
    padding: 24px 0 88px;
}

.legal-layout {
    display: grid;
    grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

.legal-toc {
    position: sticky;
    top: 88px;
    display: grid;
    gap: 8px;
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(18px);
}

.legal-toc strong {
    color: #fff;
    margin-bottom: 6px;
}

.legal-toc a {
    color: var(--muted);
    font-size: 0.92rem;
    text-decoration: none;
}

.legal-toc a:hover {
    color: var(--gold);
}

.legal-content {
    display: grid;
    gap: 18px;
}

.legal-card {
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 22px;
    padding: 28px;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: 0 20px 70px rgba(0, 0, 0, 0.22);
    backdrop-filter: blur(18px);
}

.legal-card-hero {
    max-width: 980px;
}

.legal-card h2 {
    color: #fff;
    font-size: 1.35rem;
    margin-bottom: 16px;
}

.legal-card p,
.legal-card li {
    color: var(--muted);
    line-height: 1.72;
}

.legal-card ul {
    margin: 0 0 18px;
    padding-inline-start: 1.2rem;
}

.legal-card a {
    color: var(--gold);
}

.legal-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 26px;
}

.legal-info-grid article {
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 18px;
    padding: 20px;
    background: rgba(255, 255, 255, 0.04);
}

.legal-note {
    margin-top: 22px;
    font-size: 0.94rem;
}

.legal-locale-note {
    margin-top: 0;
    margin-bottom: 22px;
}

.legal-language-switcher {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

[dir="rtl"] body,
[dir="rtl"] .legal-page,
[dir="rtl"] .trial-funnel-page {
    text-align: start;
}

.feature-page {
    background: #070b12;
    color: #f8fafc;
}

.feature-hero {
    position: relative;
    overflow: hidden;
    padding: 142px 0 96px;
    background:
        radial-gradient(circle at 12% 18%, rgba(250, 204, 21, .16), transparent 30%),
        radial-gradient(circle at 84% 24%, rgba(56, 189, 248, .12), transparent 32%),
        linear-gradient(135deg, #070b12 0%, #0f172a 54%, #111827 100%);
}

.feature-hero--routing {
    background:
        radial-gradient(circle at 16% 22%, rgba(56, 189, 248, .16), transparent 30%),
        radial-gradient(circle at 82% 28%, rgba(250, 204, 21, .12), transparent 32%),
        linear-gradient(135deg, #07101f 0%, #101827 52%, #111827 100%);
}

.feature-hero--mobile {
    background:
        radial-gradient(circle at 18% 20%, rgba(34, 197, 94, .13), transparent 30%),
        radial-gradient(circle at 82% 30%, rgba(250, 204, 21, .14), transparent 32%),
        linear-gradient(135deg, #07110d 0%, #101827 54%, #111827 100%);
}

.feature-hero__grid,
.feature-split {
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(360px, .98fr);
    gap: 56px;
    align-items: center;
}

.feature-hero__content {
    max-width: 780px;
}

.feature-hero__title {
    margin: 20px 0 0;
    font-size: clamp(3rem, 6vw, 5.2rem);
    line-height: .98;
    letter-spacing: 0;
}

.feature-hero__lead {
    margin-top: 24px;
    font-size: clamp(1.18rem, 1.7vw, 1.55rem);
    line-height: 1.5;
    color: rgba(255, 255, 255, .9);
}

.feature-hero__text {
    margin-top: 16px;
    max-width: 720px;
    color: rgba(255, 255, 255, .72);
    line-height: 1.72;
}

.feature-hero__actions,
.feature-final-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 30px;
}

.feature-mockup,
.feature-phone {
    position: relative;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 28px;
    background: rgba(15, 23, 42, .68);
    box-shadow: 0 32px 90px rgba(0, 0, 0, .34);
    backdrop-filter: blur(18px);
}

.feature-mockup {
    padding: 28px;
}

.feature-mockup__header {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.feature-mockup__header span,
.feature-phone__screen > span {
    border-radius: 999px;
    padding: 6px 10px;
    background: rgba(255, 255, 255, .09);
    color: rgba(255, 255, 255, .7);
    font-size: .78rem;
}

.feature-schedule-list,
.feature-route-list {
    display: grid;
    gap: 14px;
    margin-top: 22px;
}

.feature-schedule-list article,
.feature-route-list article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    border-radius: 18px;
    padding: 16px;
    background: rgba(255, 255, 255, .08);
}

.feature-schedule-list span,
.feature-route-list span {
    color: rgba(255, 255, 255, .62);
    font-size: .84rem;
}

.feature-schedule-list strong,
.feature-route-list strong {
    color: rgba(255, 255, 255, .94);
}

.feature-schedule-list em,
.feature-route-list em,
.feature-phone__status {
    font-style: normal;
    border-radius: 999px;
    padding: 6px 10px;
    background: rgba(250, 204, 21, .16);
    color: #facc15;
    font-size: .78rem;
}

.feature-mockup__summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 20px;
}

.feature-mockup__summary div {
    border-radius: 16px;
    padding: 14px;
    background: rgba(255, 255, 255, .07);
}

.feature-mockup__summary span {
    display: block;
    color: rgba(255, 255, 255, .58);
    font-size: .78rem;
}

.feature-mockup__summary strong {
    display: block;
    margin-top: 4px;
    font-size: 1.7rem;
}

.feature-route-map {
    position: relative;
    min-height: 190px;
    margin-top: 24px;
    border-radius: 22px;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px),
        linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px),
        rgba(255, 255, 255, .05);
    background-size: 46px 46px;
}

.feature-route-map::before {
    content: "";
    position: absolute;
    inset: 34px 54px 52px 58px;
    border: 2px solid rgba(56, 189, 248, .45);
    border-top-color: rgba(250, 204, 21, .55);
    border-radius: 48% 42% 45% 38%;
    transform: rotate(-8deg);
}

.feature-route-stop {
    position: absolute;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: #1e293b;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .22);
    box-shadow: 0 0 0 8px rgba(56, 189, 248, .08);
}

.feature-route-stop:nth-child(1) { left: 16%; top: 58%; }
.feature-route-stop:nth-child(2) { left: 40%; top: 28%; }
.feature-route-stop:nth-child(3) { left: 66%; top: 48%; }
.feature-route-stop:nth-child(4) { left: 80%; top: 22%; }

.feature-route-stop--done {
    background: #15803d;
}

.feature-route-stop--active {
    background: #d6a100;
    color: #111827;
}

.feature-phone {
    width: min(100%, 380px);
    justify-self: center;
    padding: 14px;
    border-radius: 40px;
}

.feature-phone__speaker {
    width: 82px;
    height: 6px;
    margin: 4px auto 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .18);
}

.feature-phone__screen {
    display: grid;
    gap: 16px;
    min-height: 560px;
    border-radius: 30px;
    padding: 26px;
    background:
        radial-gradient(circle at 72% 10%, rgba(250, 204, 21, .16), transparent 30%),
        linear-gradient(180deg, #0f172a, #111827);
}

.feature-phone__screen h2 {
    margin: 0;
    font-size: 1.8rem;
}

.feature-phone__screen p {
    margin: 0;
    color: rgba(255, 255, 255, .7);
}

.feature-phone__status {
    justify-self: start;
    background: rgba(34, 197, 94, .14);
    color: #86efac;
}

.feature-phone__actions {
    display: grid;
    gap: 10px;
}

.feature-phone__actions button {
    border: 0;
    border-radius: 16px;
    padding: 14px 16px;
    background: linear-gradient(135deg, #ffd766, #d6a100);
    color: #111827;
    font-weight: 800;
}

.feature-phone__actions button:first-child {
    background: rgba(255, 255, 255, .08);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .14);
}

.feature-phone__history {
    display: grid;
    gap: 8px;
    align-self: end;
    border-radius: 18px;
    padding: 16px;
    background: rgba(255, 255, 255, .07);
}

.feature-phone__history span {
    color: rgba(255, 255, 255, .68);
}

.feature-section {
    padding: 96px 0;
    background: #070b12;
    color: #f8fafc;
}

.feature-section--soft {
    background:
        radial-gradient(circle at 18% 16%, rgba(250, 204, 21, .08), transparent 30%),
        linear-gradient(180deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .015));
}

.feature-section .eyebrow {
    color: #f8d766;
}

.feature-section h2 {
    font-size: clamp(2.2rem, 4vw, 4rem);
    line-height: 1.05;
    margin-bottom: 18px;
}

.feature-section p {
    color: rgba(255, 255, 255, .72);
    line-height: 1.72;
}

.feature-issue-list,
.feature-chip-list,
.feature-benefit-list {
    display: grid;
    gap: 12px;
}

.feature-issue-list span,
.feature-chip-list span {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    border-radius: 16px;
    padding: 14px 16px;
    border: 1px solid var(--card-border);
    background: var(--card);
    color: rgba(255, 255, 255, .82);
    box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
    backdrop-filter: blur(16px);
}

.feature-issue-list i {
    color: #f8d766;
}

.feature-note-card,
.feature-info-card,
.feature-module-card,
.feature-timeline article,
.feature-faq details,
.feature-final-card {
    border: 1px solid var(--card-border);
    border-radius: 24px;
    background: var(--card);
    box-shadow: 0 24px 72px rgba(0, 0, 0, .24);
    backdrop-filter: blur(18px);
}

.feature-note-card {
    padding: 30px;
}

.feature-note-card strong {
    display: block;
    margin-bottom: 10px;
    font-size: 1.2rem;
    color: #fff;
}

.feature-timeline,
.feature-card-grid,
.feature-module-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.feature-timeline article,
.feature-info-card,
.feature-module-card {
    padding: 24px;
}

.feature-timeline article > span {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 999px;
    margin-bottom: 18px;
    background: rgba(250, 204, 21, .14);
    color: #f8d766;
    border: 1px solid rgba(250, 204, 21, .28);
    font-weight: 800;
}

.feature-timeline h3,
.feature-info-card h3,
.feature-module-card h3 {
    font-size: 1.12rem;
    margin-bottom: 10px;
    color: #fff;
}

.feature-info-card i,
.feature-module-card i {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 14px;
    margin-bottom: 18px;
    background: rgba(250, 204, 21, .14);
    color: #f8d766;
    font-size: 1.2rem;
}

.feature-module-card {
    color: inherit;
    text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease;
}

.feature-module-card:hover {
    transform: translateY(-3px);
    border-color: rgba(250, 204, 21, .38);
    box-shadow: 0 28px 76px rgba(0, 0, 0, .28);
}

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

.feature-chip-list span {
    align-items: center;
}

.feature-faq {
    display: grid;
    gap: 14px;
    max-width: 920px;
    margin-inline: auto;
}

.feature-faq details {
    padding: 20px 22px;
}

.feature-faq summary {
    cursor: pointer;
    font-weight: 800;
    color: #fff;
}

.feature-faq p {
    margin: 14px 0 0;
}

.feature-final-card {
    display: flex;
    justify-content: space-between;
    gap: 28px;
    align-items: center;
    padding: 34px;
    color: #fff;
    background:
        radial-gradient(circle at 16% 20%, rgba(250, 204, 21, .22), transparent 30%),
        linear-gradient(135deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .045));
}

.feature-final-card h2 {
    color: #fff;
}

.feature-final-card p {
    margin: 0;
    color: rgba(255, 255, 255, .72);
}

.feature-final-card__actions {
    margin-top: 0;
    flex-shrink: 0;
}

[dir="rtl"] .navbar .d-flex,
[dir="rtl"] .landing-header__actions,
[dir="rtl"] .trial-hero-actions,
[dir="rtl"] .trial-final-card .d-flex {
    direction: rtl;
}

[dir="rtl"] .route-map-preview,
[dir="rtl"] .capacity-strip,
[dir="rtl"] .route-score {
    direction: ltr;
}

[dir="rtl"] .connect-visual,
[dir="rtl"] .connect-api-panel {
    text-align: start;
}

[dir="rtl"] .connect-flow-preview article::after {
    transform: scaleX(-1);
}

[dir="rtl"] .smart-ai-flow article:not(:last-child)::after {
    transform: translateY(-50%) scaleX(-1);
}

[dir="rtl"] .feature-mockup,
[dir="rtl"] .feature-phone {
    text-align: start;
}

[dir="rtl"] .feature-route-map {
    direction: ltr;
}

.use-case-page {
    background: #05070d;
    color: #f8fafc;
}

.use-case-hero {
    position: relative;
    overflow: hidden;
    padding: 128px 0 88px;
    background:
        radial-gradient(circle at 12% 20%, rgba(250, 204, 21, 0.15), transparent 32%),
        radial-gradient(circle at 84% 20%, rgba(56, 189, 248, 0.11), transparent 28%),
        linear-gradient(135deg, #070a12 0%, #101827 58%, #07111f 100%);
}

.use-case-hero--overview {
    padding-bottom: 104px;
}

.use-case-hero__grid,
.use-case-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.82fr);
    gap: 56px;
    align-items: center;
}

.use-case-hero__content {
    max-width: 780px;
}

.use-case-hero__content--center {
    max-width: 940px;
    margin: 0 auto;
    text-align: center;
}

.use-case-hero h1 {
    margin: 18px 0 22px;
    font-size: clamp(3rem, 6vw, 6.2rem);
    line-height: 0.94;
    letter-spacing: 0;
}

.use-case-hero p,
.use-case-section p,
.use-case-card p,
.use-case-benefit p,
.use-case-module-card p,
.use-case-faq p,
.use-case-final-card p {
    color: rgba(226, 232, 240, 0.76);
    line-height: 1.72;
}

.use-case-hero__content > p {
    max-width: 760px;
    font-size: 1.22rem;
}

.use-case-hero__content--center > p {
    margin-inline: auto;
}

.use-case-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 30px;
}

.use-case-visual,
.use-case-card,
.use-case-note,
.use-case-timeline article,
.use-case-benefit,
.use-case-module-card,
.use-case-faq details,
.use-case-final-card {
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 24px;
    background: rgba(15, 23, 42, 0.68);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.26);
}

.use-case-visual {
    padding: 28px;
    backdrop-filter: blur(16px);
}

.use-case-visual__header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}

.use-case-visual__header i,
.use-case-card > i,
.use-case-benefit i,
.use-case-module-card i {
    display: inline-grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 14px;
    background: rgba(250, 204, 21, 0.12);
    color: #facc15;
    font-size: 1.3rem;
}

.use-case-visual__steps {
    display: grid;
    gap: 14px;
    margin-top: 18px;
}

.use-case-visual__steps article {
    padding: 16px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.07);
}

.use-case-visual__steps span {
    display: block;
    margin-bottom: 6px;
    color: rgba(226, 232, 240, 0.62);
    font-size: 0.82rem;
}

.use-case-section {
    padding: 88px 0;
}

.use-case-section--soft {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.44), rgba(2, 6, 23, 0));
}

.use-case-section h2 {
    font-size: clamp(2.1rem, 4vw, 4rem);
    line-height: 1.04;
    letter-spacing: 0;
}

.use-case-grid {
    display: grid;
    gap: 22px;
}

.use-case-grid--cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.use-case-grid--benefits,
.use-case-module-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.use-case-card,
.use-case-benefit,
.use-case-module-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: 26px;
    color: inherit;
    text-decoration: none;
}

.use-case-card:hover,
.use-case-module-card:hover {
    border-color: rgba(250, 204, 21, 0.48);
    color: inherit;
    transform: translateY(-2px);
}

.use-case-card h2,
.use-case-benefit h3,
.use-case-module-card h3 {
    margin: 20px 0 10px;
    font-size: 1.35rem;
}

.use-case-card > span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    color: #facc15;
    font-weight: 700;
}

.use-case-flow,
.use-case-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.use-case-flow span,
.use-case-chip-list span {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 999px;
    padding: 10px 14px;
    background: rgba(255, 255, 255, 0.07);
    color: rgba(248, 250, 252, 0.9);
}

.use-case-note {
    padding: 28px;
}

.use-case-note strong {
    display: block;
    margin-bottom: 10px;
    font-size: 1.4rem;
}

.use-case-timeline {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.use-case-timeline article {
    padding: 24px;
}

.use-case-timeline article > span {
    display: inline-grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(135deg, #facc15, #fed7aa);
    color: #111827;
    font-weight: 900;
    margin-bottom: 18px;
}

.use-case-timeline h3 {
    margin-bottom: 10px;
    font-size: 1.2rem;
}

.use-case-module-card {
    transition: transform 180ms ease, border-color 180ms ease;
}

.use-case-faq {
    display: grid;
    gap: 14px;
    max-width: 920px;
    margin-inline: auto;
}

.use-case-faq details {
    padding: 20px 22px;
}

.use-case-faq summary {
    cursor: pointer;
    color: #fff;
    font-weight: 800;
}

.use-case-faq p {
    margin: 14px 0 0;
}

.use-case-final-cta {
    padding: 88px 0 104px;
}

.use-case-final-card {
    padding: clamp(32px, 6vw, 64px);
    background:
        radial-gradient(circle at 15% 20%, rgba(250, 204, 21, 0.16), transparent 30%),
        rgba(15, 23, 42, 0.76);
}

.use-case-final-card h2 {
    font-size: clamp(2.2rem, 4.6vw, 4.6rem);
    line-height: 1.02;
    letter-spacing: 0;
}

[dir="rtl"] .use-case-card > span i {
    transform: rotate(180deg);
}

@media (max-width: 991px) {
    .feature-hero {
        padding: 122px 0 72px;
    }

    .feature-hero__grid,
    .feature-split {
        grid-template-columns: 1fr;
    }

    .use-case-hero {
        padding: 112px 0 72px;
    }

    .use-case-hero__grid,
    .use-case-split {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .use-case-grid--cards,
    .use-case-grid--benefits,
    .use-case-module-grid,
    .use-case-timeline {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .feature-timeline,
    .feature-card-grid,
    .feature-module-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .feature-phone {
        justify-self: start;
    }

    .connect-hero {
        padding-top: 122px;
    }

    .connect-hero__grid,
    .connect-split,
    .connect-split--wide,
    .connect-api-panel {
        grid-template-columns: 1fr;
    }

    .connect-card-grid--4,
    .connect-card-grid--5,
    .connect-workflow {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .connect-card-grid--3 {
        grid-template-columns: 1fr;
    }

    .connect-mini-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .smart-ai-hero {
        min-height: auto;
        padding: 122px 0 72px;
    }

    .smart-ai-hero__grid,
    .smart-ai-split,
    .smart-ai-split--wide {
        grid-template-columns: 1fr;
    }

    .smart-ai-card-grid--4,
    .smart-ai-timeline,
    .smart-ai-flow {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .smart-ai-card-grid--3,
    .smart-ai-mini-grid {
        grid-template-columns: 1fr;
    }

    .smart-ai-flow article:not(:last-child)::after {
        display: none;
    }

    .trial-hero {
        padding-top: 120px;
    }

    .trial-form-card {
        padding: 24px;
    }

    .trial-area-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .trial-funnel-hero {
        padding-top: 120px;
    }

    .legal-layout {
        grid-template-columns: 1fr;
    }

    .legal-toc {
        position: static;
    }

    .legal-info-grid {
        grid-template-columns: 1fr;
    }

    .trial-funnel-grid,
    .workspace-panel,
    .trial-connect-demo,
    .trial-smart-ai-demo,
    .compare-grid,
    .trial-next-steps {
        grid-template-columns: 1fr;
    }

    .trial-start-card {
        position: static;
    }

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

    .trial-process-flow--compact {
        grid-template-columns: 1fr;
    }

    .trial-process-flow--compact span:not(:last-child)::after {
        inset-inline-start: 26px;
        inset-inline-end: auto;
        top: auto;
        bottom: -13px;
        width: 2px;
        height: 13px;
        transform: none;
        background: linear-gradient(180deg, rgba(20,184,166,.72), transparent);
    }

    .trial-final-card {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Trust pages */
.trust-page {
    background:
        radial-gradient(circle at 15% 10%, rgba(20, 184, 166, .14), transparent 28%),
        radial-gradient(circle at 85% 20%, rgba(255, 255, 255, .07), transparent 24%),
        linear-gradient(180deg, #05070b 0%, #080b12 38%, #05070b 100%);
    color: var(--text);
}

.trust-hero {
    position: relative;
    overflow: hidden;
    padding: 150px 0 92px;
    background:
        radial-gradient(circle at 72% 18%, rgba(20, 184, 166, .14), transparent 28%),
        rgba(255, 255, 255, .015);
    border-bottom: 1px solid var(--line);
    color: var(--text);
}

.trust-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(330px, .92fr);
    gap: 56px;
    align-items: center;
}

.trust-hero h1 {
    max-width: 860px;
    margin: 0;
    font-size: clamp(3.1rem, 7vw, 6.8rem);
    line-height: .92;
    letter-spacing: 0;
}

.trust-hero p:not(.eyebrow) {
    max-width: 760px;
    margin-top: 24px;
    color: rgba(255, 255, 255, .76);
    font-size: 1.08rem;
    line-height: 1.8;
}

.trust-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.trust-visual {
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 24px;
    padding: 26px;
    background: rgba(15, 23, 42, .66);
    box-shadow: 0 26px 80px rgba(0, 0, 0, .30);
    backdrop-filter: blur(18px);
}

.trust-visual__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 14px;
    align-items: center;
}

.trust-visual__row span,
.trust-visual__row strong,
.trust-visual__grid span,
.trust-visual__split div,
.trust-visual__stack span {
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 14px;
    padding: 14px;
    background: rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .86);
}

.trust-visual__row i {
    color: #14B8A6;
}

.trust-visual__grid,
.trust-visual__split,
.trust-visual__stack {
    display: grid;
    gap: 12px;
    margin-top: 18px;
}

.trust-visual__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.trust-visual__split {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.trust-visual__split div,
.trust-visual__stack span {
    display: grid;
    gap: 6px;
}

.trust-visual__split i,
.trust-visual__grid i {
    color: #7dd3fc;
}

.trust-visual__footer {
    margin-top: 18px;
    border-radius: 14px;
    padding: 14px;
    background: rgba(20, 184, 166, .12);
    color: rgba(255, 255, 255, .88);
}

.trust-section {
    padding: 96px 0;
}

.trust-section--soft {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background:
        radial-gradient(circle at 82% 14%, rgba(20, 184, 166, .08), transparent 28%),
        rgba(255,255,255,.022);
}

.trust-grid {
    display: grid;
    gap: 18px;
}

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

.trust-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.trust-grid--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.trust-grid--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.trust-card {
    height: 100%;
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    padding: 24px;
    background: var(--card);
    box-shadow: 0 24px 76px rgba(0,0,0,.28);
    color: var(--text);
}

.trust-card--large {
    padding: 30px;
}

.trust-card--wide {
    max-width: 960px;
    margin: 0 auto;
    padding: 34px;
}

.trust-card--accent {
    background:
        radial-gradient(circle at 86% 14%, rgba(20,184,166,.13), transparent 34%),
        rgba(255,255,255,.075);
    color: var(--text);
}

.trust-card i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin-bottom: 18px;
    border-radius: 14px;
    background: var(--gold-soft);
    color: var(--gold);
}

.trust-card--accent i {
    background: rgba(255, 255, 255, .10);
    color: #14B8A6;
}

.trust-card h2,
.trust-card h3 {
    margin-bottom: 12px;
    color: inherit;
}

.trust-card p,
.trust-card li {
    color: var(--muted);
    line-height: 1.72;
}

.trust-card--accent p,
.trust-card--accent li {
    color: var(--muted);
}

.trust-split {
    display: grid;
    grid-template-columns: minmax(0, .98fr) minmax(320px, 1.02fr);
    gap: 42px;
    align-items: center;
}

.trust-split h2 {
    font-size: clamp(2rem, 4vw, 3.6rem);
    line-height: 1.02;
}

.trust-split p {
    color: var(--muted);
    line-height: 1.78;
}

.trust-callout {
    margin-top: 22px;
    border-left: 4px solid #14B8A6;
    border-radius: 12px;
    padding: 18px;
    background: rgba(20,184,166,.12);
    color: #f8e7ac;
    line-height: 1.7;
}

[dir="rtl"] .trust-callout {
    border-left: 0;
    border-right: 4px solid #14B8A6;
}

.trust-chip-panel {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.trust-chip-panel span {
    border: 1px solid var(--card-border);
    border-radius: 999px;
    padding: 10px 14px;
    background: rgba(255,255,255,.07);
    color: #dbe3f2;
    font-weight: 650;
}

.trust-chip-panel--plain span {
    border-color: rgba(255, 255, 255, .14);
    background: rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .88);
}

.trust-list,
.trust-tick-list {
    display: grid;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.trust-tick-list span {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    color: #dbe3f2;
    line-height: 1.55;
}

.trust-tick-list i {
    margin-top: 2px;
    color: var(--gold);
}

.trust-tick-list--compact {
    margin-top: 22px;
}

.trust-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    background: var(--card);
    box-shadow: 0 24px 76px rgba(0,0,0,.28);
}

.trust-table {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
}

.trust-table th,
.trust-table td {
    padding: 18px;
    border-bottom: 1px solid var(--line);
    text-align: start;
    vertical-align: top;
    color: var(--muted);
}

.trust-table th {
    background: rgba(255,255,255,.08);
    color: var(--text);
}

.trust-table tr:last-child td {
    border-bottom: 0;
}

.trust-timeline {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 14px;
}

.trust-timeline article {
    position: relative;
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    padding: 20px;
    background: var(--card);
    box-shadow: 0 24px 76px rgba(0,0,0,.22);
}

.trust-timeline span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin-bottom: 16px;
    border-radius: 999px;
    background: var(--gold-soft);
    color: var(--gold);
    font-weight: 800;
}

.trust-timeline h3 {
    font-size: 1rem;
}

.trust-timeline p {
    margin: 0;
    color: var(--muted);
    font-size: .94rem;
    line-height: 1.62;
}

.trust-inline-link {
    display: inline-flex;
    margin-top: 8px;
    color: var(--gold);
    font-weight: 750;
}

.trust-faq {
    display: grid;
    gap: 12px;
    max-width: 920px;
    margin-inline: auto;
}

.trust-faq details {
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    padding: 20px 22px;
    background: var(--card);
    box-shadow: 0 24px 76px rgba(0,0,0,.22);
}

.trust-faq summary {
    cursor: pointer;
    color: var(--text);
    font-weight: 800;
}

.trust-faq p {
    margin: 14px 0 0;
    color: var(--muted);
    line-height: 1.72;
}

.trust-final-cta {
    padding: 84px 0;
    border-top: 1px solid var(--line);
    background:
        radial-gradient(circle at 18% 18%, rgba(20,184,166,.10), transparent 28%),
        rgba(255,255,255,.018);
    color: var(--text);
}

.trust-final-card {
    display: flex;
    gap: 28px;
    align-items: center;
    justify-content: space-between;
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    padding: 34px;
    background: var(--card);
    box-shadow: 0 24px 76px rgba(0,0,0,.28);
}

.trust-final-card h2 {
    margin-bottom: 10px;
    color: #fff;
}

.trust-final-card p {
    max-width: 780px;
    margin: 0;
    color: rgba(255, 255, 255, .72);
    line-height: 1.7;
}

@media (max-width: 1180px) {
    .trust-grid--5,
    .trust-timeline {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 991px) {
    .trust-hero {
        padding: 124px 0 76px;
    }

    .trust-hero__grid,
    .trust-split,
    .trust-grid--2 {
        grid-template-columns: 1fr;
    }

    .trust-grid--3,
    .trust-grid--4,
    .trust-grid--5,
    .trust-timeline {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .trust-final-card {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 575px) {
    .docs-hero {
        padding: 124px 0 58px;
    }

    .docs-main,
    .docs-main--with-hero {
        padding: 92px 0 74px;
    }

    .docs-sidebar,
    .docs-card-grid,
    .docs-card-grid--compact {
        grid-template-columns: 1fr;
    }

    .docs-hero h1,
    .docs-page-title h1 {
        font-size: clamp(2.35rem, 13vw, 3.4rem);
    }

    .docs-card,
    .docs-callout,
    .docs-release {
        border-radius: 16px;
        padding: 18px;
    }

    .docs-endpoint {
        align-items: flex-start;
        flex-direction: column;
    }

    .docs-next-prev {
        flex-direction: column;
    }

    .feature-hero {
        padding-top: 112px;
    }

    .feature-hero__title {
        font-size: clamp(3rem, 15vw, 4.4rem);
    }

    .feature-section {
        padding: 72px 0;
    }

    .use-case-hero h1 {
        font-size: clamp(2.8rem, 15vw, 4.4rem);
    }

    .use-case-section,
    .use-case-final-cta {
        padding: 64px 0;
    }

    .use-case-grid--cards,
    .use-case-grid--benefits,
    .use-case-module-grid,
    .use-case-timeline {
        grid-template-columns: 1fr;
    }

    .use-case-visual,
    .use-case-card,
    .use-case-note,
    .use-case-timeline article,
    .use-case-benefit,
    .use-case-module-card,
    .use-case-faq details,
    .use-case-final-card {
        border-radius: 18px;
    }

    .feature-timeline,
    .feature-card-grid,
    .feature-module-grid,
    .feature-chip-list,
    .feature-mockup__summary {
        grid-template-columns: 1fr;
    }

    .feature-schedule-list article,
    .feature-route-list article {
        grid-template-columns: 1fr;
    }

    .feature-final-card {
        align-items: flex-start;
        flex-direction: column;
        border-radius: 18px;
        padding: 26px;
    }

    .feature-mockup,
    .feature-phone,
    .feature-note-card,
    .feature-info-card,
    .feature-module-card,
    .feature-timeline article,
    .feature-faq details {
        border-radius: 18px;
    }

    .feature-phone__screen {
        min-height: 520px;
    }

    .connect-hero {
        padding-top: 112px;
    }

    .connect-section {
        padding: 72px 0;
    }

    .connect-card-grid--4,
    .connect-card-grid--5,
    .connect-workflow,
    .connect-mini-grid {
        grid-template-columns: 1fr;
    }

    .connect-visual,
    .connect-card,
    .connect-api-panel,
    .connect-final-card,
    .connect-faq details,
    .connect-workflow article {
        border-radius: 18px;
    }

    .connect-api-panel {
        padding: 24px;
    }

    .connect-visual__bar strong {
        font-size: .78rem;
    }

    .smart-ai-hero {
        padding-top: 112px;
    }

    .smart-ai-section {
        padding: 72px 0;
    }

    .smart-ai-card-grid--4,
    .smart-ai-timeline,
    .smart-ai-flow,
    .smart-ai-panel__metrics {
        grid-template-columns: 1fr;
    }

    .smart-ai-panel,
    .smart-ai-card,
    .smart-ai-final-card,
    .smart-ai-faq details,
    .smart-ai-timeline article {
        border-radius: 18px;
    }

    .trial-area-grid {
        grid-template-columns: 1fr;
    }

    .trial-funnel-title {
        font-size: clamp(2.7rem, 18vw, 4.2rem);
    }

    .trial-form-row,
    .trial-feature-grid,
    .trial-steps {
        grid-template-columns: 1fr;
    }

    .trial-start-card,
    .trial-feature-card,
    .compare-card,
    .workspace-panel,
    .trial-connect-demo,
    .trial-smart-ai-demo,
    .trial-final-card {
        border-radius: 18px;
    }

    .trust-hero h1 {
        font-size: clamp(2.8rem, 15vw, 4.5rem);
    }

    .trust-section,
    .trust-final-cta {
        padding: 64px 0;
    }

    .trust-grid--3,
    .trust-grid--4,
    .trust-grid--5,
    .trust-timeline,
    .trust-visual__row,
    .trust-visual__grid,
    .trust-visual__split {
        grid-template-columns: 1fr;
    }

    .trust-visual,
    .trust-card,
    .trust-table-wrap,
    .trust-faq details,
    .trust-final-card {
        border-radius: 18px;
    }
}

@media (max-width: 1199.98px) {
    .customer-ops-card-grid,
    .customer-portal-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991px) {
    .customer-ops-hero {
        padding-top: 118px;
    }

    .customer-ops-hero__grid,
    .customer-ops-split,
    .customer-ops-feature-row,
    .customer-portal-hero__grid,
    .customer-portal-split {
        grid-template-columns: 1fr;
    }

    .customer-ops-workflow,
    .customer-portal-workflow,
    .customer-portal-trust-matrix {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .customer-ops-section,
    .customer-ops-final-cta,
    .customer-portal-section {
        padding: 72px 0;
    }
}

@media (max-width: 575px) {
    .customer-ops-card-grid,
    .customer-ops-workflow,
    .customer-ops-mini-kpis,
    .customer-ops-workflow-inline,
    .customer-portal-card-grid,
    .customer-portal-status-grid,
    .customer-portal-workflow,
    .customer-portal-deny-list,
    .customer-portal-trust-matrix {
        grid-template-columns: 1fr;
    }

    .customer-ops-hero h1,
    .customer-ops-split h2,
    .customer-ops-final-card h2,
    .customer-portal-hero h1 {
        font-size: clamp(2.55rem, 16vw, 4.1rem);
    }

    .customer-portal-split h2,
    .customer-portal-final-card h2 {
        font-size: clamp(2rem, 11vw, 3rem);
    }

    .customer-ops-hero-mockup,
    .customer-ops-card,
    .customer-ops-feature-row,
    .customer-ops-faq details,
    .customer-ops-final-card,
    .customer-portal-mockup,
    .customer-portal-card,
    .customer-portal-final-card,
    .customer-portal-faq details {
        border-radius: 18px;
    }

    .customer-ops-mockup-header {
        flex-direction: column;
    }

    .customer-ops-mockup-header strong {
        text-align: start;
    }
}
