main {
	display: grid;
	grid-template-areas: 
		"heading" 
		"sankey"
		"products";
	gap: 1rem;
	&>section {
		margin-bottom: 0;
	}
}

#company-header {
	grid-area: heading;
	img {
		float: inline-start;
		margin-inline-end: 1ch;
		height: 1lh;
	}
	img, country-flag {
		line-height: 1.125;
		font-size: 2rem;
	}
}
#company-sankey {
	grid-area: sankey;
	h2 {
		view-transition-name: company-sankey;
	}
}
#company-products {
	grid-area: products;
	h2 {
		view-transition-name: company-products;
	}
}

company-sankey-chart:not(:defined) {
	visibility: hidden;
}

@media (min-width: 800px) {
	main {
		grid-template: 
			"heading 	heading"	auto
			"sankey		products"	1fr
			/ 1fr			1fr;
	}
}