*{
  box-sizing:border-box;
}

html,body{
  margin:0;
  padding:0;
  background:#fff;
  color:#17100d;
}

body{
  min-width:320px;
}

.espacos-page{
  width:100%;
  max-width:1912px;
  margin:0 auto;
  padding-top:calc(7.2vw - 2cm);
}


/* CABEÇALHO */

.site-header{
  width:100%;
  max-width:820px;
  margin:0 auto;
}

.title-wrap,
.menu-wrap{
  display:block;
  width:100%;
}

.title-wrap img,
.menu-wrap>img{
  display:block;
  width:100%;
  height:auto;
}

.menu-wrap{
  position:relative;
  margin-top:3.1%;
}

.menu{
  position:absolute;
  inset:0;
}

.m{
  position:absolute;
  top:0;
  height:100%;
  display:block;
}

.desenhos{
  left:0;
  width:12.4499%;
}

.objetos{
  left:16.4561%;
  width:9.3374%;
}

.espacos{
  left:29.7689%;
  width:10.7858%;
}

.posteres{
  left:44.5609%;
  width:11.0324%;
}

.publicacoes{
  left:59.5686%;
  width:15.2234%;
}

.pinturas{
  left:78.7673%;
  width:10.0154%;
}

.sobre{
  left:92.7889%;
  width:7.2111%;
}


/* GRADE */

.espacos-grid{
  width:950px;
  margin:128px auto 0;
  display:grid;
  grid-template-columns:repeat(3,281px);
  column-gap:53px;
  row-gap:22px;
  align-items:start;
}

.espaco-card{
  display:block;
  width:281px;
  text-align:center;
  text-decoration:none;
  color:inherit;
  overflow:visible;
}

.cover{
  display:block;
  width:281px;
  height:351px;
  object-fit:cover;
  transition:transform .2s ease;
  transform-origin:center bottom;
}

.espaco-card:hover .cover{
  transform:scale(1.03);
}


/* LETTERINGS
   Língua Afiada é a referência aprovada.
   Todos os demais usam exatamente a mesma escala proporcional.
*/

.lettering{
  height:31px;
  margin-top:14px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  overflow:visible;
}

.lettering img{
  display:block;
  width:auto;
  max-width:none;
}

/* arquivos originais:
   língua = 78px de altura → 14px na página
*/

.lettering img[alt="resgate"]{
  height:12.92px;
}

.lettering img[alt="língua afiada"]{
  height:14px;
}

.lettering img[alt="Parque da Água Branca"]{
  height:16.15px;
}

.lettering img[alt="Labof"]{
  height:11.85px;
}

.lettering img[alt="Parque do Povo (Projeto Vivara)"]{
  height:14px;
}

.lettering img[alt="Glória Pizzaria"]{
  height:11.85px;
}


/* MOBILE */

@media (max-width:700px){

  .espacos-page{
    padding:0 5vw 12vw;
  }

  .site-header{
    width:90%;
    padding-top:12vw;
  }

  .espacos-grid{
    width:90%;
    margin:14vw auto 0;
    grid-template-columns:1fr;
    column-gap:0;
    row-gap:8vw;
  }

  .espaco-card{
    width:100%;
  }

  .cover{
    width:100%;
    height:auto;
  }

  .lettering{
    margin-top:14px;
    height:auto;
  }
}
