/* ===== BODY ===== */

body {

    margin: 0;

    font-family: Arial, Helvetica, sans-serif;

    background: radial-gradient(circle at top, #123d6b, #081f38);

    color: #e6d8a7;

}



/* ===== HEADER ===== */

header {

    text-align: center;

    padding: 20px 10px 10px;

}



/* STEMMA */

.stemma {

    width: 380px;

    display: block;

    margin: 0 auto;



    /* ombra più marcata */

    filter: drop-shadow(0 6px 12px rgba(0,0,0,0.8))

            drop-shadow(0 0 20px rgba(0,0,0,0.6));

}



/* TITOLO */

h1 {

    font-family: Georgia, "Times New Roman", serif;

    font-size: 48px;

    letter-spacing: 4px;

    color: #e6d8a7;



    margin: 0;

    margin-top: -40px;   /* 🔥 questo è il punto chiave */



    text-shadow:

        2px 2px 0 #000,

        0 0 12px rgba(0,0,0,0.8),

        0 0 25px rgba(0,0,0,0.6);

}







/* ===== MENU ===== */

.main-menu {

    background: #2a2a2a;

    border-top: 1px solid #555;

    border-bottom: 1px solid #555;

}



/* reset */

.main-menu ul {

    list-style: none;

    margin: 0;

    padding: 0;

}



/* primo livello */

.main-menu > ul {

    display: flex;

    justify-content: center;

}



/* LI */

.main-menu li {

    position: relative;

}



/* LINK */

.main-menu a {

    display: block;

    padding: 20px 30px;

    color: #f0e6c8;

    text-decoration: none;

    font-size: 15px;

    letter-spacing: 1.5px;

}



/* hover */

.main-menu a:hover {

    background: linear-gradient(to bottom, #aaa, #888);

    color: #2a2a2a;

}



/* ===== SUBMENU ===== */

.main-menu ul ul {

    display: none;

    position: absolute;

    top: 100%;

    left: 0;

    background: #3a3a3a;

    min-width: 240px;

    border: 1px solid #555;

    border-radius: 10px;

    box-shadow: 0 8px 20px rgba(0,0,0,0.6);

    z-index: 1000;

}



/* livello 3+ */

.main-menu ul ul ul {

    top: 0;

    left: 100%;

}



/* apertura */

.main-menu li:hover > ul {

    display: block;

}



/* link submenu */

.main-menu ul ul a {

    padding: 14px 20px;

    font-size: 14px;

    color: #f0f0f0;

    white-space: nowrap;

}



/* ===== CONTENUTO ===== */

main {

    text-align: center;

    padding: 50px 20px;

}



h2 {

    font-weight: normal;

    font-size: 26px;

}



p {

    color: #ccc;

}



/* ===== FOOTER ===== */

footer {

    text-align: center;

    padding: 20px;

    font-size: 12px;

    color: #aaa;

    border-top: 1px solid #333;

}



/* ===== MOBILE ===== */

@media (max-width: 768px) {

    .main-menu > ul {

        flex-direction: column;

    }



    .main-menu ul ul {

        position: static;

        box-shadow: none;

        border: none;

    }

}