/* Public homepage imported from the Readient design source. */
.homepage {
    background: #f5f6f7;
    color: #111820;
    font-family: "IBM Plex Sans", system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
}

.homepage .site-header {
    display: none;
}

.homepage .site-main {
    min-height: 100vh;
}

.homepage .skip-link {
    background: #5ee0a1;
    color: #07130d;
}

.home {
    overflow-x: hidden;
    background: #f5f6f7;
}

.home a {
    color: #0f7a52;
    text-decoration: none;
}

.home a:hover {
    color: #0c6444;
}

.home h1,
.home h2,
.home h3,
.home p {
    letter-spacing: 0;
}

.home-container {
    width: min(100% - 48px, 1120px);
    margin: 0 auto;
}

.home-nav {
    position: sticky;
    z-index: 50;
    top: 0;
    display: flex;
    min-height: 65px;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 14px 24px;
    border-bottom: 1px solid rgb(255 255 255 / 8%);
    background: rgb(10 14 19 / 72%);
    backdrop-filter: blur(14px);
}

.home-brand,
.home-footer__brand > div {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    font-family: "Space Grotesk", sans-serif;
    font-size: 1.1875rem;
    font-weight: 600;
}

.home .home-brand,
.home .home-brand:hover {
    color: #fff;
}

.home-nav__right,
.home-nav__links,
.home-nav__actions {
    display: flex;
    align-items: center;
}

.home-nav__right {
    gap: 28px;
}

.home-nav__links {
    gap: 28px;
}

.home-nav__actions {
    gap: 14px;
}

.home .home-nav__links a,
.home .home-nav__login {
    color: #c6cfd6;
    font-size: 0.90625rem;
}

.home .home-nav__links a:hover,
.home .home-nav__login:hover {
    color: #fff;
}

.home-button {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 9px;
    cursor: pointer;
    font-family: "IBM Plex Sans", sans-serif;
    font-size: 0.90625rem;
    font-weight: 600;
    padding: 10px 16px;
    transition: background-color 150ms ease, color 150ms ease, box-shadow 150ms ease;
}

.home .home-button--accent,
.home .home-button--accent:hover {
    background: #5ee0a1;
    color: #07130d;
}

.home .home-button--accent:hover {
    background: #7cebb5;
}

.home .home-button--dark,
.home .home-button--dark:hover {
    background: #111820;
    color: #fff;
}

.home .home-button--dark:hover {
    background: #000;
}

.home a:focus-visible,
.home button:focus-visible,
.home input:focus-visible {
    outline: 3px solid rgb(94 224 161 / 45%);
    outline-offset: 3px;
}

.home-hero {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #0a0e13 0%, #0b1016 55%, #0a0e13 100%);
    color: #fff;
}

.home-hero__canvas,
.home-hero__veil {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.home-hero__canvas {
    display: block;
}

.home-hero__veil {
    background: radial-gradient(1200px 620px at 68% 26%, rgb(94 224 161 / 10%), transparent 60%), linear-gradient(180deg, rgb(10 14 19 / 20%) 0%, rgb(10 14 19 / 55%) 78%, #0a0e13 100%);
    pointer-events: none;
}

.home-hero__inner {
    position: relative;
    z-index: 2;
    padding-top: 96px;
    padding-bottom: 108px;
}

.home-hero__content {
    max-width: 660px;
}

.home-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 26px;
    border: 1px solid rgb(94 224 161 / 28%);
    border-radius: 999px;
    background: rgb(94 224 161 / 6%);
    color: #8ef0c0;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.75rem;
    padding: 6px 12px;
}

.home-kicker span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    animation: home-pulse 2.4s ease-in-out infinite;
    background: #5ee0a1;
}

.home-hero h1 {
    margin: 0 0 22px;
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(2.375rem, 6.4vw, 4.25rem);
    font-weight: 600;
    line-height: 1.02;
}

.home-hero h1 strong {
    color: #5ee0a1;
    font-weight: inherit;
}

.home-hero__lead {
    max-width: 560px;
    margin: 0 0 34px;
    color: #b9c3cb;
    font-size: clamp(1rem, 1.5vw, 1.1875rem);
    line-height: 1.55;
}

.home-hero__lead code {
    color: #dfe8ee;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.92em;
}

.home-scan {
    display: flex;
    width: min(100%, 540px);
    align-items: center;
    gap: 10px;
    border: 1px solid rgb(255 255 255 / 13%);
    border-radius: 14px;
    background: rgb(255 255 255 / 5%);
    padding: 8px;
    backdrop-filter: blur(8px);
}

.home-scan__field {
    display: flex;
    min-width: 0;
    flex: 1 1 240px;
    align-items: center;
    gap: 10px;
    padding-left: 14px;
}

.home-scan__field > span:not(.visually-hidden) {
    color: #5c6b76;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.875rem;
}

