html {
    scroll-padding-top: 6rem; /* Adjust to your header height */
}


body {
  margin: 0;  
}


h1 {
     font: 3rem/1 serif;
     margin: 0;
}


h2 {
    font: 2rem/1.3  serif;   
    margin: 0.9rem 0 0.5rem 0;;  
}


h3 {
    font: 1.3rem/1.2 serif;
    margin: 0;
    font-style:italic;
}

p {
    font: 1.2rem/1.2 serif;
    margin: 0.5rem 0 0.5rem 0;;
}

a  {
    display: inline-block;
    background-color: #242424;
    color:#ff6ac1; 
    font-size: 1.2rem; 
    border:2px solid #ff6ac1;
    border-radius: 30px;
    text-decoration: none;
    padding: 0.7rem;
}


nav ul {
    list-style-type: none;
    margin: 0;   
}

 /* Inline-block serve per mettere in linea la lista dei contenuti */

nav ul li {
    display: inline-block;     
}


nav li a {
    font: 1rem/1 serif;
}
nav li a:hover {
    font: 1rem/1 Impact, sans-serif;
}


.--background-light {
    background-color: #f6ebed;
    color:black; 
    padding: 5rem 5rem; 
    min-height: 50vh; 
}


.--background-dark {
    background-color: #242424;
    color:rgb(236, 236, 236);   
    padding: 5rem 5rem; 
    min-height: 50vh; 
}

.--twocol {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem; /* spazio tra le colonne */
  align-items: center;
  justify-content: space-between;
  padding: 2rem 0rem 2rem 5rem;
}

.text-col {
  flex: 1 1 50%;
  min-width: 300px;
}

.img-col {
  flex: 1 1 40%;
  min-width: 250px;
}

header {
    background-color: #242424;
    color:rgb(236, 236, 236);   
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content:space-between;
    padding: 1rem 5rem;
    position: sticky;
    top: 0;
    z-index: 1000;   
}

img {
    height: 600px;
}

form {
    display:flex;
    justify-content: center;
    align-items: end;
    gap: 1rem;
    
}

.b-tok {
    display:flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    overflow: hidden;
    max-height: 2rem;
    background-color: #242424;
    color:#ff6ac1; 
    border:2px solid #ff6ac1;
    border-radius: 30px;
    text-decoration: none;
    padding: 1rem 2rem;  
}


input[id="name"],
input[type="email"],
input[id="surname"],
textarea {
    display: inline-block;
    background-color: #242424;
    color: #ff6ac1;
    font-size: 0.8rem;
    border: 2px solid #ff6ac1;
    border-radius: 30px;
    padding: 0.7rem;
    width: 100%; /* o un valore specifico */
    box-sizing: border-box; /* per includere padding nel width */
    outline: none;
}

input::placeholder,
textarea::placeholder {
    color: #ff6a7e;
    opacity: 0.7;
}


footer {
    min-height: 30vh;
    padding: 2rem 5rem;
    background-color: #242424;
    color:#ff6a7e;
}


.hidden {
  display: none;
}

#alessia {
    display:flex;
    justify-content: start;
}
#alessia a {
    font-size:80%;
    margin:1rem 0rem;
}

.--title-mgr {
    margin: 2rem;

}

@media (max-width: 768px) {

}
