Como incluir 2 CSS diferentes em 1 HTML

Aê galera, meu primeiro post. Já vou dizendo que sou bem iniciante (sou daqueles que modificam css e javascript, mas não criam kkk).

Pois bem, este é o desafio: tenho um html X, e tenho um html Y, cada qual independente, com seus próprios CSSs. O html Y é uma "galeria" de imagens extraída (plagiada) de um website builder. Fiz upload dos dois para o mesmo ftp com suas próprias CSSs.

Agora, quero utilizar o html X (que só possui cabeçalho e rodapé), mas no centro quero todo o conteúdo do html Y. Pensei em usar iframe, mas parece muita gambiarra (além de ser bem arriscado e complicado).

Seria possível colar o código fonte do Y no X, "desativando" o css do X antes, e reabilitar X depois para o rodapé (de modo simples)? Algo assim:



Explicar códigos é realmente complicado, mas sei que tem muitos experts por aqui que entenderão. Fato é que dois htmls diferentes com seus próprios estilos precisariam sem unidos sem dar a entender como iframe e sem dar nenhum tipo de enfrentamento/disputa de estilo (abre1, fecha1; abre2, fecha2; abre1, fecha1). Vlws.