.home-hero-grid {
        display: grid;
        gap: 2rem;
    }

    .home-banner-panel {
        background: #fff;
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .home-banner-frame {
        flex: 1 1 auto;
        min-height: 420px;
        position: relative;
        background: #e5e7eb;
    }

    .home-banner-toolbar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        padding: 1rem 1.25rem;
        border-top: 1px solid #e5e7eb;
        background: #fff;
    }

    .home-banner-actions {
        display: flex;
        align-items: center;
        gap: .5rem;
        flex-shrink: 0;
    }

    .home-banner-dot-indicator {
        display: block;
        width: .625rem;
        height: .625rem;
        border-radius: 9999px;
        background: #94a3b8;
        transition: all .2s ease;
    }

    .banner-dot[aria-current="true"] .home-banner-dot-indicator {
        width: 1.75rem;
        background: #1d4ed8;
    }

    @media (min-width: 1024px) {
        .home-hero-grid {
            grid-template-columns: minmax(0, 3fr) minmax(22rem, 2fr);
            align-items: stretch;
        }
    }

    @media (max-width: 640px) {
        .home-banner-frame {
            height: 300px;
        }

        .home-banner-toolbar {
            align-items: flex-start;
            flex-direction: column;
        }
    }