/*===================================================
    // SHARED
    /==================================================*/

    .home-head {
        max-width: 760px;
        margin: 0 auto var(--margin-large);
        text-align: center;
    }

    .home-head h2,
    .home-ai h2 {
        margin-top: var(--margin-xsmall);
        font-size: clamp(34px, 4.4vw, 52px);
        line-height: 1.05;
        letter-spacing: -0.035em;
        text-wrap: balance;
    }

    .home-head-split {
        max-width: none;
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: var(--gap-medium);
        text-align: left;
    }

    .home-overline {
        display: inline-flex;
        align-items: center;
        gap: var(--gap-xsmall);
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        color: var(--primary-color);
    }

    .home-badge {
        padding: 2px var(--padding-xsmall);
        border-radius: 999px;
        background: var(--accent-color-15);
        font-size: 9.5px;
        letter-spacing: 0.12em;
        color: var(--accent-color);
    }

    .home-link {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 15px;
        font-weight: 600;
        color: var(--primary-color);
    }

    .home-link .fa {
        font-size: 11px;
        transition: transform 400ms var(--ease-out);
    }

    .home-link:hover .fa {
        transform: translateX(3px);
    }

    .home-bar {
        display: block;
        height: 4px;
        overflow: hidden;
        border-radius: var(--radius-small);
        background: #e9edf2;
    }

    .home-bar i {
        display: block;
        height: 100%;
        border-radius: var(--radius-small);
        background: var(--brand, var(--primary-color));
    }


    /*===================================================
    // HERO
    /==================================================*/

    /* The home hero runs the Deploy hero with one Untold brand, so no brand dots */
    .deploy-dots i:only-child {
        display: none;
    }


    /*===================================================
    // STORY
    /==================================================*/

    /* Chapters scroll on the left while the phone stays put on the right */
    .home-story {
        padding: var(--padding-large) 0;
    }

    .home-story-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        align-items: start;
        gap: var(--gap-large);
    }

    .home-chapter {
        min-height: 88vh;
        max-width: 460px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        opacity: 0.2;
        transition: opacity 600ms ease;
    }

    .home-chapter.is-active {
        opacity: 1;
    }

    .home-chapter-title {
        margin-top: var(--margin-small);
        font-size: clamp(30px, 3.4vw, 44px);
        line-height: 1.08;
        letter-spacing: -0.03em;
        text-wrap: balance;
    }

    .home-chapter-text {
        margin-top: var(--margin-small);
        padding-bottom: 0;
        font-size: 18px;
        line-height: 1.6;
    }

    .home-chapter .home-link {
        margin-top: var(--margin-medium);
    }

    .home-story-stage {
        --phone-scale: 1;

        position: sticky;
        top: calc(var(--header-height) + var(--padding-small));
        height: calc(100vh - var(--header-height) - var(--padding-small) * 2);
        min-height: 560px;
        display: grid;
        place-items: center;
        overflow: hidden;
        border-radius: var(--radius-xlarge);
        background: var(--surface-color);
    }

    .home-story-stage .hero-phone {
        transform: scale(var(--phone-scale));
    }

    .home-story-dots {
        position: absolute;
        top: 50%;
        right: var(--padding-medium);
        display: flex;
        flex-direction: column;
        gap: var(--gap-xsmall);
        margin: 0;
        padding: 0;
        list-style: none;
        transform: translateY(-50%);
    }

    .home-story-dots li {
        width: 6px;
        height: 6px;
        border-radius: 999px;
        background: rgba(0, 13, 35, 0.15);
        transition: height 500ms var(--ease-out), background-color 400ms ease;
    }

    .home-story-dots .is-active {
        height: 22px;
        background: var(--primary-color);
    }


    /*===================================================
    // SCREENS
    /==================================================*/

    .home-screens {
        position: relative;
        flex: 1 1 auto;
        min-height: 0;
    }

    .home-screen {
        position: absolute;
        inset: 0;
        display: flex;
        flex-direction: column;
        background: #fff;
        opacity: 0;
        transform: translateY(16px);
        transition: opacity 500ms ease, transform 700ms var(--ease-out);
    }

    .home-screen.is-active {
        opacity: 1;
        transform: none;
    }

    .home-screen strong {
        font-weight: 700;
        color: var(--dark-dark-color);
    }

    .home-screen small {
        font-size: 10px;
        color: var(--ink-soft-color);
    }

    .home-app-icon {
        width: 28px;
        height: 28px;
        display: grid;
        place-items: center;
        border-radius: var(--radius);
        background: var(--brand);
        font-size: 13px;
        font-weight: 800;
        color: #fff;
    }

    .home-tabbar {
        margin-top: auto;
        display: flex;
        align-items: center;
        justify-content: space-around;
        padding: var(--padding-xsmall) var(--padding-small);
        background: #fff;
    }

    .home-tabbar .fa {
        font-size: 17px;
        color: var(--ink-soft-color);
    }

    .home-tabbar .fa.is-active {
        color: var(--brand, var(--primary-color));
    }

    .home-tabbar img {
        display: block;
        width: 22px;
        height: 22px;
        border-radius: 50%;
    }


    /*=== Pathway ===*/

    .home-screen-pathway .pathway-step-status .fa-circle {
        color: var(--dark-light-color);
    }

    .home-screen-pathway .pathway-step-status .fa-lock {
        color: var(--ink-soft-color);
    }


    /*=== Discover ===*/

    .home-discover {
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
        background: #f7f8fa;
    }

    .home-discover-head {
        position: relative;
        padding: var(--padding-xxsmall) var(--padding-small) 10px;
        background: #fff;
        text-align: center;
    }

    .home-discover-head strong {
        font-size: 11.5px;
        font-weight: 800;
        letter-spacing: 0.02em;
        text-transform: uppercase;
    }

    .home-discover-head .fa {
        position: absolute;
        top: var(--padding-xxsmall);
        right: var(--padding-small);
        font-size: 14px;
        color: var(--dark-dark-color);
    }

    .home-discover-tabs {
        display: grid;
        grid-template-columns: 1fr 1fr;
        border-bottom: 1px solid var(--hairline-color);
        background: #fff;
    }

    .home-discover-tabs span {
        padding: var(--padding-xsmall) 0 6px;
        border-bottom: 2px solid transparent;
        text-align: center;
        font-size: 9.5px;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        color: var(--dark-light-color);
    }

    .home-discover-tabs .is-active {
        border-bottom-color: var(--primary-color);
    }

    .home-discover-body {
        flex: 1 1 auto;
        min-height: 0;
        overflow: hidden;
        padding: 12px 0 0 var(--padding-small);
    }

    .home-discover-carousel {
        display: flex;
        gap: var(--gap-xsmall);
    }

    .home-discover-card {
        flex: 0 0 calc(100% - 28px);
        overflow: hidden;
        border-radius: var(--radius);
        background: #fff;
        box-shadow: 0 10px 24px -18px rgba(0, 13, 35, 0.2);
    }

    .home-discover-card img {
        display: block;
        width: 100%;
        height: auto;
        object-fit: cover;
    }

    .home-discover-peek {
        flex: 0 0 40px;
        border-radius: var(--radius);
        background: var(--dark-color);
    }

    .home-discover-copy {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
        min-width: 0;
        font-size: 10.5px;
        line-height: 1.45;
        color: var(--dark-light-color);
    }

    .home-discover-card .home-discover-copy {
        padding: 12px;
    }

    .home-discover-copy small {
        font-size: 8.5px;
        letter-spacing: 0.16em;
        text-transform: uppercase;
    }

    .home-discover-copy strong {
        font-size: 14px;
        font-weight: 800;
        line-height: 1.2;
        letter-spacing: -0.01em;
    }

    .home-discover-button {
        padding: 2px 10px;
        border-radius: 999px;
        background: var(--primary-color);
        font-size: 9.5px;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        color: #fff;
    }

    .home-discover-card .home-discover-button {
        margin-top: var(--margin-xsmall);
    }

    .home-discover-section {
        display: block;
        margin: var(--margin-small) 0 var(--margin-xsmall);
        font-size: 14px;
        font-weight: 800;
    }

    .home-discover-item {
        display: grid;
        grid-template-columns: 52px 1fr auto;
        align-items: center;
        gap: 10px;
        padding-right: var(--padding-small);
    }

    .home-discover-item img {
        display: block;
        width: 52px;
        height: 52px;
        object-fit: cover;
        border-radius: var(--radius);
    }

    .home-discover-item strong {
        font-size: 12px;
        font-weight: 700;
    }

    .home-discover-nav {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        padding: 6px var(--padding-xxsmall) var(--padding-xxsmall);
        background: #fff;
    }

    .home-discover-nav span {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 3px;
        font-size: 7.5px;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        color: var(--ink-soft-color);
    }

    .home-discover-nav .fa {
        height: 18px;
        font-size: 15px;
        line-height: 18px;
    }

    .home-discover-nav img {
        display: block;
        width: 18px;
        height: 18px;
        border-radius: 50%;
    }

    .home-discover-nav .is-active {
        color: var(--primary-color);
    }


    /*=== Document Reader ===*/

    .home-reader {
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
        background: var(--surface-color);
    }

    .home-reader-head {
        display: grid;
        grid-template-columns: 14px 1fr 16px;
        align-items: center;
        gap: var(--gap-xsmall);
        padding: var(--padding-xxsmall) var(--padding-small) 12px;
        background: #fff;
        color: var(--dark-light-color);
    }

    .home-reader-head .fa {
        font-size: 13px;
    }

    .home-reader-title {
        display: flex;
        flex-direction: column;
        align-items: center;
        line-height: 1.35;
    }

    .home-reader-title strong {
        font-size: 12.5px;
    }

    .home-reader-page {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
        gap: 14px;
        margin: var(--margin-small);
        padding: var(--padding-small);
        border-radius: var(--radius);
        border: 1px solid var(--hairline-color);
        background: #fff;
    }

    .home-reader-page strong {
        font-size: 14px;
        letter-spacing: -0.01em;
    }

    .home-reader-lines {
        display: flex;
        flex-direction: column;
        gap: 7px;
    }

    .home-reader-lines i {
        height: 6px;
        border-radius: var(--radius-small);
        background: #e9edf2;
    }

    .home-reader-lines i:last-child {
        width: 60%;
    }

    .home-reader-figure {
        height: 96px;
        display: grid;
        place-items: center;
        border-radius: var(--radius);
        background: var(--primary-color-8);
        font-size: 30px;
        color: var(--primary-color);
    }

    .home-reader-foot {
        display: grid;
        grid-template-columns: 1fr auto;
        align-items: center;
        gap: 12px;
        padding: 12px var(--padding-small) var(--padding-small);
        background: #fff;
        font-size: 9.5px;
        font-weight: 600;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: var(--ink-soft-color);
    }


    /*=== AI Tutor ===*/

    /* Same chat layout as the AI training hero: plain tutor text, blue learner bubble */
    .home-tutor-ring {
        width: 26px;
        height: 26px;
        justify-self: end;
        transform: rotate(-90deg);
    }

    .home-tutor-ring-track,
    .home-tutor-ring-value {
        fill: none;
        stroke-width: 4;
    }

    .home-tutor-ring-track {
        stroke: #e9edf2;
    }

    .home-tutor-ring-value {
        stroke: var(--primary-color);
        stroke-linecap: round;
        stroke-dasharray: 100;
        stroke-dashoffset: var(--offset);
    }

    .home-tutor-chat {
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        gap: var(--gap-xsmall);
        overflow: hidden;
        padding: var(--padding-small);
        -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 64px);
        mask-image: linear-gradient(180deg, transparent 0, #000 64px);
    }

    .home-tutor-tutor {
        margin: var(--margin-xsmall) 0;
        padding: 0 var(--padding-xsmall) 0 0;
        font-size: 13px;
        line-height: 1.5;
        letter-spacing: -0.005em;
        color: var(--ink-color);
    }

    .home-tutor-learner {
        align-self: flex-end;
        max-width: 84%;
        margin: var(--margin-small) 0;
        padding: var(--padding-xsmall) var(--padding-small);
        border-radius: var(--radius-large) var(--radius-large) 0 var(--radius-large);
        background: var(--primary-color);
        font-size: 12.5px;
        line-height: 1.45;
        color: #fff;
    }

    .home-tutor-visual {
        padding: var(--padding-small);
        border-radius: var(--radius-medium);
        border: 1px solid var(--hairline-color);
        background: #fff;
        box-shadow: 0 10px 24px -16px rgba(0, 13, 35, 0.12);
    }

    .home-tutor-visual-title {
        display: block;
        margin-bottom: var(--margin-xsmall);
        text-align: center;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: -0.01em;
        color: var(--dark-dark-color);
    }

    .home-tutor-visual-flow {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: var(--gap-xsmall);
    }

    .home-tutor-visual-flow span {
        position: relative;
        min-height: 48px;
        display: grid;
        place-items: center;
        padding: var(--padding-xxsmall);
        border-radius: var(--radius);
        border: 1.5px solid var(--primary-color);
        background: rgba(27, 156, 252, 0.06);
        text-align: center;
        font-size: 10.5px;
        font-weight: 600;
        line-height: 1.25;
        color: var(--dark-dark-color);
    }

    .home-tutor-visual-flow span:nth-child(2) {
        border-color: var(--secondary-color);
        background: rgba(37, 204, 247, 0.08);
    }

    .home-tutor-visual-flow span:nth-child(3) {
        border-color: var(--primary-dark-color);
        background: rgba(0, 126, 222, 0.06);
    }

    .home-tutor-visual-flow span + span::before {
        content: '';
        position: absolute;
        top: 50%;
        right: calc(100% + 1.5px);
        width: var(--gap-xsmall);
        height: 1.5px;
        background: var(--dark-light-color);
        opacity: 0.45;
    }

    .home-tutor-input {
        flex: 0 0 auto;
        display: flex;
        align-items: flex-end;
        gap: var(--gap-xsmall);
        padding: var(--padding-xsmall) var(--padding-small);
        background: #fff;
    }

    .home-tutor-field {
        flex: 1 1 auto;
        min-height: 34px;
        padding: var(--padding-xsmall) var(--padding-small);
        border-radius: var(--radius);
        background: #f1f3f6;
        font-size: 12.5px;
        line-height: 18px;
        color: #9aa3b1;
    }

    .home-tutor-send {
        flex: 0 0 32px;
        height: 32px;
        margin-bottom: 1px;
        display: grid;
        place-items: center;
        border-radius: 50%;
        background: #d6dbe2;
        font-size: 13px;
        color: #fff;
    }


    /*=== Lock Screen ===*/

    .home-lock {
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
        padding: 0 12px;
        background: var(--surface-color) url(../images/wave.png) no-repeat bottom center;
        background-size: 260%;
    }

    .home-lock-clock {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: var(--padding-medium) 0;
    }

    .home-lock-clock small {
        font-size: 12px;
        font-weight: 600;
        color: var(--dark-light-color);
    }

    .home-lock-clock strong {
        font-size: 60px;
        font-weight: 300;
        line-height: 1;
        letter-spacing: -0.04em;
    }

    .home-lock-notifications {
        display: flex;
        flex-direction: column;
        gap: var(--gap-xsmall);
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .home-lock-notifications li {
        display: grid;
        grid-template-columns: 28px 1fr;
        gap: 10px;
        padding: 10px 12px;
        border-radius: var(--radius-large);
        background: rgba(255, 255, 255, 0.9);
        box-shadow: 0 8px 20px -14px rgba(0, 13, 35, 0.2);
    }

    .home-lock-copy {
        display: flex;
        flex-direction: column;
        font-size: 11px;
        line-height: 1.4;
        color: var(--dark-light-color);
    }

    .home-lock-copy strong {
        font-size: 12px;
    }

    .home-lock-meta {
        display: flex;
        justify-content: space-between;
        font-size: 9.5px;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: var(--ink-soft-color);
    }


    /*=== Web Activity ===*/

    .home-web {
        position: relative;
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
        padding: 0 var(--padding-small) var(--padding-small);
    }

    .home-web-head {
        display: grid;
        grid-template-columns: 14px 1fr 14px;
        align-items: center;
        padding: var(--padding-xxsmall) 0 10px;
        color: var(--dark-light-color);
    }

    .home-web-head .fa {
        font-size: 13px;
    }

    .home-web-head strong {
        text-align: center;
        font-size: 10.5px;
        letter-spacing: 0.16em;
        text-transform: uppercase;
    }

    .home-web-url {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        padding: 6px 10px;
        border-radius: 999px;
        background: var(--surface-color);
        font-size: 10.5px;
        color: var(--ink-muted-color);
    }

    .home-web-url .fa {
        font-size: 9px;
    }

    .home-web-course {
        display: flex;
        flex-direction: column;
        gap: var(--gap-xxsmall);
        margin-top: 14px;
        padding: 12px;
        border-radius: var(--radius);
        border: 1px solid var(--hairline-color);
    }

    .home-web-cover {
        height: 120px;
        display: grid;
        place-items: center;
        margin-bottom: var(--margin-xsmall);
        border-radius: var(--radius);
        background: var(--accent-color-15);
        font-size: 34px;
        color: var(--accent-color);
    }

    .home-web-course strong {
        font-size: 14px;
        font-weight: 800;
    }

    .home-web-course .home-bar {
        margin: var(--margin-xsmall) 0;
    }

    .home-web-button {
        padding: var(--padding-xsmall);
        border-radius: var(--radius);
        background: var(--dark-color);
        text-align: center;
        font-size: 12px;
        font-weight: 700;
        color: #fff;
    }

    .home-web-toast {
        position: absolute;
        left: var(--padding-small);
        right: var(--padding-small);
        bottom: var(--padding-small);
        display: grid;
        grid-template-columns: 20px 1fr;
        align-items: center;
        gap: 10px;
        padding: 10px 12px;
        border-radius: var(--radius);
        border: 1px solid var(--hairline-color);
        background: #fff;
        box-shadow: 0 16px 32px -20px rgba(0, 13, 35, 0.2);
    }

    .home-web-toast .fa {
        font-size: 18px;
        color: var(--primary-color);
    }

    .home-web-toast span {
        display: flex;
        flex-direction: column;
        line-height: 1.35;
    }

    .home-web-toast strong {
        font-size: 12px;
    }


    /*===================================================
    // CUSTOMERS
    /==================================================*/

    .home-customers {
        padding: var(--padding-large) 0;
    }

    .home-customers .home-head {
        margin-bottom: var(--margin-medium);
    }

    .home-marquee {
        overflow: hidden;
        -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
        mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
    }

    /* Padding equals the gap, so -50% lands exactly on the copy */
    .home-marquee-track {
        --card-h: 240px;
        --card-gap: 16px;

        width: max-content;
        display: flex;
        gap: var(--card-gap);
        padding-right: var(--card-gap);
        animation: homeMarquee 70s linear infinite;
    }

    .home-marquee-repeat {
        display: flex;
        gap: var(--card-gap);
    }

    .home-marquee:hover .home-marquee-track {
        animation-play-state: paused;
    }

    .home-marquee .customer-card {
        width: 300px;
    }

    @keyframes homeMarquee {
        from { transform: translateX(0); }
        to { transform: translateX(-50%); }
    }


    /*===================================================
    // UNTOLD AI
    /==================================================*/

    .home-ai {
        padding: var(--padding-large) 0;
    }

    .home-ai-grid {
        display: grid;
        grid-template-columns: 1.1fr 1fr;
        align-items: center;
        gap: var(--gap-large);
    }

    .home-ai .home-overline {
        color: var(--secondary-color);
    }

    .home-ai h2 {
        color: #fff;
    }

    .home-ai-copy p {
        max-width: 480px;
        margin-top: var(--margin-small);
        padding-bottom: 0;
        font-size: 18px;
        line-height: 1.6;
        color: rgba(255, 255, 255, 0.72);
    }

    .home-ai-cta {
        margin-top: var(--margin-medium);
        padding: var(--padding-xsmall) var(--padding-small);
        background: var(--primary-color);
    }

    .home-ai-cta:hover {
        background: var(--primary-light-color);
    }

    .home-ai-card {
        padding: var(--padding-medium);
        border-radius: var(--radius-large);
        background: #fff;
        font-size: 12.5px;
        color: var(--dark-light-color);
    }

    .home-ai-card-head {
        display: flex;
        align-items: center;
        gap: var(--gap-small);
        padding-bottom: var(--padding-small);
    }

    .home-ai-card-summary {
        display: flex;
        flex-direction: column;
        line-height: 1.2;
    }

    .home-ai-card-summary strong {
        font-size: 28px;
        font-weight: 800;
        letter-spacing: -0.03em;
        color: var(--dark-dark-color);
    }

    .home-ai-card-summary small,
    .home-ai-card-title {
        font-size: 9.5px;
        font-weight: 600;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        color: var(--ink-soft-color);
    }

    .home-ai-ring {
        position: relative;
        width: 56px;
        height: 56px;
        display: grid;
        place-items: center;
        font-size: 16px;
        color: var(--dark-light-color);
    }

    .home-ai-ring svg {
        position: absolute;
        inset: 0;
        transform: rotate(-90deg);
    }

    .home-ai-ring-track,
    .home-ai-ring-fill {
        fill: none;
        stroke-width: 4;
    }

    .home-ai-ring-track {
        stroke: #e9edf2;
    }

    .home-ai-ring-fill {
        stroke: var(--primary-color);
        stroke-linecap: round;
        stroke-dasharray: 100;
        stroke-dashoffset: var(--offset);
    }

    .home-ai-card-title {
        display: block;
        padding: var(--padding-small) 0 var(--padding-xsmall);
        border-top: 1px solid var(--hairline-color);
    }

    .home-ai-card ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .home-ai-card li {
        display: grid;
        grid-template-columns: 1fr 96px 36px;
        align-items: center;
        gap: 12px;
        padding: 10px 0;
        border-top: 1px solid var(--hairline-color);
    }

    .home-ai-card li:first-child {
        border-top: 0;
    }

    .home-ai-card li strong {
        text-align: right;
        color: var(--dark-dark-color);
    }


    /*===================================================
    // CALL TO ACTION
    /==================================================*/

    .home-cta {
        padding: var(--padding-large) 0 calc(var(--padding-large) * 1.5);
        text-align: center;
    }

    .home-cta-icon {
        display: block;
        width: 72px;
        height: 72px;
        margin: 0 auto var(--margin-medium);
        border-radius: var(--radius-large);
    }

    .home-cta h2 {
        font-size: clamp(40px, 5.6vw, 64px);
        line-height: 1;
        letter-spacing: -0.045em;
    }

    .home-cta p {
        max-width: 520px;
        margin: var(--margin-small) auto 0;
        padding-bottom: 0;
        font-size: 18px;
        line-height: 1.6;
    }

    .home-cta-actions {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: var(--gap-medium);
        margin-top: var(--margin-medium);
    }

    .home-cta-button {
        padding: var(--padding-xsmall) var(--padding-small);
        background: var(--primary-color);
    }

    .home-cta-button:hover {
        background: var(--primary-light-color);
    }


    /*===================================================
    // RESPONSIVE
    /==================================================*/

    @media screen and (max-height: 820px) {

        .home-story-stage {
            --phone-scale: 0.85;
        }

    }

    @media screen and (max-height: 700px) {

        .home-story-stage {
            --phone-scale: 0.74;
        }

    }

    /* Small screens drop the pinned stage; chapters read top to bottom */
    @media screen and (max-width: 960px) {

        .home-story-grid,
        .home-ai-grid {
            grid-template-columns: 1fr;
        }

        .home-story-stage {
            display: none;
        }

        .home-chapter {
            min-height: 0;
            padding: var(--padding-medium) 0;
            opacity: 1;
        }

        .home-head-split {
            flex-direction: column;
            align-items: flex-start;
        }

        .home-ai-grid {
            padding: var(--padding-medium);
        }

    }

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

        .home-marquee-track {
            animation: none;
        }

        .home-chapter,
        .home-screen {
            transition: none;
        }

    }