#private-credit-hero-fg-grid svg {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}
#private-credit-hero-fg-grid {
	display: grid;
    width: auto;
    width: max-content;
    max-height: 700px;
    margin-inline: auto;
    justify-items: center;

	padding: 1rem;
	grid-template: 
        'title ' auto
        'graph' 1fr
        / auto;
    gap: 1.5rem;

    position: relative;
    left: 0;
    @media (1400px > width > 1200px) { left: -9rem; } 
    @media (width > 1400px) { left: -10rem; }

    :where(h1, h3) {
        font-family: 'Titillium Web', sans-serif;
        position: relative;
    }

    #private-credit-hero-fg-grid__title {
        grid-area: title;

        display: grid;
        grid: auto / auto;
        text-align: center;
        > * { 
            grid-area: 1 / 1 / -1 / -1;
            margin-bottom: 0;
        }
    }

    #private-credit-hero-fg-grid__graphic {
        grid-area: graph;

        display: grid;
        justify-content: center;
        aspect-ratio: 1 / 1;
        max-width: 100%;
        max-height: 100%;
        grid-template: 
            '. .' 0.9fr 
            'label-a label-b' auto 
            '. .' 1fr
            / 1fr 1fr;
        align-items: end;
    }
    
    [id*="__labels"] {
        grid-row: r-labels;
        color: white;
        text-align: center;
    }

    #private-credit-hero-fg-grid__labels-1 {
        grid-area: label-a;

        display: grid;
        grid: auto / auto;
        > * { 
            grid-row: 1;
            grid-column: 1;
        }
    }
    #private-credit-hero-fg-grid__labels-2 {
        grid-area: label-b;
    }

    #private-credit-hero-fg-grid__svg {
        grid-area: 1 / 1 / -1 / -1;
        width: 100%;
        @media (576px <= width <= 992px) { width: 390px; }
        @media (width >= 992px) { width: 500px; }
        max-width: 100%;
        max-height: 100%;
        :where(path) { 
            fill: transparent;
        }
    }
}