*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#fff;color:#17100d}
body{min-width:320px;font-family:Arial,Helvetica,sans-serif}

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

.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%}

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

.object-card{
  display:block;
  text-decoration:none;
  color:inherit;
  text-align:center
}

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

.object-lettering{
  display:flex;
  margin-top:13px;
  height:17px;
  align-items:flex-start;
  justify-content:center
}

/* aproxima somente as legendas da primeira linha */
.object-card:nth-child(1) .object-lettering,
.object-card:nth-child(2) .object-lettering,
.object-card:nth-child(3) .object-lettering{
  margin-top:9px
}

.object-lettering .letter-object{
  display:block;
  width:auto
}

/* ajuste visual para todos terem o mesmo tamanho aparente */
.object-card:nth-child(1) .letter-object{height:13px}
.object-card:nth-child(2) .letter-object{height:11px}
.object-card:nth-child(3) .letter-object{height:13px}
.object-card:nth-child(4) .letter-object{height:13px}
.object-card:nth-child(5) .letter-object{height:13px}
.object-card:nth-child(6) .letter-object{height:11px}

@media (hover:hover) and (pointer:fine){
  .object-card:hover .cover{
    transform:scale(1.03)
  }
}

@media(max-width:700px){

  .objects-page{
    padding:0 5vw 12vw;
    min-height:100svh
  }

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

  .menu-wrap{
    margin-top:3.1%
  }

  .object-grid{
    width:90%;
    margin:12vw auto 0;
    display:flex;
    flex-direction:column;
    gap:12vw
  }

  .object-card{
    width:100%
  }

  .cover{
    width:100%;
    height:auto;
    aspect-ratio:1/1;
    object-fit:cover
  }

  .object-lettering{
    margin-top:13px;
    height:17px
  }

  .object-card:nth-child(1) .object-lettering,
  .object-card:nth-child(2) .object-lettering,
  .object-card:nth-child(3) .object-lettering{
    margin-top:13px
  }

  .object-lettering .letter-object{
    width:auto
  }

  .object-card:nth-child(1) .letter-object{height:13px}
  .object-card:nth-child(2) .letter-object{height:11px}
  .object-card:nth-child(3) .letter-object{height:13px}
  .object-card:nth-child(4) .letter-object{height:13px}
  .object-card:nth-child(5) .letter-object{height:13px}
  .object-card:nth-child(6) .letter-object{height:11px}
}