:root {
    --beksy-bg: #07091f;
    --beksy-bg-secondary: #0e1130;
    --beksy-surface: #14183a;
    --beksy-raised: #1a1f48;
    --beksy-purple: #6c3bff;
    --beksy-purple-light: #9a5cff;
    --beksy-pink: #b14eff;
    --beksy-blue: #168bff;
    --beksy-cyan: #1cb8ff;
    --beksy-text: #f8f8fc;
    --beksy-text-secondary: #b9bed8;
    --beksy-muted: #858baa;
    --beksy-border: #292e58;
    --beksy-success: #39d98a;
    --beksy-warning: #ffbd4a;
    --beksy-error: #ff5c73;
    --beksy-gradient: linear-gradient(110deg, var(--beksy-pink), var(--beksy-purple), var(--beksy-blue))
}

* {
    box-sizing: border-box
}

html {
    scroll-behavior: smooth
}

body {
    margin: 0;
    background: var(--beksy-bg);
    color: var(--beksy-text);
    font-family: Manrope, Inter, system-ui, sans-serif;
    overflow-x: hidden
}

body:before {
    position: fixed;
    inset: 0;
    z-index: -2;
    background-image: linear-gradient(#ffffff05 1px, transparent 1px), linear-gradient(90deg, #ffffff05 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(#000, transparent 80%);
    content: ""
}

a {
    color: inherit;
    text-decoration: none
}

button,
input,
select,
textarea {
    font: inherit
}

button,
a {
    touch-action: manipulation
}

.bk-container {
    width: min(calc(100% - 40px), 1320px);
    margin-inline: auto
}

.skip-link {
    position: fixed;
    z-index: 1000;
    top: 8px;
    left: 8px;
    padding: 12px 16px;
    background: #fff;
    color: #07091f;
    transform: translateY(-150%)
}

.skip-link:focus {
    transform: none
}

.bk-header {
    position: sticky;
    z-index: 100;
    top: 0;
    border-bottom: 1px solid #ffffff0d;
    background: #07091fe8;
    backdrop-filter: blur(18px)
}

.bk-nav {
    display: flex;
    min-height: 78px;
    align-items: center;
    justify-content: space-between;
    gap: 20px
}

.bk-brand {
    display: flex;
    align-items: center;
    gap: 9px
}

.bk-brand img:first-child {
    width: 39px;
    height: auto
}

.bk-brand img:nth-child(2) {
    width: 94px;
    height: auto
}

.bk-brand small {
    max-width: 130px;
    margin-left: 7px;
    color: var(--beksy-muted);
    font-size: 10px;
    line-height: 1.25
}

.bk-nav nav {
    display: flex;
    align-items: center;
    gap: 20px
}

.bk-nav nav>a {
    min-height: 44px;
    display: flex;
    align-items: center;
    color: var(--beksy-text-secondary);
    font-size: 13px;
    font-weight: 700
}

.bk-nav nav>a:hover,
.bk-nav nav>a.active {
    color: #fff
}

.bk-menu {
    display: none;
    min-height: 44px;
    border: 1px solid var(--beksy-border);
    border-radius: 10px;
    background: var(--beksy-surface);
    color: #fff;
    padding: 0 15px
}

.bk-btn {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 12px;
    background: var(--beksy-gradient);
    color: #fff;
    padding: 0 20px;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 12px 35px #6c3bff25
}

.bk-btn:hover {
    filter: brightness(1.12);
    transform: translateY(-1px)
}

.bk-btn.ghost {
    border-color: var(--beksy-border);
    background: #ffffff06;
    box-shadow: none
}

.bk-btn.small {
    min-height: 44px !important;
    padding: 0 15px
}

.bk-btn:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
button:focus-visible {
    outline: 3px solid var(--beksy-cyan);
    outline-offset: 3px
}

.bk-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(75px, 10vw, 145px) 0
}

.bk-hero:before {
    position: absolute;
    width: 700px;
    height: 700px;
    top: -380px;
    right: -100px;
    border-radius: 50%;
    background: #6c3bff35;
    filter: blur(70px);
    content: ""
}

.bk-hero-grid {
    display: grid;
    grid-template-columns: 1.04fr .96fr;
    align-items: center;
    gap: 65px
}

.bk-badge,
.eyebrow,
.section-head>span {
    display: inline-flex;
    color: #b8a2ff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase
}

.bk-badge {
    border: 1px solid #9a5cff55;
    border-radius: 999px;
    background: #6c3bff16;
    padding: 8px 12px
}

.bk-hero h1 {
    max-width: 780px;
    margin: 24px 0;
    font-size: clamp(43px, 6.3vw, 78px);
    line-height: .99;
    letter-spacing: -.055em
}

.partner-hero h1 {
    max-width: 950px
}

.bk-lead {
    max-width: 730px;
    color: var(--beksy-text-secondary);
    font-size: clamp(17px, 2vw, 21px);
    line-height: 1.7
}

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

.bk-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    margin: 28px 0 0;
    padding: 0;
    list-style: none;
    color: var(--beksy-text-secondary);
    font-size: 13px
}

.bk-trust li:before {
    margin-right: 7px;
    color: var(--beksy-success);
    content: '✓'
}

.product-visual {
    position: relative;
    min-height: 510px
}

.mock-window,
.admin-mock {
    overflow: hidden;
    border: 1px solid var(--beksy-border);
    border-radius: 20px;
    background: #0d102b;
    box-shadow: 0 40px 100px #0008
}

.mock-window {
    position: absolute;
    inset: 25px 0 55px 10px;
    transform: perspective(1000px) rotateY(-5deg)
}

.mock-top {
    display: flex;
    height: 48px;
    align-items: center;
    gap: 7px;
    border-bottom: 1px solid var(--beksy-border);
    padding: 0 17px
}

.mock-top i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #596081
}