.home-scan__field input {
    width: 100%;
    min-width: 100px;
    border: 0;
    outline: 0;
    background: transparent;
    color: #fff;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.9375rem;
    padding: 12px 0;
}

.home-scan__field input::placeholder {
    color: #65717b;
}

.home-scan__submit {
    flex: 0 0 auto;
    padding-inline: 22px;
    white-space: nowrap;
}

.home-scan__error {
    width: min(100%, 540px);
    margin: 10px 0 0;
    border: 1px solid rgb(255 143 157 / 30%);
    border-radius: 8px;
    background: rgb(255 143 157 / 9%);
    color: #ffc2ca;
    font-size: 0.8125rem;
    padding: 9px 12px;
}

.home-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
}

.home-checks span {
    border: 1px solid rgb(255 255 255 / 11%);
    border-radius: 6px;
    color: #8b96a0;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.71875rem;
    padding: 5px 9px;
}

.home-scan__note {
    margin: 22px 0 0;
    color: #6b7680;
    font-size: 0.78125rem;
}

.home-flow {
    position: relative;
    z-index: 2;
    border-top: 1px solid rgb(255 255 255 / 7%);
    background: rgb(10 14 19 / 40%);
}

.home-flow__inner {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    padding-top: 20px;
    padding-bottom: 20px;
    color: #7f8b95;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.8125rem;
}

.home-flow__inner b {
    color: #5ee0a1;
    font-weight: 400;
}

.home-flow__inner strong {
    color: #cfd8de;
    font-weight: 400;
}

.home-flow__inner em {
    color: #8ef0c0;
    font-style: normal;
}

.home-section {
    padding-top: 96px;
    padding-bottom: 40px;
}

.home-section__intro {
    max-width: 640px;
    margin-bottom: 52px;
}

.home-label {
    margin: 0 0 14px;
    color: #0f7a52;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.75rem;
    text-transform: uppercase;
}

.home-label--light {
    color: #5ee0a1;
}

.home-section h2,
.home-outputs h2,
.home-pricing h2,
.home-cta h2 {
    margin: 0 0 16px;
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(1.75rem, 3.6vw, 2.5rem);
    font-weight: 600;
    line-height: 1.08;
}

.home-section__intro > p:last-child {
    margin: 0;
    color: #5b6670;
    font-size: 1.0625rem;
    line-height: 1.55;
}

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

.home-feature {
    min-height: 210px;
    border: 1px solid #e7e9ec;
    border-radius: 16px;
    background: #fff;
    padding: 26px 24px;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

.home-feature:hover {
    border-color: #c9d6cf;
    box-shadow: 0 8px 30px rgb(16 24 32 / 6%);
}

.home-feature__tag {
    display: flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    border: 1px solid #cdeedd;
    border-radius: 10px;
    background: #eafaf1;
    color: #0f7a52;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.9375rem;
    font-weight: 500;
}

.home-feature h3,
.home-steps h3 {
    margin: 0 0 9px;
    font-family: "Space Grotesk", sans-serif;
    font-size: 1.1875rem;
    font-weight: 600;
}

.home-feature p {
    margin: 0;
    color: #5b6670;
    font-size: 0.90625rem;
    line-height: 1.55;
}

.home-steps {
    display: grid;
    overflow: hidden;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 60px;
    margin-bottom: 40px;
    border: 1px solid #e7e9ec;
    border-radius: 16px;
    background: #fff;
}

.home-steps article {
    min-height: 186px;
    padding: 30px 26px;
    border-right: 1px solid #eef0f2;
}

.home-steps article:last-child {
    border-right: 0;
}

.home-steps article > span {
    display: block;
    margin-bottom: 16px;
    color: #12925f;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.8125rem;
}

.home-steps h3 {
    font-size: 1.0625rem;
}

.home-steps p {
    margin: 0;
    color: #6b7580;
    font-size: 0.84375rem;
    line-height: 1.5;
}

.home-outputs {
    margin-top: 56px;
    background: #0a0e13;
    color: #fff;
}

.home-outputs__grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    align-items: center;
    gap: 56px;
    padding-top: 88px;
    padding-bottom: 88px;
}

.home-outputs__lead {
    margin: 0 0 28px;
    color: #aeb9c1;
    font-size: 1.03125rem;
    line-height: 1.6;
}

