/* Compact mobile homepage introduction and primary navigation. */
:is(#home-hero, #entry) .home-mobile-copy {
    display: none;
}

@media (max-width: 767px) {
    :is(#home-hero, #entry) .home-desktop-copy {
        display: none;
    }

    :is(#home-hero, #entry) .home-mobile-copy {
        display: inline;
    }

    #home-hero {
        padding-block: 1.75rem 1.25rem;
    }

    #home-hero h1 {
        margin-bottom: .875rem;
        font-size: clamp(2rem, 8.4vw, 2.5rem);
        line-height: 1.2;
        letter-spacing: -.045em;
    }

    #home-hero h1 :is(.home-hero-topic, .home-hero-ai) {
        display: inline;
        margin: 0;
    }

    #home-hero h1 > span:last-child {
        margin-top: .25rem;
    }

    #home-hero p {
        font-size: 1rem;
        line-height: 1.6;
    }

    #home-hero .home-hero-scroll-cue {
        display: none;
    }

    #entry {
        padding-block: .5rem 2rem;
    }

    #entry > div > div:first-child {
        margin-bottom: .875rem;
    }

    #entry > div > div:first-child > :is(span, p) {
        display: none;
    }

    #entry > div > div:first-child > h2 {
        margin: 0;
        font-size: 1.0625rem;
        line-height: 1.5;
        letter-spacing: -.02em;
    }

    #entry .home-entry-grid {
        gap: .75rem;
    }

    #entry .home-entry-grid > a {
        padding: .875rem;
        border-radius: 1.125rem;
        transition-property: background-color, border-color, box-shadow;
    }

    #entry .home-entry-grid > a > div {
        display: grid;
        grid-template-columns: 2.75rem minmax(0, 1fr) 1rem;
        grid-template-areas: "icon title arrow" "icon copy arrow";
        align-content: center;
        column-gap: .75rem;
        row-gap: .25rem;
        min-height: 3rem;
    }

    #entry .home-entry-grid > a > div > div:first-child {
        grid-area: icon;
        align-self: center;
        width: 2.75rem;
        height: 2.75rem;
        margin: 0;
        border-radius: .875rem;
    }

    #entry .home-entry-grid > a > div > span {
        display: none;
    }

    #entry .home-entry-grid h3 {
        grid-area: title;
        min-width: 0;
        margin: 0;
        font-size: 1.125rem;
        line-height: 1.4;
    }

    #entry .home-entry-grid p {
        grid-area: copy;
        min-width: 0;
        margin: 0;
        font-size: .875rem;
        line-height: 1.5;
        overflow-wrap: anywhere;
    }

    #entry .home-entry-grid > a > div > div:last-child {
        grid-area: arrow;
        align-self: center;
    }

    #entry .home-entry-grid > a > div > div:last-child > span {
        display: none;
    }

    #entry .home-entry-grid > a:hover,
    #entry .home-entry-grid > a[data-preview-active="true"] {
        transform: none;
    }

    #knowledge-map {
        padding-block: 2rem;
    }
}
