/* Typography */
	.big-text {
	    font-size: 70px;
	    font-weight: 900;
	}

	.med-text {
	    font-size: 40px;
	    margin: auto;
	}

	.medium-text {
	    font-size: 30px;
	}

	.normal-text {
	    font-size: 20px;
	    margin: 30px;
	    color: #000
	}

	.small-text {
	    font-size: 14px;
	}

	.sotto-text {
	    font-size: 35px;
	}

	.intro-text {
	    text-transform: uppercase;
	    font-size: 20px;
	}

	@media (max-width:1250px) {
	    .big-text {
	        font-size: 55px;
	    }

	    .normal-text {
	        margin: 25px;
	    }

	    .sotto-text {
	        font-size: 25px;
	    }
	}

	@media (max-width:768px) {
	    .big-text {
	        font-size: 40px;
	    }

	    .normal-text {
	        margin: 15px;
	    }

	    .sotto-text {
	        font-size: 22px;
	    }
	}

	/* Hero Section */
	.hero-home {
	    height: 650px;
	    display: flex;
	    width: 100%;
	    align-items: center;
	    background: linear-gradient(0deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, 0.6)), url('magelys-express-sfondo.jpg') no-repeat center center;
	    background-size: cover;
	}

	.hero__content {
	    width: 100%;
	    max-width: 1350px;
	    margin: 0 auto;
	    padding: 30px;
	}

	.hero__content h1,
	.hero__content p {
	    color: #fff
	}

	/* Grid */
	.grid {
	    display: flex;
	    max-width: 1350px;
	    padding: 0 30px;
	    margin: 0 auto;
	}

	.grid2 {
	    display: flex;
	    max-width: 1250px;
	    padding: 0 30px;
	    margin: 0 auto;
	}

	.grid3 {
	    display: flex;
	    max-width: 1250px;
	    padding: 0 30px;
	    margin: 0 auto;
	    margin-top: -100px;
	}

	.grid .col {
	    width: 100%;
	}

	.grid2 .col {
	    width: 100%;
	}

	.grid3 .col {
	    width: 100%;
	}

	@media (max-width: 768px) {
	    .grid {
	        flex-wrap: wrap;
	    }

	    .grid2 {
	        flex-wrap: wrap;
	        padding: 0 5px;
	    }

	    .grid3 {
	        flex-wrap: wrap;
	        padding: 0 5px;
	        margin-top: 0;
	    }
	}

	/* Poster */
	.poster2 {
	    flex-wrap: wrap;
	    height: auto;
	    display: flex;
	    width: 100%;
	    max-width: 2500px;
	    align-items: center;
	}

	.poster__1 {
	    width: 25%;
	    padding: 15px;
	    display: flex;
	    flex-direction: column;
	    align-items: center;
	    text-align: center;
	}

	.poster__1 img {
	    object-fit: contain;
	    width: 70%;
	    height: auto;
	    display: block;
	    margin: 0 auto;
	}

	.poster__1 .bottone4 {
	    display: flex;
	    flex-direction: column;
	    align-items: center;
	    text-align: center;
	}

	@media (max-width: 1000px) {
	    .poster__1 {
	        width: 50%;
	    }
	}

	@media (max-width: 500px) {
	    .poster__1 {
	        width: 100%;
	        padding: 15px;
	    }

	    .poster__1 img {
	        object-fit: contain;
	        width: 50%;
	        height: auto;
	    }
	}

	/* Poster3 (Form Contatti) */
	.poster3__img {
	    width: 40%;
	    height: auto;
	    margin: auto;
	}

	.poster3__img img {
	    object-fit: contain;
	    width: 100%;
	    max-width: 600px;
	    height: auto;
	}

	.poster3__content {
	    width: 60%;
	    padding: 50px;
	}

	@media (max-width: 1100px) {

	    .poster3__img,
	    .poster3__content {
	        width: 100%;
	    }
	}

	/* ! Prenota */

	#divPrenota {
	    position: relative;
	    z-index: 2;
	    width: 95%;
	}

	.divPrenota2 {
	    position: relative;
	    z-index: 2;
	    height: 150px;
	    width: 100%;
	    margin-top: 0%;
	    margin-right: 2%;
	    margin-left: 2%;
	}

	#iframePrenota {
	    border: 1px solid #ccc;
	    border-radius: 15px;
	    box-shadow: 0 9px 9px #ccc;
	}


	@media (max-width: 768px) {
	    #divPrenota2 {
	        position: relative;
	        z-index: 2;
	        margin-top: -15%;
	        margin-right: 0%;
	        margin-left: 0%;
	        width: 100%;
	    }

	    #iframePrenota {
	        border: 0px;
	        border-radius: 0px;
	        box-shadow: 0 0px 0px;
	        width: 100%;
	    }
	}

	iframe {
	    border: 1px solid black;
	    width: 100%;
	    text-align: center;
	}

	/* Buttons */
	.bottonevali {
	    background-color: #4CAF50;
	    border: none;
	    color: white;
	    padding: 19px 38px;
	    text-align: center;
	    text-decoration: none;
	    display: inline-block;
	    font-size: 18px;
	    margin: 2px 1px;
	    -webkit-transition-duration: 0.4s;
	    transition-duration: 0.4s;
	    cursor: pointer;
	}

	.bottone4 {
	    width: auto;
	    height: 470px;
	    padding: 5px 5px;
	    background-color: #252850;
	    color: white;
	    border: 3px solid #252850;
	    border-radius: 15px;
	}

	.bottone4:hover {
	    background-color: yellow;
	    color: #252850;
	    border: 3px solid #252850;
	}

	@media (max-width: 500px) {
	    .bottone4 {
	        width: auto;
	        height: 370px;
	    }
	}

	.bottvali {
	    border: none;
	    color: white;
	    padding: 0px 0px;
	    width: 97%;
	    height: 250px;
	    text-align: center;
	    text-decoration: none;
	    display: inline-block;
	    font-size: 22px;
	    margin: 1px 1px;
	    -webkit-transition-duration: 0.4s;
	    transition-duration: 0.4s;
	    cursor: pointer;
	    border-radius: 5px;
	}

	.bott2 {
	    width: 45%;
	    height: 200px;
	    background-color: #252850;
	    color: white;
	    border: 4px solid #252850;
	    border-radius: 8px;
	    word-wrap: break-word;
	    overflow-wrap: break-word;
	    display: flex;
	    flex-direction: column;
	    align-items: center;
	    justify-content: center;
	    padding: 20px 15px;
	    box-sizing: border-box;
	    text-align: center;
	    line-height: 1.5;
	}

	.bott2 b {
	    display: block;
	    margin-bottom: 10px;
	    font-size: 1.15em;
	    font-weight: 700;
	}

	.bott2 span {
	    display: block;
	    line-height: 1.6;
	    font-size: 0.95em;
	}

	.bott2:hover {
	    background-color: #ffffff;
	    color: black;
	}

	/* Responsive per autolinee */
	@media (max-width: 1000px) {
	    .bott2 {
	        width: 48%;
	        height: auto;
	        min-height: 180px;
	        font-size: 18px;
	        padding: 18px 12px;
	    }
	}

	@media (max-width: 768px) {
	    .bott2 {
	        width: 100%;
	        height: auto;
	        min-height: 150px;
	        margin-bottom: 15px;
	        font-size: 16px;
	        padding: 15px 12px;
	    }

	    .bott2 b {
	        margin-bottom: 6px;
	    }

	    .bottvali {
	        width: 100%;
	        height: auto;
	        font-size: 18px;
	    }
	}

	@media (max-width: 480px) {
	    .bott2 {
	        min-height: 130px;
	        font-size: 14px;
	        padding: 12px 10px;
	        line-height: 1.4;
	    }

	    .bott2 b {
	        margin-bottom: 5px;
	        font-size: 1.05em;
	    }

	    .bottvali {
	        font-size: 16px;
	    }
	}

	/* Text Utilities */
	.tw {
	    color: #fff
	}

	.blk {
	    color: #000;
	}

	.bld {
	    font-weight: bold;
	}

	/* Details/Summary (FAQ) */
	section {
	    max-width: 85%;
	    align-items: center;
	}

	details {
	    background: white;
	    color: #000;
	    padding: 10px;
	    margin-bottom: 2px;
	    border-top: 0px solid #ccc;
	    border-bottom: 1px solid #ccc;
	}

	details:hover {
	    background: #f8f9fa;
	    border-color: #1e40af;
	}

	summary {
	    cursor: pointer;
	    font-weight: 600;
	}

	/* Colori coerenti */
	.blu {
	    color: #1e40af;
	}

	/* Link colori migliorati */
	a[style*="color:#000"] {
	    color: #1e40af !important;
	    transition: color 0.3s ease;
	}

	a[style*="color:#000"]:hover {
	    color: #3b82f6 !important;
	}

	/* Miglioramenti spaziatura e contenitori */
	.normal-text {
	    line-height: 1.8;
	}

	/* Container per contenuto principale */
	.content-container {
	    max-width: 1200px;
	    margin: 0 auto;
	    padding: 0 2rem;
	}

	@media (max-width: 768px) {
	    .content-container {
	        padding: 0 1rem;
	    }
	}

	/* Input */
	.input {
	    border-style: none;
	    font-family: Verdana, Arial, Helvetica, sans-serif;
	    font-size: 11pt;
	    color: white;
	}

	/* Breadcrumb hidden state */
	#breadcrumb-nav.hidden {
	    opacity: 0;
	    transform: translateY(-100%);
	    pointer-events: none;
	}