.elementor-2671 .elementor-element.elementor-element-a588117{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-2671 .elementor-element.elementor-element-e744335 img{width:100%;border-radius:24px 24px 24px 24px;}.elementor-2671 .elementor-element.elementor-element-529c4fc img{width:100%;border-radius:24px 24px 24px 24px;}.elementor-2671 .elementor-element.elementor-element-094aa61{width:100%;max-width:100%;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-2671 .elementor-element.elementor-element-9306bb6{background-color:var( --e-global-color-f3b6760 );margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;text-align:center;}.elementor-2671 .elementor-element.elementor-element-9306bb6 .elementor-heading-title{font-family:"Amatic SC", Sans-serif;font-size:38px;color:var( --e-global-color-b85747d );}.elementor-2671 .elementor-element.elementor-element-c264876{padding:90px 90px 90px 90px;}.elementor-2671 .elementor-element.elementor-element-ae40f0a{text-align:left;}.elementor-2671 .elementor-element.elementor-element-ae40f0a .elementor-heading-title{font-family:"Raleway", Sans-serif;font-size:16px;font-weight:500;line-height:23px;color:var( --e-global-color-text );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-2671 .elementor-element.elementor-element-521c69d{text-align:left;}.elementor-2671 .elementor-element.elementor-element-521c69d .elementor-heading-title{font-family:"Raleway", Sans-serif;font-size:16px;font-weight:500;line-height:23px;color:var( --e-global-color-text );}@media(max-width:1024px){.elementor-2671 .elementor-element.elementor-element-a588117{--grid-auto-flow:row;}.elementor-2671 .elementor-element.elementor-element-529c4fc img{width:100%;}}@media(min-width:768px){.elementor-2671 .elementor-element.elementor-element-d7e22a8{width:100%;}}@media(max-width:767px){.elementor-2671 .elementor-element.elementor-element-a588117{--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-2671 .elementor-element.elementor-element-529c4fc img{width:100%;}.elementor-2671 .elementor-element.elementor-element-c264876{padding:30px 0px 30px 0px;}}/* Start custom CSS for html, class: .elementor-element-094aa61 *//* GRID – 6 fotos dos espetáculos da home */
#mini-grid-espetaculos {
  display: grid;
  width: 100%;
  grid-template-columns: repeat(3, 1fr); /* 3 colunas no desktop */
  gap: 16px; /* espaço entre as fotos */
  margin: 0 auto;
}

/* Imagens ocupando todo o espaço, com canto arredondado */
#mini-grid-espetaculos img {
  width: 100%;
  height: auto;      /* mantém proporção */
  object-fit: cover;
  border-radius: 18px;
}

/* Mobile: 2 colunas por linha */
@media (max-width: 768px) {
  #mini-grid-espetaculos {
    grid-template-columns: repeat(2, 1fr); /* 2 colunas no celular */
  }
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-ae40f0a */.cor,.cor1{
    color: green;
    font-weight: 700
}
.cor1{
    color: red
}/* End custom CSS */
/* Start custom CSS for column, class: .elementor-element-a274d0b */<style>
body {
background-color: #ffffff;
}

.secao-foto-individual {
display: flex;
justify-content: center;
align-items: center;
padding: 30px 20px;
max-width: 1200px;
margin: 20px auto;
}

.secao-foto-individual img {
width: 100%;
height: auto;
max-width: 800px; /* Ajuste conforme necessário */
border-radius: 12px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
transition: transform 0.3s ease-in-out;
}

.secao-foto-individual img:hover {
transform: scale(1.03);
}

.secao-varias-fotos {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); /* Ajuste minmax para controlar o tamanho mínimo */
gap: 20px;
padding: 20px;
max-width: 1200px;
margin: 20px auto;
}

.secao-varias-fotos a {
display: block;
text-decoration: none;
text-align: center;
}

.secao-varias-fotos img {
width: 100%;
height: auto;
border-radius: 12px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
transition: transform 0.3s ease-in-out;
max-height: 400px; /* Ajuste conforme necessário */
object-fit: cover;
}

.secao-varias-fotos img:hover {
transform: scale(1.03);
}

.secao-varias-fotos .etiqueta-peca {
display: inline-block;
margin-top: 5px;
padding: 5px 10px;
background-color: #ececec;
border-radius: 15px;
font-size: 12px;
color: #333;
font-weight: 500;
animation: pulse 2s infinite alternate;
text-decoration: none;
}

@keyframes pulse {
0% { transform: scale(1); }
100% { transform: scale(1.04); }
}

.titulo-secao {
font-family: Arial, sans-serif;
font-size: 20px;
color: #1a3c2f;
background-color: #c1eac5;
padding: 10px 20px;
margin: 20px auto 10px;
text-align: center;
font-weight: bold;
border-radius: 6px;
max-width: 300px;
}

@media (max-width: 768px) {
.secao-varias-fotos {
grid-template-columns: repeat(2, 1fr);
}

.titulo-secao {
font-size: 18px;
}
}
</style>

<!-- Sessão 1: Primeira foto individual -->

<div class="secao-foto-individual">
<a href="https://articularte.com.br/desfabulas-cantadas" target="_blank">
<img src="https://articularte.com.br/wp-content/uploads/2024/08/Rato-Cigarra-Panda_Grupo-Desfabulas_Credito_Articularte-1.png" alt="Desfábulas Cantadas" style="transform-origin: center center;">
</a>
</div>

<!-- Sessão 2: Segunda foto individual -->

<div class="secao-foto-individual">
<a href="https://articularte.com.br/menino-coragem" target="_blank">
<img src="https://articularte.com.br/wp-content/uploads/2024/01/WhatsApp-Image-2024-01-08-at-10.56.31-1-e1748235992294.jpeg" alt="Menino Coragem" style="transform-origin: center center;">
</a>
</div>

<!-- Sessão 3: Demais fotos (2 por linha no mobile) -->

<h2 class="titulo-secao">Todos os Temas e Tramas</h2>
<div class="secao-varias-fotos">
<a href="https://articularte.com.br/a-cuca-fofa-de-tarsila" target="_blank">
<img src="https://articularte.com.br/wp-content/uploads/2023/12/Cuca2-360x360-1.jpg" alt="Cuca Fofa">
<div class="etiqueta-peca">Saiba mais</div>
</a>
<a href="https://articularte.com.br/portinari-pe-de-moleque" target="_blank">
<img src="https://articularte.com.br/wp-content/uploads/2023/12/Portinari21-360x360-1.jpg" alt="Portinari Pé de Moleque">
<div class="etiqueta-peca">Saiba mais</div>
</a>
<a href="https://articularte.com.br/o-trenzinho-villa-lobos" target="_blank">
<img src="https://articularte.com.br/wp-content/uploads/2023/12/Tuhu2-360x360-1.jpg" alt="O Trenzinho Villa-Lobos">
<div class="etiqueta-peca">Saiba mais</div>
</a>
<a href="https://articularte.com.br/o-menino-que-abria-portas" target="_blank">
<img src="https://articularte.com.br/wp-content/uploads/2023/12/Eruma21-360x360-1.jpg" alt="O Menino que abria portas">
<div class="etiqueta-peca">Saiba mais</div>
</a>
<a href="https://articularte.com.br/o-valente" target="_blank">
<img src="https://articularte.com.br/wp-content/uploads/2023/12/Valente2b-1-1.jpg" alt="O Valente">
<div class="etiqueta-peca">Saiba mais</div>
</a>
<a href="https://articularte.com.br/chapeuzim-vermelho-e-o-lobo-marrom" target="_blank">
<img src="https://articularte.com.br/wp-content/uploads/2023/12/Chapeuzim21-360x360-1.jpg" alt="Chapeuzim Vermelho e o Lobo Marrom">
<div class="etiqueta-peca">Saiba mais</div>
</a>
</div>/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-521c69d */.cor,.cor1{
    color: green;
    font-weight: 700
}
.cor1{
    color: red
}/* End custom CSS */