/* Reset di base */

@font-face {
    font-family: 'Mom';  /* Scegli un nome (tra apici singoli) */
    src: url('fonts/Mom.ttf') format('truetype'); /* Percorso e formato (usa il nome *rinominato*) */
    font-weight: normal; /* Probabilmente 'normal' */
    font-style: normal;  /* Probabilmente 'normal' */
}

@font-face {
    font-family: 'Korean_Calligraphy';  /* Scegli un nome (tra apici singoli) */
    src: url('fonts/Korean_Calligraphy.ttf') format('truetype'); /* Percorso e formato (usa il nome *rinominato*) */
    font-weight: normal; /* Probabilmente 'normal' */
    font-style: normal;  /* Probabilmente 'normal' */
}


body, h1, h2, p, ul, li {
    margin: 0;
    padding: 0;
}

body {
    font-family: sans-serif; /* Scegli un font */
    background-color: #fdfccb;
    color: #333; /* Colore del testo principale */
    text-align: center; /* Centra tutto di default */
}

/* Sezione Hero (GIF + Vignetta) */
.hero {
    position: relative;
    width: 100%;
    height: 100vh; /* 100% dell'altezza della finestra */
    overflow: hidden; /* Nasconde eventuali parti della GIF che escono */
}


#background-gif {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Assicura che la GIF copra l'intera area */
    object-position: center; /* Centra la GIF */
    display: block; /*Risolve problemi di spaziatura*/
}


.vignetta {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fdfccb; /* Colore di sfondo della vignetta */
    color: black; /* Colore del testo della vignetta */
    padding: 20px;
    z-index: 2;
    text-align: center;
}

.vignetta h1{
	font-family: 'Korean_Calligraphy', sans-serif;
    text-align: center; /* Centra il titolo */
/*    font-size: 2.5em; */
}

/* Sezione Introduttiva */
.intro {
	font-family: 'Mom', sans-serif;
    padding: 40px 20px; /* Mantieni la spaziatura interna */
}

.intro h2 {
	font-family: 'Mom', sans-serif;
    font-size: 2em;
    margin-bottom: 60px; /* Aumenta il margine inferiore del titolo */
}

.intro {
	font-family: 'Mom', sans-serif;
    padding: 40px 20px; /* Mantieni la spaziatura interna */
}

.benvenuto {
	font-family: 'Mom', sans-serif;
    font-size: 1.2em;
    line-height: 1.6;
    margin-bottom: 80px; /* Aumenta il margine inferiore del testo di benvenuto */
}
/*Sezione contatti*/

.contatti {
  position: relative;
  width:100%;
  overflow: hidden;
  margin-bottom: 100px;
}

.email-container{
    position: relative;
    max-width: 600px; /* Larghezza massima del contenitore */
    margin: 0 auto;    /* Centra il contenitore */
}

#contact-img{
   width: 100%; /* L'immagine occupa tutta la larghezza del contenitore */
   display: block;
   max-height: none;  /* Rimuovi il limite di altezza massima */
   height: auto;      /* L'altezza si adatta automaticamente */
   object-fit: contain;   /* IMPORTANTE: L'immagine viene mostrata interamente */
   object-position: center;
}

.email-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 1.5em;
    z-index: 2;
    background-color: rgba(0, 0, 0, 0.5);
    padding: 0.5em;
    white-space: nowrap; /* Impedisce all'email di andare a capo */
}

/*Sezione Regole*/
.regole{
	font-family: 'Mom', sans-serif;
    padding: 20px;
}

.regole-testo{
  font-family: 'Mom', sans-serif;
  text-align: left; /* Allinea a sinistra, come un elenco puntato */
  line-height: 1.6;
  font-size: 1.1em;
  max-width: 800px; /* Larghezza massima per la leggibilità */
  margin: 0 auto;  /* Centra il blocco di testo */
}

