.page-public .hero-carousel {
    display: block;
    position: relative;
}

.page-public .hero {
    padding: 52px 0 34px;
}

.page-public .hero-slide {
    display: grid;
    grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
    gap: 72px;
    align-items: center;
}

.page-public .hero-slide[hidden] {
    display: none !important;
}

.page-public .hero-slide .hero-copy {
    max-width: 430px;
    align-self: center;
}

.page-public .hero-slide .hero-copy h1 {
    font-size: 2.65rem;
    line-height: 1.08;
    margin-bottom: 16px;
}

.page-public .hero-slide .hero-copy .eyebrow {
    margin-bottom: 20px;
}

.page-public .hero-slide .hero-copy .artwork-year {
    margin-bottom: 20px;
}

.page-public .hero-slide .hero-copy > p:not(.eyebrow):not(.artwork-year) {
    max-width: 34ch;
    margin-bottom: 24px;
}

.page-public .hero .wrap::after {
    content: none !important;
    display: none !important;
}

.page-public .hero-slide .frame.frame-has-image {
    width: 100%;
    aspect-ratio: 25 / 12;
    overflow: hidden;
    align-self: center;
}

.page-public .hero-slide .frame.frame-has-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
}

.page-public .hero-carousel-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    width: 61%;
    margin: 12px 0 0 auto;
}

.page-public .hero-carousel-dots button,
.page-public .hero-carousel-dots button:hover,
.page-public .hero-carousel-dots button:focus {
    appearance: none;
    width: 9px !important;
    min-width: 9px !important;
    height: 9px !important;
    min-height: 9px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    outline-offset: 3px;
    border-radius: 50% !important;
    background: var(--text-muted) !important;
    opacity: .72;
    box-shadow: none !important;
    cursor: pointer;
}

.page-public .hero-carousel-dots button.is-active,
.page-public .hero-carousel-dots button.is-active:hover,
.page-public .hero-carousel-dots button.is-active:focus {
    background: var(--accent-bright) !important;
    opacity: 1;
}

.page-public .hero + .wrap > .section-rule:first-child {
    margin: 18px 0 22px;
}

/* Homepage Recent Work follows the smaller, quieter proportions of the approved mockup. */
.page-public .work-grid {
    grid-template-columns: repeat(3, minmax(0, 285px));
    justify-content: center;
    gap: 26px;
}

.page-public .work-grid:has(> .work-card:only-child) {
    grid-template-columns: minmax(0, 285px);
}

.page-public .work-grid:has(> .work-card:nth-child(2):last-child) {
    grid-template-columns: repeat(2, minmax(0, 285px));
}

.page-public .work-card .meta {
    padding-top: 10px;
}

.page-public .work-card .meta .name {
    font-size: .98rem;
}

/* Homepage journal is intentionally restrained so the artwork remains the focus. */
.page-public .journal-archive {
    max-width: 820px;
}

.page-public .journal-archive .journal-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 34px;
    padding: 22px 0 24px;
}

.page-public .journal-archive .journal-row .date {
    margin-bottom: 7px;
    font-size: .66rem;
}

.page-public .journal-archive .journal-row h3 {
    margin-bottom: 6px;
    font-size: 1.16rem;
    line-height: 1.24;
}

.page-public .journal-archive .journal-row p {
    max-width: 54ch;
    font-size: .86rem;
    line-height: 1.58;
}

.page-public .journal-archive .journal-row > .view-all {
    margin-top: 24px;
    font-size: .69rem;
}

@media (max-width: 900px) {
    .page-public .hero {
        padding: 46px 0 34px;
    }

    .page-public .hero-slide {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .page-public .hero-slide .hero-copy {
        max-width: 620px;
    }

    .page-public .hero-slide .frame.frame-has-image {
        aspect-ratio: 16 / 9;
    }

    .page-public .hero-carousel-dots {
        width: 100%;
        margin-left: 0;
    }

    .page-public .work-grid,
    .page-public .work-grid:has(> .work-card:nth-child(2):last-child) {
        grid-template-columns: repeat(2, minmax(0, 285px));
    }
}

@media (max-width: 640px) {
    .page-public .work-grid,
    .page-public .work-grid:has(> .work-card:nth-child(2):last-child),
    .page-public .work-grid:has(> .work-card:only-child) {
        grid-template-columns: minmax(0, 1fr);
    }

    .page-public .journal-archive .journal-row {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .page-public .journal-archive .journal-row > .view-all {
        margin-top: 0;
    }
}