    /* Reset base */
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }
    body {
      background-color: #ffffff;
      color: #1a4075; /* blu scuro */
      line-height: 1.6;
	  font-family: 'Lora', serif; /* font principale per il testo */
    }
    .container {
      max-width: 1000px;
      margin: 0 auto;
      padding: 20px;
    }
    header {
      text-align: center;
      padding-bottom: 20px;
    }
    header img {
      max-width: 400px;
      height: auto;
    }
    header h1 {
      margin-top: 5px;
      font-size: 2.5rem;
	  margin-bottom:0px;
    }
 h1, .book-title {
      font-family: 'Playfair Display', serif; /* font elegante per titoli */
      font-weight: 700;
      font-size: 2.5rem;
      margin: 20px 0;
    }	
    .synopsis {
      margin-bottom: 30px;
	  margin-top:0px;
    }
    .synopsis p {
      font-size: 1.1rem;
      color: #003366;
	  text-align:justify;
		/*	  text-indent: 30px; */
    }
    .preorder {
      text-align: center;
    }
    .preorder button {
      background-color: #FA8072; /* salmone */
      color: #ffffff;
      border: none;
      padding: 15px 30px;
      font-size: 1.2rem;
      border-radius: 4px;
      cursor: pointer;
      transition: background-color 0.3s ease;
    }
    .preorder button:hover {
      background-color: #e67368;
    }
    footer {
      text-align: center;
      font-size: 0.9rem;
      color: #666666;
      padding-top: 20px;
      border-top: 1px solid #eeeeee;
    }
    /* Responsive */
    @media (max-width: 600px) {
      header h1 {
        font-size: 2rem;
      }
      .synopsis p {
        font-size: 1rem;
      }
      .preorder button {
        width: 100%;
        padding: 15px 0;
      }
    }


.evidenza
{
	color:black;
	background-color:#7ccbd7;
	padding:10px;
	margin-top:10px;
	margin-bottom:10px;
}

.copertina{
    max-width:400px; 
    width:100%;
    border:1px solid #675537;
}

@media screen and (max-width: 999px){
    .logo{
        width: 300px;
        max-width: 100%;
    }
    .grid_1{
        display: grid; 
        grid-template-columns: 1fr; 
        margin: 20px 0;
        gap: 20px;
    }
    .grid_1.reverse_mobile > div:first-of-type{
        grid-row: 2;
    }
    .copertina{
        max-width: 250px;
    }
}
@media screen and (min-width: 1000px){
    .logo{
        max-width: 500px;
    }
    .grid_1{
        display: grid; 
        grid-template-columns: 1fr 1fr; 
        gap: 100px; 
        margin: 50px 0;
    }
}
