:root {
    --ksbc-navy: #08185c;
    --ksbc-blue: #0867f2;
    --ksbc-blue-2: #2f7cf6;
    --ksbc-ink: #173368;
    --ksbc-soft: #eef6ff;
    --ksbc-border: #dbe9fb;
    --ksbc-footer: #061f4d;
}

html { scroll-behavior: smooth; }
body.ksbc-landing-page {
    margin: 0;
    background: #fff;
    color: var(--ksbc-ink);
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}

body.ksbc-landing-page * { box-sizing: border-box; }
body.ksbc-landing-page a { text-decoration: none; }

.ksbc-landing-shell {
    width: 100%;
    min-height: 100vh;
    background: #fff;
}

.ksbc-landing-header,
.ksbc-landing-main,
.ksbc-footer-inner {
    width: min(1480px, calc(100% - 72px));
    margin-inline: auto;
}

.ksbc-landing-header {
    min-height: 88px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.ksbc-brand,
.ksbc-footer-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--ksbc-navy);
    font-weight: 800;
    letter-spacing: -0.035em;
}

.ksbc-brand { font-size: clamp(24px, 2vw, 34px); }
.ksbc-footer-brand { font-size: 18px; color: #fff; }
.ksbc-brand-mark { width: 48px; height: 48px; flex: 0 0 48px; }
.ksbc-footer-brand .ksbc-brand-mark { width: 40px; height: 40px; flex-basis: 40px; }

.ksbc-login-button {
    min-width: 132px;
    height: 52px;
    padding: 0 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-radius: 9px;
    background: linear-gradient(135deg, #1182ff 0%, #0867f2 100%);
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    box-shadow: 0 12px 24px rgba(8, 103, 242, .16);
    transition: transform .2s ease, box-shadow .2s ease;
}
.ksbc-login-button:hover,
.ksbc-login-button:focus-visible { transform: translateY(-1px); box-shadow: 0 16px 30px rgba(8,103,242,.24); color: #fff; }
.ksbc-login-button .ksbc-svg-icon { width: 18px; height: 18px; }

.ksbc-landing-main { padding-bottom: 28px; }

.ksbc-hero {
    min-height: 445px;
    display: grid;
    grid-template-columns: 57% 43%;
    overflow: hidden;
    position: relative;
    border-radius: 16px;
    background:
        radial-gradient(circle at 2% 8%, rgba(128,180,255,.24) 0 11%, transparent 11.4%),
        radial-gradient(circle at 50% 110%, rgba(130,183,255,.18) 0 20%, transparent 20.4%),
        linear-gradient(108deg, #eaf4ff 0%, #f9fcff 58%, #edf6ff 100%);
    box-shadow: inset 0 0 0 1px rgba(210,228,250,.65);
}

.ksbc-hero::before,
.ksbc-hero::after {
    content: "";
    position: absolute;
    width: 112px;
    height: 112px;
    opacity: .48;
    background-image: radial-gradient(circle, rgba(70,145,246,.58) 0 2px, transparent 2.3px);
    background-size: 17px 17px;
    pointer-events: none;
    z-index: 0;
}
.ksbc-hero::before { left: -26px; top: 235px; }
.ksbc-hero::after { left: 50.5%; top: 170px; }

.ksbc-hero-copy {
    position: relative;
    z-index: 2;
    padding: 62px 42px 48px 92px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.ksbc-eyebrow {
    margin-bottom: 16px;
    color: #0867f2;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .24em;
}
.ksbc-eyebrow span { margin: 0 8px; }

.ksbc-hero h1 {
    margin: 0;
    color: var(--ksbc-navy);
    font-size: clamp(44px, 4.2vw, 68px);
    line-height: .98;
    letter-spacing: -0.048em;
    font-weight: 800;
}
.ksbc-hero h1 span { color: var(--ksbc-blue); }

.ksbc-hero-subtitle {
    margin: 20px 0 0;
    color: #3d5a89;
    font-size: clamp(19px, 1.45vw, 26px);
    line-height: 1.26;
    letter-spacing: -.02em;
}

.ksbc-trust-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 28px;
    max-width: 700px;
}

.ksbc-trust-item {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    color: #18356a;
    font-size: 14px;
    line-height: 1.2;
    border-right: 1px solid #c9ddf5;
}
.ksbc-trust-item:first-child { padding-left: 0; }
.ksbc-trust-item:last-child { border-right: 0; }
.ksbc-trust-icon,
.ksbc-feature-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border-radius: 16px;
    color: #0867f2;
    background: #e5f1ff;
}
.ksbc-trust-icon { width: 46px; height: 46px; }
.ksbc-trust-icon .ksbc-svg-icon { width: 25px; height: 25px; }

.ksbc-primary-cta {
    margin-top: 26px;
    width: max-content;
    min-width: 302px;
    min-height: 52px;
    padding: 0 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    border-radius: 8px;
    background: linear-gradient(135deg, #0f7cfb 0%, #0a63ef 100%);
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    box-shadow: 0 12px 24px rgba(8,103,242,.18);
    transition: transform .2s ease, box-shadow .2s ease;
}
.ksbc-primary-cta:hover,
.ksbc-primary-cta:focus-visible { color: #fff; transform: translateY(-1px); box-shadow: 0 15px 28px rgba(8,103,242,.24); }

.ksbc-hero-visual {
    position: relative;
    z-index: 1;
    min-height: 445px;
    overflow: hidden;
}
.ksbc-hero-visual::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 -18%;
    width: 40%;
    z-index: 2;
    background: linear-gradient(90deg, rgba(245,250,255,.94), rgba(245,250,255,.15), transparent);
    pointer-events: none;
}
.ksbc-hero-visual img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center center;
}

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

.ksbc-feature-card {
    min-height: 144px;
    padding: 26px 24px;
    display: flex;
    align-items: flex-start;
    gap: 18px;
    border: 1px solid var(--ksbc-border);
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(20, 64, 120, .035);
}
.ksbc-feature-icon { width: 66px; height: 66px; flex-basis: 66px; border-radius: 50%; }
.ksbc-feature-icon .ksbc-svg-icon { width: 31px; height: 31px; }
.ksbc-feature-card:nth-child(2) .ksbc-feature-icon { color: #13a866; background: #e8f8f0; }
.ksbc-feature-card:nth-child(4) .ksbc-feature-icon { color: #7c3ee8; background: #f3eaff; }
.ksbc-feature-card h2 {
    margin: 3px 0 7px;
    color: var(--ksbc-navy);
    font-size: 19px;
    line-height: 1.15;
    letter-spacing: -.025em;
}
.ksbc-feature-card p {
    margin: 0;
    color: #45618d;
    font-size: 15.5px;
    line-height: 1.43;
}

.ksbc-stats {
    margin-top: 22px;
    min-height: 108px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: center;
    overflow: hidden;
    border-radius: 15px;
    background: linear-gradient(90deg, #edf6ff 0%, #f5faff 50%, #eaf4ff 100%);
    border: 1px solid #e2eefc;
}

.ksbc-stat-item {
    min-height: 66px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    padding: 0 26px;
    border-right: 1px solid #bfd7f5;
}
.ksbc-stat-item:last-child { border-right: 0; }
.ksbc-stat-icon { color: #0670f5; display: inline-flex; }
.ksbc-stat-icon .ksbc-svg-icon { width: 38px; height: 38px; }
.ksbc-stat-item div { display: flex; flex-direction: column; gap: 2px; }
.ksbc-stat-item strong {
    color: var(--ksbc-navy);
    font-size: 28px;
    line-height: 1;
    letter-spacing: -.03em;
}
.ksbc-stat-item span:last-child {
    color: #3f5a86;
    font-size: 14px;
}

.ksbc-landing-footer {
    min-height: 82px;
    background: var(--ksbc-footer);
    color: #fff;
}
.ksbc-footer-inner {
    min-height: 82px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}
.ksbc-copyright {
    color: #fff;
    font-size: 14px;
    white-space: nowrap;
}

.ksbc-svg-icon { display: block; width: 24px; height: 24px; }

@media (max-width: 1180px) {
    .ksbc-landing-header,
    .ksbc-landing-main,
    .ksbc-footer-inner { width: min(100% - 40px, 1480px); }
    .ksbc-hero { grid-template-columns: 56% 44%; }
    .ksbc-hero-copy { padding-left: 48px; padding-right: 28px; }
    .ksbc-trust-row { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
    .ksbc-trust-item { border-right: 0; padding: 0; }
    .ksbc-feature-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .ksbc-stats { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .ksbc-stat-item:nth-child(2) { border-right: 0; }
    .ksbc-stat-item:nth-child(-n+2) { border-bottom: 1px solid #bfd7f5; }
}

@media (max-width: 780px) {
    .ksbc-landing-header,
    .ksbc-landing-main,
    .ksbc-footer-inner { width: calc(100% - 28px); }
    .ksbc-landing-header { min-height: 74px; }
    .ksbc-brand { font-size: 20px; }
    .ksbc-brand-mark { width: 38px; height: 38px; flex-basis: 38px; }
    .ksbc-login-button { min-width: 104px; height: 46px; padding: 0 16px; font-size: 15px; }
    .ksbc-hero { grid-template-columns: 1fr; }
    .ksbc-hero-copy { padding: 42px 28px 34px; }
    .ksbc-hero h1 { font-size: clamp(40px, 12vw, 58px); }
    .ksbc-hero-subtitle br { display: none; }
    .ksbc-hero-visual { min-height: 320px; }
    .ksbc-trust-row { max-width: none; }
    .ksbc-primary-cta { min-width: 0; width: 100%; }
    .ksbc-feature-grid { grid-template-columns: 1fr; }
    .ksbc-stats { grid-template-columns: 1fr; }
    .ksbc-stat-item { border-right: 0; border-bottom: 1px solid #bfd7f5; justify-content: flex-start; padding-left: 34px; }
    .ksbc-stat-item:last-child { border-bottom: 0; }
    .ksbc-footer-inner { min-height: 108px; flex-direction: column; justify-content: center; text-align: center; }
    .ksbc-copyright { white-space: normal; line-height: 1.45; }
}

@media (max-width: 520px) {
    .ksbc-brand span { max-width: 190px; line-height: 1.05; }
    .ksbc-hero-copy { padding: 36px 22px 30px; }
    .ksbc-eyebrow { font-size: 11px; letter-spacing: .18em; }
    .ksbc-trust-row { grid-template-columns: 1fr 1fr; }
    .ksbc-feature-card { padding: 22px 18px; }
}