Iza

But I added another pice of the code  with hover effect under, as I wanted the links to change colour form black to white when hover over. And it works 🙂 
 

ul.portfolio-hover-items-list li:nth-child(1) * {
    color: black;
}
ul.portfolio-hover-items-list li:nth-child(2) * {
    color: black;
}
ul.portfolio-hover-items-list li:nth-child(3) * {
    color: black;
} 

ul.portfolio-hover-items-list li:nth-child(1) :hover {
    color: white;
}
ul.portfolio-hover-items-list li:nth-child(2) :hover {
    color: white;
}
ul.portfolio-hover-items-list li:nth-child(3) :hover {
    color: white;
}
 

I found another code that I was able to adjust and get to work:
//Collage Blocks Mobile
@media (max-width:480px){
  .sqs-block-image .design-layout-collage.sqs-narrow-width .image-card-wrapper{
    width:90%;
    margin-top:calc(-10%)!important;
    position:relative}
  .sqs-block-image .design-layout-collage.sqs-narrow-width.image-position-right .intrinsic,.sqs-block-image .design-layout-collage.sqs-narrow-width.image-position-left .intrinsic{
    left:5%
  }
}

Hi,
Add to Design > Custom CSS
ul.portfolio-hover-items-list li:nth-child(1) * { color: red; } ul.portfolio-hover-items-list li:nth-child(2) * { color: green; } ul.portfolio-hover-items-list li:nth-child(3) * { color: blue; }  

Either one is fine. You just need to be a contributor on 3 sites. I'm not sure you'll need admin rights or lower. I have not tried this. You can contact SS Customer Care to ask.
Q1. Depend your client.
If they need your support in the future, they can downgrade your permission to the lowest level and upgrade it as needed.
Q2. No. You can extend it for free. I have several sites, extended it more than 4 times, completely free.

1. Is it possible to create a Squarespace template store and sell them to clients?
yes. Possible. Many designers do this.
2. How can the client see the template demo running for each template?
Create a trial site & setup template there. If you are a Circle Member, you have 6 month free trial
3. Does it mean I have to purchase a business account to get the templates live?
No need. But you should register Circle Problem, you will get 6 month free trial.
4. And how can I duplicate the templates and give the ownership to my clients?
Duplicate site: https://support.squarespace.com/hc/en-us/articles/360039396131-Duplicating-a-site
Then add your client as an admin
Then transfer ownership to your client 

No worries, I found your other post  on the forum. 
It is:
div.list-section-title p {
    font-family: 'BonVivant' !important;
}
 
Thank you!!

Use this
div.list-section-title p { font-family: 'BreweryProMedium' !important; } Reduce 3 boxes under discover more text?

Use this CSS
@font-face { font-family: 'BonVivant'; src: url('https://static1.squarespace.com/static/5f0da22686be2a6c0047f7a8/t/6099912f84f7763ccc204f42/1620676911823/Nicky-Laatz---Bon-Vivant-Serif-Bold.woff2') format('woff2'); } h1.ProductItem-details-title, .product-price { font-family: 'BonVivant' !important; }  

Your font code is invalid. Use this new code
@font-face { font-family: 'BonVivant'; src: url('https://static1.squarespace.com/static/5f0da22686be2a6c0047f7a8/t/6099912f84f7763ccc204f42/1620676911823/Nicky-Laatz---Bon-Vivant-Serif-Bold.woff2'); } h2.list-item-content__title { font-family: 'BonVivant' !important; }