.home-endpoints {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.home-endpoints div {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #cbd4db;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.84375rem;
}

.home-endpoints span {
    color: #5ee0a1;
}

.home-endpoints code {
    font: inherit;
}

.home-terminal {
    overflow: hidden;
    min-width: 0;
    border: 1px solid rgb(255 255 255 / 10%);
    border-radius: 14px;
    background: #0e141b;
    box-shadow: 0 30px 80px rgb(0 0 0 / 40%);
}

.home-terminal__bar {
    display: flex;
    min-height: 42px;
    align-items: center;
    gap: 8px;
    padding: 13px 16px;
    border-bottom: 1px solid rgb(255 255 255 / 8%);
}

.home-terminal__bar i {
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #ff5f57;
}

.home-terminal__bar i:nth-child(2) {
    background: #febc2e;
}

.home-terminal__bar i:nth-child(3) {
    background: #28c840;
}

.home-terminal__bar span {
    margin-left: 10px;
    color: #7f8b95;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.75rem;
}

.home-terminal__tabs {
    display: flex;
    gap: 2px;
    overflow-x: auto;
    border-bottom: 1px solid rgb(255 255 255 / 6%);
    padding: 10px 12px 0;
}

.home-terminal__tabs button {
    min-height: 39px;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 6px 6px 0 0;
    background: transparent;
    color: #7f8b95;
    cursor: pointer;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.78125rem;
    padding: 9px 12px;
    white-space: nowrap;
}

.home-terminal__tabs button[aria-selected="true"] {
    border-bottom-color: #5ee0a1;
    background: rgb(94 224 161 / 12%);
    color: #8ef0c0;
}

.home-terminal pre {
    overflow-x: auto;
    min-height: 320px;
    margin: 0;
    color: #c8d2da;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.78125rem;
    line-height: 1.7;
    padding: 22px 20px;
    white-space: pre;
}

.home-terminal pre[hidden] {
    display: none;
}

.home-developers {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    padding-top: 96px;
    padding-bottom: 96px;
}

.home-developer-card {
    min-width: 0;
    border: 1px solid #e7e9ec;
    border-radius: 18px;
    background: #fff;
    padding: 38px 34px;
}

.home-developer-card h3 {
    margin: 0 0 14px;
    font-family: "Space Grotesk", sans-serif;
    font-size: 1.625rem;
    font-weight: 600;
    line-height: 1.2;
}

.home-developer-card > p:not(.home-label) {
    margin: 0 0 22px;
    color: #5b6670;
    font-size: 0.96875rem;
    line-height: 1.6;
}

.home-connectors {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.home-connectors span {
    border: 1px solid #e7e9ec;
    border-radius: 8px;
    background: #f3f5f6;
    color: #374049;
    font-size: 0.8125rem;
    padding: 7px 12px;
}

.home-developer-card--dark {
    border-color: rgb(255 255 255 / 10%);
    background: #0e141b;
    color: #fff;
}

.home-developer-card--dark > p:not(.home-label) {
    color: #aeb9c1;
}

.home-developer-card pre {
    overflow-x: auto;
    margin: 0;
    border: 1px solid rgb(255 255 255 / 8%);
    border-radius: 10px;
    background: #080c11;
    color: #c8d2da;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.78125rem;
    line-height: 1.65;
    padding: 18px;
}

.home-pricing {
    border-top: 1px solid #e7e9ec;
    border-bottom: 1px solid #e7e9ec;
    background: #f0f2f3;
}

.home-pricing > .home-container {
    padding-top: 88px;
    padding-bottom: 88px;
}

.home-pricing__intro {
    max-width: 560px;
    margin: 0 auto 48px;
    text-align: center;
}

.home-pricing__intro > p:last-child {
    margin: 0;
    color: #5b6670;
}

.home-plans {
    display: grid;
    max-width: 820px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin: 0 auto;
}

.home-plan {
    position: relative;
    border: 1px solid #e7e9ec;
    border-radius: 18px;
    background: #fff;
    padding: 34px 30px;
}

.home-plan h3 {
    margin: 0 0 4px;
    font-family: "Space Grotesk", sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
}

.home-plan > p {
    min-height: 21px;
    margin: 0 0 20px;
    color: #6b7580;
    font-size: 0.84375rem;
}

.home-plan__price {
    min-height: 62px;
    margin-bottom: 2px;
    font-family: "Space Grotesk", sans-serif;
    font-size: 2.5rem;
    font-weight: 600;
}

.home-plan__price span {
    color: #9aa5ad;
    font-size: 1rem;
    font-weight: 400;
}

.home-plan > .home-button {
    display: flex;
    width: 100%;
    margin-bottom: 24px;
}

.home-plan ul {
    display: flex;
    flex-direction: column;
    gap: 11px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.home-plan li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #374049;
    font-size: 0.875rem;
}

.home-plan li span {
    color: #12925f;
    font-weight: 600;
}

.home-plan--live {
    border-color: #0a0e13;
    background: #0a0e13;
    box-shadow: 0 24px 60px rgb(16 24 32 / 18%);
    color: #fff;
}

.home-plan--live > p {
    color: #9aa5ad;
}

.home-plan--live li {
    color: #cbd4db;
}

.home-plan--live li span {
    color: #5ee0a1;
}

.home-plan__badge {
    position: absolute;
    top: 26px;
    right: 26px;
    border-radius: 6px;
    background: #5ee0a1;
    color: #07130d;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.6875rem;
    padding: 4px 9px;
}

.home-cta {
    background: #0a0e13;
    color: #fff;
    text-align: center;
}

.home-cta > .home-container {
    padding-top: 96px;
    padding-bottom: 96px;
}

.home-cta h2 {
    max-width: 640px;
    margin-right: auto;
    margin-left: auto;
    font-size: clamp(1.875rem, 4.4vw, 3.25rem);
    line-height: 1.06;
}

.home-cta p {
    max-width: 480px;
    margin: 0 auto 34px;
    color: #aeb9c1;
    font-size: 1.0625rem;
}

.home-cta .home-button {
    min-height: 50px;
    padding-inline: 30px;
    font-size: 1rem;
}

.home-footer {
    border-top: 1px solid rgb(255 255 255 / 6%);
    background: #080b0f;
    color: #8b96a0;
}

.home-footer > .home-container {
    padding-top: 56px;
    padding-bottom: 40px;
}

.home-footer__grid {
    display: grid;
    grid-template-columns: 2fr repeat(3, 1fr);
    gap: 32px;
    margin-bottom: 44px;
}

.home-footer__brand > div {
    gap: 10px;
    color: #fff;
    font-size: 1.0625rem;
}

.home-footer__brand p {
    max-width: 220px;
    margin: 14px 0 0;
    font-size: 0.8125rem;
    line-height: 1.55;
}

.home-footer__column {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.home-footer__column h3 {
    margin: 0 0 4px;
    color: #5c6670;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.6875rem;
    font-weight: 400;
    text-transform: uppercase;
}

.home .home-footer__column a {
    color: #9aa5ad;
    font-size: 0.84375rem;
}

.home .home-footer__column a:hover {
    color: #fff;
}

.home-footer__legal {
    border-top: 1px solid rgb(255 255 255 / 7%);
    color: #5c6670;
    font-size: 0.75rem;
    line-height: 1.6;
    padding-top: 24px;
}

.home-footer__legal p {
    margin: 0 0 8px;
}

.home-footer__legal p:last-child {
    margin-bottom: 0;
}

@keyframes home-pulse {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 1; }
}

@media (max-width: 900px) {
    .home-nav__links {
        display: none;
    }

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

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

    .home-steps article:nth-child(2) {
        border-right: 0;
    }

    .home-steps article:nth-child(-n + 2) {
        border-bottom: 1px solid #eef0f2;
    }

    .home-outputs__grid {
        grid-template-columns: 1fr;
    }

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

@media (max-width: 700px) {
    .home-container {
        width: min(100% - 32px, 1120px);
    }

    .home-nav {
        padding-inline: 16px;
    }

    .home-nav__scan {
        display: none;
    }

    .home-hero__inner {
        padding-top: 68px;
        padding-bottom: 76px;
    }

    .home-hero h1 br {
        display: none;
    }

    .home-flow__inner {
        gap: 9px;
        font-size: 0.6875rem;
    }

    .home-feature-grid,
    .home-developers,
    .home-plans {
        grid-template-columns: 1fr;
    }

    .home-section,
    .home-developers {
        padding-top: 70px;
        padding-bottom: 30px;
    }

    .home-outputs__grid,
    .home-pricing > .home-container,
    .home-cta > .home-container {
        padding-top: 70px;
        padding-bottom: 70px;
    }
}

@media (max-width: 480px) {
    .home-brand span {
        font-size: 1.0625rem;
    }

    .home-kicker {
        align-items: flex-start;
        border-radius: 8px;
        line-height: 1.4;
    }

    .home-kicker span {
        flex: 0 0 auto;
        margin-top: 5px;
    }

    .home-hero h1 {
        font-size: 2.375rem;
    }

    .home-scan {
        align-items: stretch;
        flex-direction: column;
    }

    .home-scan__field {
        min-height: 48px;
        flex-basis: auto;
        padding-right: 14px;
    }

    .home-scan__submit {
        width: 100%;
    }

    .home-feature-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .home-steps {
        grid-template-columns: 1fr;
    }

    .home-steps article,
    .home-steps article:nth-child(2) {
        border-right: 0;
        border-bottom: 1px solid #eef0f2;
    }

    .home-steps article:last-child {
        border-bottom: 0;
    }

    .home-terminal__bar span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .home-developer-card,
    .home-plan {
        padding: 28px 22px;
    }

    .home-plan__badge {
        top: 22px;
        right: 22px;
    }

    .home-footer__grid {
        grid-template-columns: 1fr 1fr;
    }

    .home-footer__brand {
        grid-column: 1 / -1;
    }
}