.mock-top b {
    margin-left: 10px;
    font-size: 11px
}

.mock-body {
    display: grid;
    grid-template-columns: 115px 1fr;
    height: 360px
}

.mock-body aside,
.admin-mock aside {
    display: flex;
    flex-direction: column;
    gap: 14px;
    border-right: 1px solid var(--beksy-border);
    padding: 20px 14px;
    color: var(--beksy-muted);
    font-size: 10px
}

.mock-body aside strong {
    display: grid;
    width: 25px;
    height: 25px;
    place-items: center;
    border-radius: 8px;
    background: var(--beksy-gradient);
    color: #fff
}

.mock-content {
    padding: 27px
}

.mock-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px
}

.mock-stats span {
    display: flex;
    min-height: 75px;
    flex-direction: column;
    justify-content: center;
    border: 1px solid var(--beksy-border);
    border-radius: 12px;
    background: var(--beksy-surface);
    padding: 11px;
    color: var(--beksy-muted);
    font-size: 9px
}

.mock-stats b {
    margin-top: 7px;
    color: #fff;
    font-size: 11px
}

.success {
    color: var(--beksy-success) !important
}

.mock-chart {
    height: 150px;
    margin-top: 14px;
    border: 1px solid var(--beksy-border);
    border-radius: 12px;
    background: linear-gradient(180deg, #6c3bff22, transparent), linear-gradient(150deg, transparent 45%, #6c3bff 46%, #168bff 49%, transparent 50%)
}

.mock-phone {
    position: absolute;
    right: -18px;
    bottom: 0;
    width: 155px;
    height: 285px;
    border: 7px solid #202653;
    border-radius: 28px;
    background: linear-gradient(#833eff, #15183a 72%);
    padding: 45px 15px 15px;
    box-shadow: 0 25px 60px #0009
}

.mock-phone>* {
    display: block;
    margin: 9px 0
}

.mock-phone small {
    font-size: 7px
}

.mock-phone button {
    min-height: 34px;
    border: 0;
    border-radius: 7px;
    background: #fff;
    color: #1b1740;
    font-size: 8px;
    font-weight: 800
}

.float-card {
    position: absolute;
    border: 1px solid var(--beksy-border);
    border-radius: 12px;
    background: #15193be8;
    padding: 12px 15px;
    font-size: 10px;
    box-shadow: 0 15px 40px #0008
}

.float-card b {
    display: block;
    margin-top: 5px;
    color: #b8a2ff
}

.float-card.one {
    top: 8px;
    right: -5px
}

.float-card.two {
    bottom: 35px;
    left: -18px
}

.bk-section {
    padding: clamp(75px, 9vw, 120px) 0
}

.bk-section.alt {
    background: #0e1130aa
}

.section-head {
    max-width: 800px;
    margin-bottom: 45px
}

.section-head h2,
.bk-section h2 {
    margin: 14px 0;
    font-size: clamp(32px, 5vw, 54px);
    line-height: 1.08;
    letter-spacing: -.045em
}

.section-head p,
.bk-section p {
    color: var(--beksy-text-secondary);
    line-height: 1.75
}

.card-grid,
.pillar-grid,
.tag-grid {
    display: grid;
    gap: 18px
}

.card-grid.four {
    grid-template-columns: repeat(4, 1fr)
}

.card-grid.three {
    grid-template-columns: repeat(3, 1fr)
}

.card-grid.two {
    grid-template-columns: repeat(2, 1fr)
}

.bk-card,
.pillar {
    border: 1px solid var(--beksy-border);
    border-radius: 18px;
    background: #14183ab8;
    padding: 26px
}

.bk-card h3 {
    margin: 15px 0;
    font-size: 20px
}

.bk-card p,
.bk-card li,
.pillar li {
    color: var(--beksy-text-secondary);
    font-size: 14px;
    line-height: 1.7
}

.card-icon {
    display: grid;
    width: 43px;
    height: 43px;
    place-items: center;
    border-radius: 13px;
    background: #6c3bff22;
    color: #ad8cff
}

.pillar-grid {
    grid-template-columns: repeat(4, 1fr)
}

.pillar {
    position: relative;
    overflow: hidden
}

.pillar:after {
    position: absolute;
    inset: auto -70px -100px auto;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: #6c3bff22;
    filter: blur(20px);
    content: ""
}

.pillar>span {
    color: #7465b6;
    font-weight: 800
}

.pillar h3 {
    font-size: 29px
}

.pillar h4 {
    min-height: 44px;
    color: var(--beksy-text-secondary)
}

.pillar ul,
.bk-card ul,
.architecture ul {
    padding-left: 19px
}

.experience,
.two-col,
.architecture,
.form-wrap {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    align-items: center;
    gap: 60px
}

.admin-mock {
    display: grid;
    grid-template-columns: 145px 1fr;
    min-height: 390px
}

.admin-mock>div {
    padding: 30px
}

.dash-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px
}

.dash-grid i {
    height: 100px;
    border: 1px solid var(--beksy-border);
    border-radius: 14px;
    background: linear-gradient(135deg, #6c3bff18, #168bff0c)
}

.tag-grid {
    grid-template-columns: repeat(4, 1fr)
}

.tag-grid>span {
    display: flex;
    min-height: 80px;
    align-items: center;
    border: 1px solid var(--beksy-border);
    border-radius: 15px;
    background: var(--beksy-surface);
    padding: 18px;
    color: var(--beksy-text-secondary);
    font-weight: 700
}

.trust-cards>span {
    color: #d4d8ef
}

.cta-panel,
.partner-cta .bk-container {
    border: 1px solid #6c3bff55;
    border-radius: 24px;
    background: radial-gradient(circle at 90%, #6c3bff35, transparent 40%), var(--beksy-surface);
    padding: clamp(28px, 5vw, 62px)
}

.partner-cta {
    text-align: center
}

.partner-cta p {
    max-width: 800px;
    margin: 20px auto 28px
}

.bk-footer {
    border-top: 1px solid var(--beksy-border);
    padding: 55px 0;
    background: #050619
}

.bk-footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 40px
}

.bk-footer p {
    color: var(--beksy-muted)
}

.bk-footer-grid>div:last-child {
    display: grid;
    align-content: start;
    gap: 11px
}

.partner-hero blockquote {
    max-width: 900px;
    margin: 30px 0;
    padding: 22px 26px;
    border-left: 4px solid var(--beksy-purple);
    background: #14183a;
    color: #e2e4f3;
    line-height: 1.7
}

.executive {
    padding-top: 15px
}

.executive small {
    color: var(--beksy-muted)
}

.pillar-mini {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px
}

.pillar-mini span {
    border: 1px solid var(--beksy-border);
    border-radius: 15px;
    background: var(--beksy-surface);
    padding: 28px;
    font-size: 18px;
    font-weight: 800
}

.architecture {
    align-items: start
}

.arch-flow {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 9px;
    border: 1px solid var(--beksy-border);
    border-radius: 20px;
    background: #090c25;
    padding: 25px
}

.arch-flow>span,
.arch-flow>div span {
    border: 1px solid #3e457c;
    border-radius: 10px;
    background: #151a40;
    padding: 13px 16px;
    text-align: center
}

.arch-flow>div {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px
}

.timeline {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    padding: 0;
    list-style: none
}

.timeline li {
    border-top: 3px solid var(--beksy-purple);
    padding: 20px 5px
}

.timeline b,
.timeline span {
    display: block
}

.timeline span {
    margin-top: 10px;
    color: var(--beksy-muted);
    font-size: 14px;
    line-height: 1.6
}

.status-label {
    display: inline-flex;
    border-radius: 99px;
    background: #6c3bff25;
    padding: 7px 10px;
    color: #bca7ff;
    font-size: 11px;
    font-weight: 800
}

.fineprint {
    margin-top: 25px;
    font-size: 13px
}

.form-wrap {
    align-items: start
}

.partner-form-card {
    border: 1px solid var(--beksy-border);
    border-radius: 20px;
    background: var(--beksy-surface);
    padding: clamp(22px, 4vw, 38px)
}

.partner-form-card form {
    display: grid;
    gap: 9px
}

.partner-form-card label,
.partner-form-card legend {
    color: #d9dcef;
    font-size: 13px;
    font-weight: 700
}

.partner-form-card input,
.partner-form-card select,
.partner-form-card textarea {
    width: 100%;
    min-height: 47px;
    border: 1px solid #363c6d;
    border-radius: 10px;
    background: #0b0e29;
    color: #fff;
    padding: 11px 13px
}

.partner-form-card textarea {
    resize: vertical
}

.partner-form-card fieldset {
    margin: 12px 0;
    border: 0;
    padding: 0
}

.check-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px;
    margin-top: 10px
}

.check-grid label,
.consent {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    border: 1px solid var(--beksy-border);
    border-radius: 10px;
    padding: 10px
}

.check-grid input,
.consent input {
    width: 18px;
    min-height: 18px;
    accent-color: var(--beksy-purple)
}

.consent {
    margin: 12px 0;
    line-height: 1.55
}

.consent a {
    text-decoration: underline
}

.field-error {
    color: #ff9aac
}

.error-summary {
    margin-bottom: 20px;
    border: 1px solid #ff5c7377;
    border-radius: 12px;
    background: #ff5c7314;
    padding: 15px;
    color: #ffabb7
}

.error-summary h3 {
    margin-top: 0
}

.honeypot {
    position: absolute;
    left: -10000px
}

.thank-page {
    min-height: 70vh
}

.thank-card {
    max-width: 820px !important;
    text-align: center
}

.thank-card p {
    max-width: 700px;
    margin: 20px auto
}

.thank-card .bk-actions {
    justify-content: center
}

.reference {
    border: 1px solid var(--beksy-border);
    border-radius: 12px;
    background: var(--beksy-surface);
    padding: 14px
}

.reveal {
    opacity: 0;
    transform: translateY(20px);
    transition: .6s
}

.reveal.visible {
    opacity: 1;
    transform: none
}

@media(max-width:1000px) {
    .bk-nav nav {
        gap: 10px
    }

    .bk-nav nav>a:not(.bk-btn) {
        display: none
    }

    .bk-hero-grid,
    .experience,
    .two-col,
    .architecture,
    .form-wrap {
        grid-template-columns: 1fr
    }

    .product-visual {
        max-width: 620px
    }

    .card-grid.four,
    .pillar-grid,
    .tag-grid {
        grid-template-columns: repeat(2, 1fr)
    }

    .timeline {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:720px) {
    .bk-container {
        width: min(calc(100% - 28px), 1220px)
    }

    .bk-brand small {
        display: none
    }

    .bk-menu {
        display: block
    }

    .bk-nav nav {
        display: none;
        position: absolute;
        top: 78px;
        left: 14px;
        right: 14px;
        align-items: stretch;
        border: 1px solid var(--beksy-border);
        border-radius: 14px;
        background: #0e1130;
        padding: 12px
    }

    .bk-nav nav.open {
        display: grid
    }

    .bk-nav nav>a:not(.bk-btn) {
        display: flex
    }

    .bk-hero {
        padding-top: 65px
    }

    .bk-hero h1 {
        font-size: clamp(39px, 12vw, 58px)
    }

    .product-visual {
        min-height: 410px
    }

    .mock-window {
        inset: 20px 12px 65px 0
    }

    .mock-body {
        grid-template-columns: 75px 1fr;
        height: 300px
    }

    .mock-body aside span:nth-of-type(n+4) {
        display: none
    }

    .mock-content {
        padding: 15px
    }

    .mock-phone {
        right: 0;
        width: 120px;
        height: 230px
    }

    .float-card.two {
        left: 0
    }

    .card-grid.four,
    .card-grid.three,
    .card-grid.two,
    .pillar-grid,
    .tag-grid,
    .timeline,
    .check-grid {
        grid-template-columns: 1fr
    }

    .admin-mock {
        grid-template-columns: 90px 1fr;
        min-height: 330px
    }

    .admin-mock aside span:nth-child(n+6) {
        display: none
    }

    .bk-footer-grid {
        grid-template-columns: 1fr
    }

    .arch-flow>div {
        grid-template-columns: 1fr
    }

    .print-button {
        width: 100%
    }
}

/* Public product-status and conversion hierarchy */
.technology-partner-link {
    display: inline-flex;
    margin-top: 18px;
    color: var(--beksy-muted);
    font-size: 13px;
    font-weight: 700
}

.technology-partner-link:hover {
    color: var(--beksy-text)
}

.concept-label {
    position: absolute;
    z-index: 8;
    top: 12px;
    right: 12px;
    max-width: calc(100% - 24px);
    border: 1px solid #9a7cff66;
    border-radius: 999px;
    background: #090b21e8;
    padding: 7px 11px;
    color: #d9ccff;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em
}

.admin-mock {
    position: relative
}

.admin-mock>.concept-label {
    grid-column: 1/-1;
    width: max-content;
    justify-self: end
}

.module-status {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    margin: 4px 0 14px;
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .035em;
    line-height: 1.25
}

.module-status.foundation {
    border-color: #39d98a55;
    background: #39d98a16;
    color: #68e6a8
}

.module-status.development {
    border-color: #8b5cff66;
    background: #8b5cff18;
    color: #c3a7ff
}

.module-status.validation {
    border-color: #ffbd4a55;
    background: #ffbd4a16;
    color: #ffd17c
}

.status-explainer {
    margin-top: 26px;
    border: 1px solid #6c3bff55;
    border-left: 4px solid #8b5cff;
    border-radius: 16px;
    background: #121431aa;
    padding: 20px 22px
}

.status-explainer p {
    margin: 6px 0 0
}

.validation-panel .bk-actions {
    align-items: flex-start;
    flex-direction: column
}

.partner-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px
}

.partner-options .bk-card {
    display: flex;
    align-items: flex-start;
    flex-direction: column
}

.partner-options .bk-btn {
    margin-top: auto
}

.partner-options small {
    display: block;
    margin-top: 16px;
    color: var(--beksy-muted);
    line-height: 1.6
}

@media(max-width:720px) {
    .partner-options {
        grid-template-columns: 1fr
    }

    .concept-label {
        position: relative;
        inset: auto;
        display: inline-flex;
        margin-bottom: 12px
    }

    .admin-mock>.concept-label {
        position: absolute;
        top: 10px;
        right: 10px;
        margin: 0
    }

    .module-status {
        white-space: normal
    }
}

.early-access {
    background: radial-gradient(circle at 15% 35%, #6c3bff2b, transparent 34%), var(--beksy-bg-secondary)
}

.bk-flash {
    margin-top: 18px;
    border: 1px solid #39d98a55;
    border-radius: 12px;
    background: #39d98a16;
    padding: 14px 18px;
    color: var(--beksy-success)
}

.bk-flash.error {
    border-color: #ff5c7355;
    background: #ff5c7316;
    color: #ff9baa
}

.early-access-card {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: clamp(35px, 7vw, 90px);
    align-items: start;
    border: 1px solid #6c3bff55;
    border-radius: 28px;
    background: linear-gradient(145deg, #15193cdd, #0b0e29ee);
    padding: clamp(28px, 5vw, 64px);
    box-shadow: 0 30px 90px #0005
}

.early-access-card h2 {
    margin: 20px 0;
    font-size: clamp(36px, 5vw, 58px)
}

.early-access-card>div>ul {
    display: grid;
    gap: 10px;
    padding: 0;
    list-style: none;
    color: var(--beksy-text-secondary)
}

.early-access-card>div>li:before,
.early-access-card>div>ul li:before {
    margin-right: 8px;
    color: var(--beksy-success);
    content: '✓'
}

.early-access-form {
    display: grid;
    gap: 16px;
    border: 1px solid var(--beksy-border);
    border-radius: 20px;
    background: #111532;
    padding: clamp(22px, 4vw, 36px)
}

.early-access-form label,
.early-access-form legend {
    color: #d9dcef;
    font-size: 13px;
    font-weight: 700
}

.early-access-form input {
    width: 100%;
    min-height: 47px;
    margin-top: 7px;
    border: 1px solid #363c6d;
    border-radius: 10px;
    background: #0b0e29;
    padding: 11px 13px;
    color: #fff
}

.early-access-form fieldset {
    margin: 4px 0;
    border: 0;
    padding: 0
}

.early-access-form .check-grid input,
.early-access-form .consent input {
    width: 18px;
    min-height: 18px;
    margin: 0
}

.early-access-form>small {
    color: var(--beksy-muted)
}

@media(max-width:850px) {
    .early-access-card {
        grid-template-columns: 1fr
    }
}

@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior: auto
    }

    .reveal {
        opacity: 1;
        transform: none;
        transition: none
    }

    .bk-btn:hover {
        transform: none
    }
}

@media print {
    @page {
        size: A4;
        margin: 15mm
    }

    body {
        background: #fff !important;
        color: #111 !important;
        font-size: 10pt
    }

    body:before,
    .bk-header,
    .bk-footer,
    .form-section,
    .bk-actions,
    .print-button,
    .product-visual {
        display: none !important
    }

    .bk-section,
    .bk-hero {
        padding: 10mm 0 !important;
        break-inside: avoid
    }

    .bk-container {
        width: 100% !important
    }

    .bk-card,
    .architecture,
    .arch-flow,
    .pillar-mini span {
        background: #fff !important;
        color: #111 !important;
        border-color: #bbb !important;
        box-shadow: none !important
    }

    .bk-section p,
    .bk-card li,
    .architecture li,
    .timeline span {
        color: #333 !important
    }

    .bk-hero h1,
    .bk-section h2 {
        font-size: 22pt !important
    }

    .card-grid.four,
    .card-grid.three {
        grid-template-columns: 1fr 1fr !important
    }

    .timeline {
        grid-template-columns: 1fr 1fr !important
    }

    .bk-badge,
    .eyebrow,
    .section-head>span {
        color: #5132a8 !important
    }
}

/* Product hero — aligned with the Beksy marketing identity. */
.bk-hero:not(.partner-hero) {
    min-height: calc(100vh - 78px);
    display: flex;
    align-items: center;
    padding: clamp(64px, 8vw, 112px) 0;
    background: radial-gradient(circle at 77% 42%, #171044 0, transparent 34%)
}

.bk-hero:not(.partner-hero):before {
    width: 760px;
    height: 760px;
    top: -270px;
    right: -180px;
    background: #4017a526;
    filter: blur(28px)
}

.bk-hero:not(.partner-hero):after {
    position: absolute;
    z-index: -1;
    width: 720px;
    height: 720px;
    right: -240px;
    bottom: -330px;
    border: 1px solid #7b55ff22;
    border-radius: 50%;
    content: ""
}

.bk-hero-grid {
    grid-template-columns: minmax(0, .94fr) minmax(520px, 1.06fr);
    gap: clamp(45px, 6vw, 90px)
}

.bk-hero-copy {
    position: relative;
    z-index: 2
}

.bk-hero-copy .bk-badge {
    gap: 8px;
    padding: 9px 14px;
    border-color: #7846db88;
    background: #6c3bff0c;
    color: #c4aaff;
    font-size: 11px;
    letter-spacing: 0;
    text-transform: none
}

.bk-hero-copy .bk-badge b {
    color: #b978ff;
    font-size: 14px
}

.bk-hero-copy h1 {
    max-width: 660px;
    margin: 26px 0 24px;
    font-size: clamp(48px, 5.2vw, 72px);
    font-weight: 500;
    line-height: 1.04;
    letter-spacing: -.05em
}

.bk-hero-copy h1 span {
    display: block;
    background: linear-gradient(100deg, #b143ff 4%, #714cff 53%, #1d9cff 96%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent
}

.bk-hero-copy .bk-lead {
    max-width: 620px;
    color: #b5bad3;
    font-size: clamp(16px, 1.45vw, 19px);
    line-height: 1.68
}

.bk-hero-copy .bk-actions {
    margin-top: 28px
}

.bk-hero-copy .bk-btn {
    min-height: 46px;
    border-radius: 10px;
    padding-inline: 22px;
    font-size: 13px;
    box-shadow: none
}

.bk-hero-copy .bk-btn:first-child {
    gap: 12px
}

.bk-hero-copy .bk-btn.ghost {
    border-color: #323761;
    background: #0c0f2a;
    color: #c6cade
}

.bk-hero-copy .bk-trust {
    gap: 10px 25px;
    margin-top: 27px;
    color: #a7abc2;
    font-size: 12px
}

.bk-slogan {
    margin: 28px 0 0;
    color: #70758f;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase
}

.product-visual {
    min-height: 545px;
    isolation: isolate
}

.visual-orbit {
    position: absolute;
    z-index: -2;
    width: 620px;
    height: 620px;
    top: -130px;
    left: 55px;
    border: 1px solid #6d4cff26;
    border-radius: 50%
}

.visual-orbit:after {
    position: absolute;
    inset: 72px;
    border: 1px solid #6d4cff10;
    border-radius: inherit;
    content: ""
}

.mock-window {
    inset: 72px 18px 72px 85px;
    border-color: #313660;
    border-radius: 19px;
    background: #10142f;
    transform: none;
    box-shadow: 0 34px 90px #020312b3
}

.mock-top {
    height: 47px;
    justify-content: flex-start;
    border-color: #2d325b;
    padding: 0 18px
}

.mock-top .mock-mark {
    display: grid;
    width: 25px;
    height: 25px;
    place-items: center;
    border-radius: 8px;
    background: var(--beksy-gradient);
    font-size: 10px;
    font-weight: 900
}

.mock-top b {
    margin: 0 0 0 10px;
    font-size: 11px
}

.mock-top>i {
    width: 58px;
    height: 20px;
    margin-left: auto;
    border-radius: 6px;
    background: linear-gradient(90deg, #8e35ff, #6034ef)
}

.mock-body {
    grid-template-columns: 64px 1fr;
    height: 353px
}

.mock-body aside {
    align-items: center;
    gap: 16px;
    padding: 18px 9px
}

.mock-body aside strong {
    margin-bottom: 5px
}

.mock-body aside span {
    width: 26px;
    height: 5px;
    overflow: hidden;
    border-radius: 4px;
    background: #454b78;
    color: transparent
}

.mock-content {
    padding: 24px 21px
}

.mock-heading {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.mock-heading h3 {
    margin: 0;
    font-size: 17px
}

.mock-heading span {
    width: 62px;
    height: 20px;
    border-radius: 6px;
    background: var(--beksy-gradient)
}

.mock-stats {
    grid-template-columns: repeat(3, 1fr);
    gap: 9px;
    margin-top: 21px
}

.mock-stats span {
    min-height: 66px;
    border-color: #30355f;
    background: #171b3c;
    padding: 12px
}

.mock-stats span:before {
    width: 30px;
    height: 5px;
    border-radius: 3px;
    background: #383d66;
    content: ""
}

.mock-stats b {
    width: 52px;
    height: 10px;
    border-radius: 4px;
    background: #252a50
}

.mock-chart {
    display: flex;
    height: 122px;
    align-items: flex-end;
    gap: 10px;
    margin-top: 18px;
    padding: 15px 18px;
    border-color: #30355f;
    background: #11152f
}

.mock-chart i {
    width: 12%;
    border-radius: 5px 5px 1px 1px;
    background: linear-gradient(#16b8ff, #7341ff)
}

.mock-chart i:nth-child(1) {
    height: 28%
}

.mock-chart i:nth-child(2) {
    height: 45%
}

.mock-chart i:nth-child(3) {
    height: 38%
}

.mock-chart i:nth-child(4) {
    height: 68%
}

.mock-chart i:nth-child(5) {
    height: 58%
}

.mock-chart i:nth-child(6) {
    height: 82%
}

.mock-lines {
    display: grid;
    gap: 6px;
    margin-top: 13px
}

.mock-lines i {
    height: 5px;
    border-radius: 5px;
    background: #2e345d
}

.mock-lines i:nth-child(2) {
    width: 84%
}

.mock-lines i:nth-child(3) {
    width: 68%
}

.mock-phone {
    right: auto;
    bottom: 8px;
    left: 42px;
    width: 166px;
    height: 318px;
    overflow: hidden;
    border: 6px solid #252a53;
    border-radius: 29px;
    background: #fff7f8;
    color: #39273a;
    padding: 77px 17px 15px;
    text-align: center;
    transform: rotate(-3deg);
    box-shadow: 0 25px 65px #000b
}

.mock-phone .phone-speaker {
    position: absolute;
    top: 10px;
    left: 50%;
    width: 48px;
    height: 5px;
    margin: 0;
    border-radius: 5px;
    background: #252544;
    transform: translateX(-50%)
}

.mock-phone small {
    position: relative;
    z-index: 2;
    color: #8d7d86;
    font-size: 6px;
    letter-spacing: .18em
}

.mock-phone strong {
    position: relative;
    z-index: 2;
    margin: 23px 0 20px;
    font-family: Georgia, serif;
    font-size: 19px;
    line-height: 1.35
}

.mock-phone button {
    position: relative;
    z-index: 2;
    margin-inline: auto;
    border-radius: 99px;
    background: #b84d6e;
    color: #fff;
    padding: 0 13px;
    font-size: 7px
}

.mock-phone .phone-shape {
    position: absolute;
    z-index: 1;
    width: 155px;
    height: 130px;
    right: -35px;
    bottom: -38px;
    border-radius: 50% 50% 0 0;
    background: linear-gradient(135deg, #f0c9d3, #b95773);
    transform: rotate(25deg)
}

.float-card {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 9px;
    min-width: 112px;
    border-color: #353a67;
    border-radius: 11px;
    background: #171b3eea;
    padding: 10px 12px;
    box-shadow: 0 13px 35px #0008;
    backdrop-filter: blur(12px)
}

.float-card .float-icon {
    grid-row: 1/3;
    align-self: center;
    color: #19b9ff;
    font-size: 16px
}

.float-card small {
    color: #7f85a4;
    font-size: 7px
}

.float-card b {
    margin: 2px 0 0;
    color: #f4f5ff;
    font-size: 9px
}

.float-card.booking {
    top: 24px;
    right: 5px
}

.float-card.revenue {
    top: 100px;
    left: 40px
}

.float-card.published {
    bottom: 13px;
    left: 40px
}

.float-card.published b {
    color: #65e5a4
}

.float-card.order {
    right: -8px;
    bottom: 61px
}

@media(max-width:1050px) {
    .bk-hero-grid {
        grid-template-columns: 1fr
    }

    .bk-hero:not(.partner-hero) {
        min-height: auto
    }

    .bk-hero-copy {
        max-width: 720px
    }

    .product-visual {
        width: min(100%, 650px);
        margin: 15px auto 0
    }
}

@media(max-width:720px) {
    .bk-hero-copy h1 {
        font-size: clamp(42px, 12vw, 58px)
    }

    .bk-hero-copy h1 span {
        display: inline
    }

    .product-visual {
        min-height: 430px
    }

    .visual-orbit {
        width: 450px;
        height: 450px;
        left: 35px
    }

    .mock-window {
        inset: 50px 0 65px 48px
    }

    .mock-phone {
        left: 8px;
        width: 126px;
        height: 245px;
        padding: 56px 10px 10px
    }

    .mock-phone strong {
        margin: 15px 0;
        font-size: 14px
    }

    .float-card.revenue {
        top: 28px;
        left: 0
    }

    .float-card.booking {
        right: 0
    }

    .float-card.order {
        right: 0;
        bottom: 25px
    }

    .float-card.published {
        left: 8px;
        bottom: 3px
    }

    .mock-body {
        grid-template-columns: 48px 1fr
    }

    .mock-content {
        padding: 17px 12px
    }

    .mock-stats {
        gap: 5px
    }

    .mock-chart {
        gap: 5px;
        padding-inline: 10px
    }
}

/* Interaction parity with the Beksy monoplatform marketing UI. */
.bk-container {
    width: min(calc(100% - 48px), 1220px)
}

.bk-header {
    min-height: 84px;
    border-color: #292e5890;
    background: #07091fd9;
    backdrop-filter: blur(16px)
}

.bk-nav {
    min-height: 84px
}

.bk-brand img:first-child {
    filter: drop-shadow(0 0 18px #6c3bff55)
}

.bk-nav nav>a {
    transition: color .2s, background .2s, border-color .2s
}

.bk-btn {
    padding-inline: 24px;
    font-size: 14px;
    font-weight: 700;
    box-shadow: 0 14px 38px #6c3bff35;
    transition: transform .2s, box-shadow .2s, background .2s, border-color .2s, color .2s
}

.bk-btn:hover {
    filter: none;
    transform: translateY(-2px);
    box-shadow: 0 18px 48px #6c3bff65
}

.bk-btn.ghost {
    border-color: var(--beksy-border);
    background: #14183a99;
    color: var(--beksy-text-secondary)
}

.bk-btn.ghost:hover {
    border-color: #3b4170;
    background: #181d42;
    color: #fff;
    box-shadow: 0 15px 38px #0004
}

.bk-btn:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
button:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px var(--beksy-bg), 0 0 0 5px var(--beksy-cyan);
    border-radius: 10px
}

.bk-badge {
    font-size: 13px;
    font-weight: 650;
    text-transform: none
}

.bk-section {
    padding: 120px 0
}

.bk-section.alt {
    background: linear-gradient(180deg, transparent, #0e113070, transparent)
}

.bk-card,
.pillar,
.tag-grid>span,
.pillar-mini span {
    background: linear-gradient(145deg, var(--beksy-surface), var(--beksy-bg-secondary));
    transition: transform .25s, border-color .25s, box-shadow .25s, background .25s
}

.bk-card:hover,
.tag-grid>span:hover {
    border-color: #6c3bff88;
    transform: translateY(-5px);
    box-shadow: 0 20px 55px #6c3bff17
}

.card-icon {
    width: 48px;
    height: 48px;
    border: 1px solid #6c3bff44;
    border-radius: 14px;
    background: #6c3bff18;
    color: var(--beksy-purple-light)
}

#miert .card-grid.four {
    gap: 24px
}

#miert .card-grid.four>.bk-card {
    min-height: 270px;
    padding: 28px;
    border-radius: 20px
}

#miert .card-grid.four>.bk-card .card-icon+h3 {
    margin-top: 56px
}

.pillar-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px
}

.pillar {
    min-height: 390px;
    padding: 34px;
    border-radius: 24px
}

.pillar:after {
    width: 220px;
    height: 220px;
    right: -90px;
    bottom: -100px;
    filter: blur(25px)
}

.pillar>span {
    display: block;
    color: #ffffff12;
    font-size: 48px;
    text-align: right
}

.pillar h3 {
    margin: 18px 0 5px;
    color: var(--beksy-purple-light);
    font-size: 14px;
    text-transform: uppercase
}

.pillar h4 {
    margin: 0 0 24px;
    color: #fff;
    font-size: 30px
}

.pillar ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.pillar li {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 10px 0
}

.pillar li:before {
    color: var(--beksy-success);
    content: '✓'
}

.float-card {
    animation: bk-float 5s ease-in-out infinite
}

.float-card.booking {
    animation-delay: -1s
}

.float-card.revenue {
    animation-delay: -2s
}

.float-card.published {
    animation-delay: -3s
}

.float-card.order {
    animation-delay: -4s
}

@keyframes bk-float {
    50% {
        transform: translateY(-8px)
    }
}

.reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .55s cubic-bezier(.22, 1, .36, 1), transform .55s cubic-bezier(.22, 1, .36, 1)
}

.reveal.visible {
    opacity: 1;
    transform: translateY(0)
}

@keyframes bk-menu-in {
    from {
        opacity: 0;
        transform: translateY(-12px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes bk-menu-out {
    from {
        opacity: 1;
        transform: translateY(0)
    }

    to {
        opacity: 0;
        transform: translateY(-12px)
    }
}

@media(max-width:1000px) {
    .pillar-grid {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:720px) {
    .bk-container {
        width: min(calc(100% - 40px), 1220px)
    }

    .bk-nav nav.open {
        display: flex;
        top: 78px;
        flex-direction: column;
        gap: 8px;
        border-radius: 16px;
        background: #0e1130f5;
        padding: 20px;
        box-shadow: 0 30px 70px #000b;
        animation: bk-menu-in .2s cubic-bezier(.22, 1, .36, 1) both
    }

    .bk-nav nav.open.closing {
        animation: bk-menu-out .18s ease both
    }

    .bk-nav nav>a {
        width: 100%;
        padding: 12px
    }

    .bk-nav nav .bk-btn {
        justify-content: center
    }

    .bk-section {
        padding: 80px 0
    }

    .pillar-grid {
        grid-template-columns: 1fr
    }

    .pillar {
        min-height: 340px
    }

    #miert .card-grid.four>.bk-card {
        min-height: 230px
    }
}

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

    *,
    *:before,
    *:after {
        scroll-behavior: auto !important;
        animation: none !important;
        transition: none !important
    }

    .reveal {
        opacity: 1 !important;
        transform: none !important
    }

    .bk-btn:hover,
    .bk-card:hover,
    .tag-grid>span:hover {
        transform: none
    }
}

.program-page {
    padding-top: 80px
}

.program-page aside {
    position: sticky;
    top: 115px;
    align-self: start
}

.program-page aside h1,
.program-status-card h1 {
    margin: 22px 0;
    font-size: clamp(40px, 6vw, 66px);
    letter-spacing: -.05em
}

.program-page aside li {
    margin: 12px 0;
    color: var(--beksy-text-secondary);
    line-height: 1.6
}

.program-page aside .bk-btn {
    margin-top: 20px
}

.program-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px
}

.partner-form-card form>h2 {
    margin: 30px 0 10px;
    padding-top: 25px;
    border-top: 1px solid var(--beksy-border);
    font-size: 22px
}

.partner-form-card form>h2:first-of-type {
    margin-top: 0;
    padding-top: 0;
    border: 0
}

.program-status-card {
    max-width: 760px !important;
    border: 1px solid var(--beksy-border);
    border-radius: 24px;
    background: var(--beksy-surface);
    padding: clamp(28px, 6vw, 64px)
}

.program-status {
    display: inline-flex;
    margin-left: 10px;
    border-radius: 99px;
    background: #168bff22;
    padding: 8px 12px;
    color: #74c7ff;
    font-size: 12px;
    font-weight: 800
}

.program-status--approved {
    background: #39d98a20;
    color: var(--beksy-success)
}

.program-status--rejected,
.program-status--withdrawn {
    background: #ff5c7318;
    color: #ff8c9d
}

.program-status--under_review {
    background: #ffbd4a20;
    color: var(--beksy-warning)
}

.program-status-card dl {
    display: grid;
    margin: 28px 0;
    border-top: 1px solid var(--beksy-border)
}

.program-status-card dl div {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 20px;
    padding: 15px 0;
    border-bottom: 1px solid var(--beksy-border)
}

.program-status-card dt {
    color: var(--beksy-muted)
}

.program-status-card dd {
    margin: 0;
    font-weight: 700
}

@media(max-width:720px) {
    .program-page aside {
        position: static
    }

    .program-grid {
        grid-template-columns: 1fr
    }

    .program-status-card dl div {
        grid-template-columns: 1fr;
        gap: 5px
    }
}

.program-quickbar {
    position: relative;
    z-index: 20;
    border-bottom: 1px solid #6c3bff44;
    background: linear-gradient(90deg, #0e1130, #16113d 55%, #0d183b)
}

.program-quickbar>.bk-container,
.program-quickbar>.bk-container>div,
.program-quickbar nav {
    display: flex;
    align-items: center
}

.program-quickbar>.bk-container {
    min-height: 74px;
    justify-content: space-between;
    gap: 24px
}

.program-quickbar>.bk-container>div {
    gap: 13px
}

.program-quickbar-icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid #9a5cff55;
    border-radius: 12px;
    background: #6c3bff22;
    color: #c6aaff
}

.program-quickbar p {
    display: flex;
    margin: 0;
    flex-direction: column;
    gap: 2px
}

.program-quickbar p strong {
    font-size: 14px
}

.program-quickbar p span {
    color: var(--beksy-text-secondary);
    font-size: 12px
}

.program-quickbar nav {
    gap: 18px
}

.program-quickbar nav>a:not(.bk-btn) {
    display: flex;
    min-height: 44px;
    align-items: center;
    color: #c7cae0;
    font-size: 12px;
    font-weight: 700
}

.program-quickbar nav>a:not(.bk-btn):hover {
    color: #fff
}

.bk-program-nav {
    white-space: nowrap
}

@media(max-width:720px) {
    .program-quickbar>.bk-container {
        padding: 13px 0;
        align-items: flex-start;
        flex-direction: column
    }

    .program-quickbar nav {
        width: 100%;
        justify-content: space-between
    }

    .program-quickbar p span {
        max-width: 260px
    }

    .bk-program-nav {
        width: 100%
    }
}

/* Final responsive safeguards for the public Beksy page. */
html,
.beksy-site {
    max-width: 100%;
    overflow-x: clip
}

.bk-hero-grid,
.bk-hero-copy,
.product-visual,
.experience>* {
    min-width: 0
}

@media(max-width:720px) {
    .bk-nav {
        gap: 10px
    }

    .bk-menu {
        display: block;
        flex: 0 0 auto
    }

    .bk-brand {
        min-width: 0
    }

    .bk-hero-copy h1,
    .bk-hero-copy p,
    .technology-partner-link {
        max-width: 100%;
        overflow-wrap: anywhere
    }

    .bk-hero-copy .bk-actions,
    .bk-hero-copy .bk-actions .bk-btn {
        width: 100%
    }

    .bk-hero-copy .bk-actions .bk-btn {
        justify-content: center;
        padding-inline: 14px;
        text-align: center
    }
}

/* Keep the demo-phone copy centered inside the device at every viewport. */
.mock-phone strong {
    width: 100%;
    max-width: 100%;
    margin-inline: auto;
    font-size: 16px;
    letter-spacing: -.035em;
    line-height: 1.25;
    overflow-wrap: anywhere;
    text-align: center
}

@media(max-width:720px) {
    .mock-phone strong {
        font-size: 12px;
        letter-spacing: -.025em
    }
}

/* Content hierarchy, FAQ and comparison components reuse Beksy's existing visual tokens. */
.hero-reassurance {
    max-width: 620px;
    margin: 18px 0 0;
    color: var(--beksy-muted);
    font-size: 13px
}

.benefit-grid .bk-card,
.comparison-grid .bk-card {
    min-height: 100%
}

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

.comparison-target {
    border-color: #6c3bff70 !important
}

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

.faq-list {
    display: grid;
    gap: 12px;
    max-width: 900px
}

.faq-item {
    border: 1px solid var(--beksy-border);
    border-radius: 16px;
    background: var(--beksy-surface);
    padding: 0 20px
}

.faq-item summary {
    cursor: pointer;
    padding: 18px 28px 18px 0;
    color: var(--beksy-text);
    font-weight: 800;
    list-style: none
}

.faq-item summary::-webkit-details-marker {
    display: none
}

.faq-item summary:after {
    float: right;
    content: '+';
    color: var(--beksy-purple-light);
    font-size: 20px;
    line-height: .8
}

.faq-item[open] summary:after {
    content: '−'
}

.faq-item p {
    max-width: 760px;
    margin: 0 0 18px
}

.faq-item summary:focus-visible,
.bk-menu:focus-visible,
.bk-btn:focus-visible,
.technology-partner-link:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 3px
}

.early-access-form button[disabled],
.partner-form-card button[disabled] {
    cursor: wait;
    opacity: .72
}

@media(max-width:720px) {
    .comparison-grid,
    .customer-steps {
        grid-template-columns: 1fr
    }

    .faq-item {
        padding-inline: 16px
    }
}