/* Option 2: Import via CSS */
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css");

html {
  /* riserva da SUBITO lo spazio della scrollbar → niente shrink tardivo */
  scrollbar-gutter: stable;
}
@supports not (scrollbar-gutter: stable) { html { overflow-y: scroll; } }

.action-button {
    padding: 1rem 2rem;
    background-color: transparent; /* Sfondo trasparente */
    color: white; /* Testo bianco */
    font-weight: 400;
    font-size: 16px;
    /* border-radius: 0.375rem; */ /* Rimosso per angoli squadrati */
    text-decoration: none;
    transition: background-color 0.3s ease;
    text-transform:uppercase;
    border: 1px solid #e8e8e8; /* Bordo bianco */
    margin-bottom: 1rem; /* Spazio tra i bottoni in visualizzazione colonna */
    cursor: pointer; /* Aggiunge cursore a puntatore */
}

    .action-button:last-child {
        margin-bottom: 0; /* Rimuove margine dall'ultimo bottone in colonna */
    }

.category-description .section-2 p, 
.category-description .section-third p,
.category-description .section-4 p,
.category-description .progress-bar-overlay p,
.manufacturer-description p, .full-description p, .topic-html-content p, .topic-page p, .news-body p, .custom-tab p {
    margin: 1rem 0;
	width: 100% !important;
	text-align:center !important;
}
/* Stile hover aggiornato */
.action-button:hover {
    background-color: rgba(255, 255, 255, 0.15); /* Sfondo bianco semi-trasparente al passaggio */
}

.container-blog{
    width: 65vw;
    margin: 5rem auto;
}

@media(max-width:768px){
	.container-blog{
		width: 90svw;
		margin: 5rem auto;
	}
}

.blog-title h1{
	margin-top:1rem;
	font-size:3rem;
}

.blogpost-body p{
	margin: 0;
    font-size: 1rem;
    color: #1d1d1d;
    font-family: 'Futura' !important;
    line-height: 125%;
    text-align: left;
}
.blogpost-body h3{
	text-align:center !important;
}

.action-button-light {
    padding: 1rem 2rem;
    background-color: white; /* Sfondo bianco */
    color: #1d1d1d; /* Testo nero */
    font-weight: 400;
    font-size: 16px;
    /* border-radius: 0.375rem; */ /* Rimosso per angoli squadrati */
    text-decoration: none;
    transition: background-color 0.3s ease;
    margin-bottom: 1rem; /* Spazio tra i bottoni in visualizzazione colonna */
    cursor: pointer; /* Aggiunge cursore a puntatore */
}
.caption-mobile {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 300;
	font-size: 16px;
	line-height: 130%;
	text-align: center;
	letter-spacing: -0.05em;
	color: #1D1D1D;
}
.action-button-dark {
    padding: 1rem 2rem;
    background-color: #1d1d1d; /* Sfondo nero */
    color: #fafafa; /* Testo bianco  */
    font-weight: 400;
    font-size: 1rem;
    font-weight:500;
    text-decoration: none;
    transition: background-color 0.3s ease;
    margin-bottom: 1rem; /* Spazio tra i bottoni in visualizzazione colonna */
    cursor: pointer; /* Aggiunge cursore a puntatore */
}

.button-active {
    background-color: #1d1d1d; /* bg-gray-200 */
    color: #fafafa; /* text-gray-800 */
    white-space: nowrap;
}

.colonna-destra-sostenibilita {
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* solo orizzontale a destra */
    /* togli qualsiasi justify-content che forzava il bottom */
}


.menu-image-full{
        list-style-type: none;
        margin: 0;
        padding: 0;
        width: 75%;
        height: 100%;
    }

.button-container {
    transform: translate(0%, 0%); /* Aggiunto per centrare perfettamente */
    display: flex; /* Aggiunto per centrare il contenuto (il link/bottone) */
    justify-content: center; /* Aggiunto per centrare orizzontalmente il contenuto */
    align-items: center; /* Aggiunto per centrare verticalmente il contenuto */
    flex-direction: column;
    font-family: 'Futura';
    font-weight: 400;
    margin-top: 5vh;
    /* Rimuovi margin-bottom dal bottone se c'� un solo bottone e vuoi centrarlo perfettamente */
}
.button-container a:hover{
	color:#fefefe;
}
.caption-container {
    width:80vw !important;
    margin: 0 auto;
}

.caption-mini-container {
    /*width: 80vw !important;*/
    margin: 1rem 1rem !important;
    align-self: center;
}

.title-white {
    font-family: 'Futura';
    font-size: 3rem;
    font-weight: 500;
    margin: 1rem 0rem;
    line-height: 100%;
    color: #FAFAFA;
    font-style: normal !important;
    text-align: left !important;
}

.captionOverlay-white {
    position: absolute;
    top: 80%;
    transform: translate(0%, -50%);
    margin-left: 1rem;
}

.captionWhite-small {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 130%;
    /* or 60px */
    text-align: left;
    letter-spacing: -0.05em;
    color: #FAFAFA;
}

.captionBlack {
    font-family: 'Times Now';
    font-style: normal;
    font-weight: 400;
    font-size: 70px;
    line-height: 86%;
    text-align: center;
    letter-spacing: -0.05em;
    color: #1D1D1D;
}

.captionBlack-alt {
    font-family: 'Times Now';
    font-style: normal;
    font-weight: 400;
    font-size: 50px;
    line-height: 86%;
    text-align: center;
    letter-spacing: -0.05em;
    color: #1D1D1D;
}

.captionBlack-small {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 130%;
    /* or 60px */
    text-align: left;
    letter-spacing: -0.05em;
    color: #1D1D1D;
}

.captionBlack-small-gov {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 130%;
    /* or 60px */
    text-align: left !important;
    letter-spacing: -0.05em;
    color: #1D1D1D;
}

.captionHero-small {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 130%;
    /* or 60px */
    text-align: left;
    letter-spacing: -0.05em;
    color: #FAFAFA;
}

.slide-title {
    font-family: 'Futura';
    font-size: 28px;
    font-weight: 400;
    letter-spacing: -0.05em;
}

.captionOverlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.carousel {
    display: flex;
    transition: transform 0.5s ease;
    scroll-behavior: smooth;
}

.carousel-caption {
    position: absolute;
    top: 50%;
    left: 45%;
    transform: translate(-50%, -50%);
    z-index: 2;
    color: #ffffff;
    font-family: 'Times Now';
    text-align: left !important;
    font-size: 26px;
    line-height: 1.03;
    letter-spacing: -0.5px;
    max-width: 85%;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
}

.made-slider-section-container {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.made-slider-images-mag {
    flex: 1; /* prende tutto lo spazio disponibile */
    overflow: hidden;
}

.made-slider-inner-mag {
    display: flex;
    height: 100%;
    transition: transform 0.5s ease;
}

.made-slide-mag {
    flex: 0 0 100vw;
    display: grid; /* grid per sovrapporre label all�immagine */
    grid-template-areas: "content";
    width: 100%;
    height: 100%;
}

.slide-img-mag {
    grid-area: content;
    width: 100vw;
    height: 100vh;
    object-fit: cover;
}

.made-slide-label-mag {
    grid-area: content;
    align-self: end; /* posiziona in basso */
    justify-self: start; /* start = sinistra, cambialo in end per destra */
    color: #fff;
    padding: 0.5rem 1rem;
    border-radius: 0.25rem;
    z-index: 1; /* sopra l�immagine */
}

.made-slider-footer-mag {
    padding: 1rem 2rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    background: rgba(0,0,0,0.3);
    color: #fff;
    font-weight: bold;
}

.made-slider-progress-mag {
    flex: 1;
    height: 4px;
    background: #ddd;
    border-radius: 2px;
    overflow: hidden;
}

.progress-line-mag {
    height: 100%;
    background: #1d1d1d;
    width: 0%;
    transition: width 0.5s ease;
}


.carousel-slide {
    min-width: 100%;
    position: relative;
}

    .carousel-slide > img {
        object-fit: cover;
    }

.carousel-wrapper {
    overflow: hidden;
}

.code-filato {
    font-family: 'Futura';
    font-size: 1rem;
    font-weight: 500;
    font-style: normal !important;
    text-align: left !important;
}

.code-cura {
    font-family: 'Futura';
    font-size: 1rem;
    font-weight: 500;
    font-style: normal !important;
    text-align: left !important;
}

.colonna-sinistra {
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Pulsanti in alto, immagine in basso */
    height: 90svh;
    border-width: 1px 1px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.1);
}
.mini-shopping-cart .totals{
background: #fff !important;
}
.no-border {
    border-width: 0px 0px !important;
    border-style: none;
    border-color: none;
}

.colonna-destra {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* Testo e bottoni a sinistra */
    justify-content: flex-end; /* Contenuto ancorato in basso */
    height: 100%;
    border-width: 0.5px 0.5px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.1);
	padding-bottom:1rem;
}

.container-no-margin {
    width: 100% !important;
    max-width: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

.content-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: black;
    opacity: 0.2; /* Regola l'opacit� qui */
    z-index: 0; /* Sotto il contenuto */
}



.hero-title-white {
    font-family: 'Futura';
    font-style: normal;
    font-weight: 400;
    font-size: 115px;
    line-height: 86%;
    letter-spacing: -0.05em;
    color: #FFFFFF;
    padding: 1vw;
}

.hero-title-alt-white {
    font-family: 'Times Now Italic';
    font-style: italic;
    font-weight: 400;
    font-size: 118px;
    line-height: 86%;
    letter-spacing: -0.05em;
    color: #FFFFFF;
}

.mi-mt-40vh {
    margin-top: 40vh;
}

.hero-title-white,
.hero-title-alt-white {
    font-size: clamp(50px, 8vw, 118px); /* Minimizza il rischio che il testo sia troppo grande o troppo piccolo */
    line-height: 86%;
    letter-spacing: -0.05em;
    color: #FFFFFF;
}

.hero-section {
    background-image: url("/images/storia/lastoria.jpg"); /* Immagine segnaposto */
    background-size: cover;
    background-position: center;
    height: 1080px; /* Altezza regolabile */
    display: flex;
    align-items: center; /* Centra verticalmente */
    justify-content: center; /* Centra orizzontalmente */
    text-align: center;
}

.jumbotron {
    box-sizing: border-box;
    background: #FAFAFA;
    border-width: 1px 1px;
    border-style: solid;
	height:90svh;
    border-color: rgba(0, 0, 0, 0.2);
}
#jumbotron-madeinitaly {
    box-sizing: border-box;
    background: #FAFAFA;
	height:90svh;
}
.jumbotron-mobile {
    box-sizing: border-box;
    background: #FAFAFA;
    border-width: 1px 1px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.2);
}
.jumbotron-alt {
    box-sizing: border-box;
    background: #FAFAFA;
    border-width: 1px 1px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.2);
    text-align: center;
}

.jumbo-col {
    border-width: 0px 1px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.2);
}

.made-slider-inner.mobile-only {
    display: flex;
    transition: transform 0.5s ease; /* animazione morbida */
}

.made-slide {
    width: 100vw;
    height: 100vh;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    flex: 0 0 100vw;
    box-sizing: border-box;
}

.made-slide-compact {
    width: 100vw;
    height: 50vh;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    flex: 0 0 100vw;
    box-sizing: border-box;
}

.made-slide-index {
    font-family: 'Futura', sans-serif;
    font-size: 14px;
    color: #000;
    font-weight:500;
    margin: 0rem 1rem;
    white-space: nowrap;
}

.slide-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Etichetta opzionale sulla slide (ad esempio �Interni�) */
.made-slide-label {
    position: absolute;
    bottom: 0.5rem;
    left: 20px;
    font-family: 'Futura', sans-serif;
    font-style: normal !important;
    font-size: 2.2rem;
    color: #fff;
    font-weight:500;
}

/* Footer dello slider: sempre visibile sotto le immagini, sfondo bianco */
.made-slider-footer {
    width: 100%;
    margin: 0rem;
    background: #fff;
    padding: 15px 15px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
}

.made-slide-index {
    font-family: 'Futura', sans-serif;
    font-size: 14px;
    color: #000;
    margin-right: 20px;
    white-space: nowrap;
}

.made-slider-progress {
    flex: 1;
    height: 2px; /* Spessore della barra */
    background: #ddd; /* Sfondo grigio chiaro */
    position: relative;
}

.media {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.mi-bg-gray-100 {
    background-color: #fafafa;
}

.mi-bg-gray-200 {
    background-color: #edf2f7;
}

.mi-bg-gray-800 {
    background-color: #2d3748;
}

.mi-bg-gray-700 {
    background-color: #4a5568;
}

.mi-bg-white {
    background-color: #ffffff;
}

.mi-flex {
    display: flex;
}

.mi-flex-col {
    display: flex;
    flex-direction: column;
}

.mi-flex-row {
    display: flex;
    flex-direction: row;
}

.mi-h-full {
    height: 100%;
}

.mi-h-100vh {
    height: 100vh;
}

.mi-items-start {
    align-items: flex-start;
}

.mi-md-flex-row {
    flex-direction: row;
}

.mi-md-pl-8 {
    padding-left: 2rem;
}

.mi-md-flex-row {
    flex-direction: row;
}

.mi-mt-50vh {
    margin-top: 50vh;
}

.mi-nav-button {
    padding: 1rem 2rem;
    background-color: #1d1d1d;
    color: #fafafa;
    border: 1px solid #00000033;
    font-weight: 400;
    margin: 0 1rem 0 1.25rem;
    font-size: 1rem;
    cursor: pointer;
    font-family: Futura;
    transition: background-color 0.3s ease;
    white-space: nowrap;
}

.mi-px-4 {
    padding-left: 1rem;
    padding-right: 1rem;
}

.mi-px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.mi-py-12 {
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.mi-py-2 {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.mi-text-white {
    color: #ffffff;
}

.mi-text-gray-800 {
    color: #2d3748;
}

.captionMI {
	margin-bottom:3rem;
	margin-top:3rem;
}

.mi-text-center {
    text-align: center;
}

.mi-text-white {
    color: #ffffff;
}

.mi-text-gray-800 {
    color: #2d3748;
}

.mi-text-center {
    text-align: center;
}

.mi-w-full {
    width: 100%;
}

.mobile-carousel {
    position: relative;
    display: block;
    width: 100%;
    max-width: 100%;
    min-height: 630px;
    height: auto;
    overflow: hidden;
    box-sizing: border-box;
}

.progress-bar {
  width: 100%;
  height: 100%;
  background: #fff;
  border-radius: 3px;
  transform-origin: left;
  transform: scaleX(var(--p, 0));
  transition: transform .1s linear;
}
.mobile-progress-bar {
  width: 100%;
  height: 100%;
  background: #fff;
  border-radius: 3px;
  transform-origin: left;
  transform: scaleX(var(--p, 0));
  transition: transform .3s ease;
}

.mobile-progress-bar-container {
    position: absolute;
    bottom: 7svh;
    left: 5%;
    right: 5%;
    width: 90%;
    height: 6px;
    background-color: rgba(255, 255, 255, 0.4);
    border-radius: 3px;
    overflow: hidden;
    z-index: 10;
}

.nav-filati {
    margin-bottom: 50vh;
}

.hero-2 .hero-2-caption {
    position: absolute;
    top: auto; /* disabilita il top al 50% */
    bottom: 0; /* ancorato in basso */
    left: 0; /* allineato a sinistra */
    transform: none; /* nessuna traslazione */
    padding: 20px; /* distanziamento interno (regola in base al tuo design) */
    z-index: 2; /* sopra l�immagine e l�overlay */
}

.hero-2-caption {
    width: 50vw;
}

/* === �Lo scopo dell�Accademia�: bottom-left flush colonna immagine === */
.jumbotron.scopo-section {
    align-items: stretch !important; /* override di mi-items-start */
}

    .jumbotron.scopo-section .colonna-sinistra {
        position: relative; /* contesto per absolute pos */
    }

    .jumbotron.scopo-section .scopo-caption {
        position: absolute;
        bottom: -30vh; /* ancorato in basso */
        left: -2vw; /* allineato a sinistra */
        transform: none; /* nessuna traslazione */
        margin-top: 0; /* toglie gap residuo */
        padding: 0px; /* regola a piacere */
        z-index: 1;
    }


/* il colore rimane quello di default (nera o definito da .title-cura/.captionBlack-small-cura) */

.hero-2 .title-cura,
.hero-2 .captionBlack-small-cura {
    color: #FFFFFF !important; /* forza il bianco */
}

.progress-line {
    left: 0;
    top: 0;
    height: 6px;
    overflow: visible;
    width: 0%; /* Varia via JS */
    background: #000; /* Nero */
    transition: width 0.3s ease;
}

.section-hero {
    position: relative;
    margin-bottom: 50px;
    height: 100svh; /* << ALTEZZA SCHERMO INTERO >> */
    width: 100%; /* Larghezza piena */
    overflow: hidden; /* Nasconde ci� che potrebbe strabordare */
}

.section-2 {
    width: 80vw;
    height: 25vh;
    margin: 10vh auto;
    align-items: center;
}

.section-4 {
    width: 80vw;
    margin: 5rem auto;
    text-align: center;
}

.section-topic {
    width: 90vw;
    margin: 5rem auto;
	background-color: #fff;
}

.section-subtitle {
    margin: 1rem;
    font-family: 'Futura';
    font-style: normal !important;
    font-weight: 400;
    font-size: 86px;
    line-height: 86%;
    text-align: center;
    letter-spacing: -0.05em;
    color: #1D1D1D;
}

.section-third {
    /* width: 30vw; */ /* Cambia da vw a % per essere relativo alla slide */
    width: 30%; /* Larghezza relativa alla slide genitore */
    margin: 0 1%; /* Aggiunge piccolo spazio tra le colonne */
    /* height: 100vh; */ /* !!! RIMUOVI/MODIFICA: L'altezza non deve essere 100vh !!! */
    height: auto; /* Altezza si adatta al contenuto */
    max-height: 85%; /* Limita l'altezza massima per non toccare bordi slide (aggiusta se serve) */
    /* Mantieni questi per il centering interno alla colonna */
    display: flex;
    flex-direction: column; /* Metti titolo/testo sopra/sotto se necessario */
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden; /* Nasconde contenuto che esce dalla colonna */
}

.slide {
    /* MANTIENI LE TUE REGOLE ESISTENTI per posizionamento, overflow, ecc. */
    position: relative; /* Gi� presente e corretto */
    overflow: hidden; /* Gi� presente e corretto */
    /* AGGIUNGI/MODIFICA QUESTE: */
    width: 100vw; /* Occupa tutta la larghezza della finestra */
    height: 100%; /* Occupa tutta l'altezza del container sticky */
    flex-shrink: 0; /* Impedisce alle slide di restringersi */
    display: flex; /* Usa flex per centrare il contenuto (caption) */
    justify-content: center; /* Centra orizzontalmente la caption */
    align-items: center; /* Centra verticalmente la caption */
}

    .slide .media {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        display: block;
        position: absolute; /* Posizionata rispetto a .slide */
        top: 0;
        left: 0;
        z-index: 1; /* Sotto il testo */
    }

    .slide .captionHistorical {
        color: #ffffff;
        padding: 20px 30px;
        border-radius: 5px;
        max-width: 75vw;
        text-align: center;
        line-height: 1.6;
        position: relative;
        z-index: 2;
    }

.slide-img-mobile-full {
    width: 100vw;
    height: 60svh;
}

.slide .captionHistorical p {
    margin: 0;
    font-family: 'Times Now';
    font-size: 26px;
    font-style: normal !important;
    line-height: 103%;
    letter-spacing: -0.05rem;
	word-wrap: normal;
	hyphens: none;
    -webkit-hyphens: none; /* Safari/iOS */
    -ms-hyphens: none;     /* vecchi IE */
    overflow-wrap: break-word;
    padding: 1rem;
}
.overlay-text{
	background-color: rgba(0, 0, 0, 0.25);
}

.captionMaglificio{
    font-family: 'Times Now';
    font-size: 32px;
    font-style: normal !important;
    line-height: 103%;
    letter-spacing: -0.05rem;
}
/* Mostra barra + overlay quando attiva */
.progress-bar-container.visible {
    opacity: 1;
}

.small-media {
    width: 30svw;
    height: auto;
    margin: 80px auto;
    display: block;
}

.title-bk {
    font-family: 'Futura';
    font-size: 90px;
    font-weight: 400;
    letter-spacing: -0.05em;
    margin: 3rem;
    text-align: center;
}

.subtitle-bk {
    font-family: 'Futura';
    font-size: 50px;
    font-weight: 400;
    letter-spacing: -0.05em;
    margin: 1rem;
	font-style:normal;
	color:#1d1d1d;
}

.title-wrapper
 {
    /*display: inline-flex;*/
    align-items: center;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
}

.titleMini {
    font-family: 'Futura';
    font-size: 24px;
    font-weight: 400;
    color: #1D1D1D;
    letter-spacing: -0.05em;
}

.year-btn {
    font-family: 'Futura';
    background-color: #1c1c1c;
    color: white;
    border: 1px solid #fff;
    padding: 10px;
    font-size: 21px;
    width: 256px;
    height: 50px;
    margin: 0px;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color 0.3s ease, border-color 0.3s ease;
}
/*Made in Italy*/

.made-slide-title {
    margin: 0 0 5px 0;
    font-family: 'Futura', sans-serif;
    font-size: 18px; /* Dimensione pi� contenuta */
    color: #000; /* Testo nero */
}

/* Stile per il sottotitolo (caption) */
.made-slide-subtitle {
    margin: 0.5rem 0rem 0rem 0rem;
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    color: #000;
}

.made-slider-container {
    overflow: hidden;
    width: 100%;
}

.made-slider-section-container {
    position: relative;
}

.mi-md-w-1\/2 {
    width: 50%;
}

.mi-shadow-md {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.made-slider-inner {
    display: flex;
    transition: transform 0.3s ease;
}

.carousel-container {
    display: block;
}

.container {
    width: 100% !important;
    min-width: 100%;
    max-width: 100%;
}

.center-1 {
    margin: 0 !important;
}

.made-slide-caption {
    padding: 0;
    background-color: #fff; /* Sfondo bianco */
    text-align: left;
    box-sizing: border-box;
}

.made-slide-label {
    position: absolute;
    bottom: 0.5rem;
    left: 20px;
    font-family: 'Futura', sans-serif;
    font-style: normal !important;
    font-size: 2.2rem;
    color: #fff;
}

.made-slider-images {
    width: 100%;
    height: 80vh; /* Regola a piacere */
    overflow: hidden;
    position: relative;
}

.page .page-body .topic-page {
    font: 15px / 25px 'Inter', serif !important;
    scroll-behavior: smooth;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
    text-align: unset !important;
    font-style: normal !important;
}

.slide-img {
    width: 100%; /* Occupa la larghezza della colonna .section-third */
    height: 80svh !important;
    max-height: 100%; /* Limita altezza massima all'interno della colonna */
    height: auto; /* Mantiene proporzioni, l'altezza si adatta */
    object-fit: contain; /* 'contain' per vedere tutta l'immagine, 'cover' per riempire (pu� tagliare) */
    display: block; /* Rimuove eventuale spazio extra sotto l'immagine */
}

.slide-lg-img {
    width: 100%; /* Occupa la larghezza della colonna .section-third */
    max-height: 100%; /* Limita altezza massima all'interno della colonna */
    height: auto; /* Mantiene proporzioni, l'altezza si adatta */
    object-fit: contain; /* 'contain' per vedere tutta l'immagine, 'cover' per riempire (pu� tagliare) */
    display: block; /* Rimuove eventuale spazio extra sotto l'immagine */
}
.slideshow-wrapper {
    display: flex;
    width: 300%;
    height: 100%;
    transition: transform 1s ease-in-out;
}

    .slideshow-wrapper > .slide {
        width: calc(100% / 3);
        height: 100%;
        flex-shrink: 0;
        display: flex;
        justify-content: space-around;
        align-items: center;
        padding: 0;
        box-sizing: border-box;
    }

/*Storia*/

.progress-bar-year {
    font-family: 'Futura';
    font-style: normal !important;
    font-size: 72px;
    color: #fff;
    margin: 0;
    padding: 0;
    line-height: 1;
}

.year-btn:hover,
.year-btn.active {
    background-color: white;
    color: #1c1c1c;
    border-color: #999;
}

.captionHistorical {
    position: absolute;
    color: #fff;
    font-size: 18px;
    padding: 20px;
    text-align: center;
    max-width: 45%;
    max-height: 255px;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
}

.category-description, .manufacturer-description, .vendor-description {
    color: #1d1d1d;
    margin: 0;
    font-family: Inter;
    font-weight: 400;
    font-size: 16px;
    line-height: 112%;
    letter-spacing: 0;
    width: 100vw !important;
}

.horizontal-slider {
    display: flex;
    height: 100%;
    /* La larghezza verr� impostata da JS */
    will-change: transform; /* Ottimizzazione per l'animazione */
}

.master-column-wrapper {
    position: relative;
    z-index: 0;
    width: 100%;
    margin: 0 auto;
    padding: 0;
}


.progress-bar-overlay {
    position: absolute;
    bottom: 120%; /* Posiziona sopra la barra */
    left: 0;
    width: 100%;
    text-align: left;
    pointer-events: none;
	min-height:3.5rem;
}

.progress-bar-title {
    font-family: 'Futura', sans-serif; /* Usa i tuoi font */
    font-size: 20px; /* Dimensione aggiustabile */
    color: #fff;
    margin: 0 0 4px 0; /* Spazio sotto il titolo */
    padding: 0;
    line-height: 1.1;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
}

.progress-bar-year-display { /* Selettore classe aggiornato */
    font-family: 'Futura', sans-serif; /* Usa i tuoi font */
    font-size: 60px; /* Dimensione aggiustabile */
    font-weight: 400; /* O il peso desiderato */
    color: #fff;
    margin: 0;
    padding: 0;
    line-height: 1;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.7);
}

.horizontal-slider {
    display: flex;
    height: 100%;
    /* La larghezza verr� impostata da JS */
    will-change: transform; /* Ottimizzazione per l'animazione */
}

.sticky-parent {
    position: relative;
    width: 100%;
	height: calc(100svh * var(--slides, 6)); 
}

.sticky-container {
    position: sticky;
    top: 0;
    height: 100svh; /* Occupa tutta l'altezza della finestra */
    width: 100%;
    overflow: hidden; /* Nasconde lo slider che sborda orizzontalmente */
}

.year-badge {
    position: absolute;
    bottom: 1rem; /* Distanza dal basso */
    left: 1rem; /* Distanza da sinistra */
    background-color: rgba(255, 255, 255, 0.8); /* Sfondo bianco semitrasparente */
    color: #333; /* Testo scuro */
    padding: 0.5rem 1rem;
    font-weight: bold;
    border-radius: 0.25rem; /* Angoli arrotondati */
    z-index: 3; /* Sopra l'overlay */
}

.year-selector{
    position: static !important;
    transform: none !important;
    width: 100%;
    min-height: 50px;
    height: auto;
    margin-top: 8px;
    z-index: 2;
  }

.year-selector-inner {
    display: inline-flex;
    gap: 0px;
    padding: 0px;
}

/*Sostenibilit�*/

.colonna-destra-img {
    display: flex;
    height: 100vh;
}

.jumbo-title {
    margin: 1rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/*404*/
.content-wrapper {
    position: relative; /* Per stare sopra l'overlay */
    z-index: 10;
    width: 100%; /* Occupa tutta la larghezza disponibile */
    max-width: 42rem; /* Limita la larghezza massima su schermi grandi */
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 2rem; /* Spaziatura interna */
}

.error-code-container {
    /* Ridotto margine inferiore per avvicinare il testo sotto */
    margin-bottom: 0.5rem; /* Era 1rem */
}

.error-code {
    /* Responsive: Dimensione base leggermente ridotta per schermi stretti */
    font-size: 10rem; /* Era 12rem */
    font-weight: 500;
    line-height: 1; /* Aggiunto per controllare l'altezza della riga */
    font-family: 'Futura';
}

/* Stile per il messaggio di errore */
.error-message-container {
    margin-bottom: 2rem; /* Equivalente a mb-8 */
}

.error-message {
    /* Responsive: Dimensione base per mobile */
    font-size: 2rem;
    font-family: TimesNow;
    font-style: italic;
}

.inner-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: white;
}

.main-container {
    min-height: 100vh; /* Occupa almeno tutta l'altezza dello schermo */
    display: flex; /* Abilita Flexbox */
    align-items: center; /* Centra verticalmente */
    justify-content: center; /* Centra orizzontalmente */
    position: relative; /* Necessario per posizionare l'overlay */
}

.body-404 {
    font-family: sans-serif; /* Font di fallback */
    background:#1d1d1d;
    overflow: hidden;
}

/*Matertiali e Cura*/

.filato-prog-btn,
.filato-desc,
.cura-desc {
    margin: 1rem;
}


#filato-buttons,
#cura-buttons {
    margin-top: 1rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem; /* Puoi modificare il valore per adattarlo alle tue esigenze */
}

.made-slide-title-cura {
    font-family: 'Futura';
    font-size: 1.5rem;
    font-weight: 400;
    margin: 0rem 0rem;
}

.made-slide-subtitle-cura {
    font-family: 'Inter';
    font-size: 1rem;
    margin: 1rem 1rem 1rem 0rem;
}

.made-slider-container-cura {
    overflow: hidden;
    width: 100%;
}

.made-slide-cura {
    flex: 0 0 100%; /* Ogni slide occupa il 100% della larghezza del container */
    box-sizing: border-box;
}

.made-slider-inner-cura {
    display: flex;
    transition: transform 0.3s ease;
}
/* risolve problema visualizzazione barre filato-selector e cura-selector su mobile */
.filato-selector,
.cura-selector {
    display: flex;
    overflow-x: auto; /* scroll orizzontale quando necessario */
    overflow-y: hidden; /* nasconde overflow verticale */
    white-space: nowrap; /* impedisce che il contenuto vada a capo */
    padding-bottom: 0.75rem; /* spazio inferiore per facilitare scrolling */
    padding-top: 0.75rem;
    -webkit-overflow-scrolling: touch; /* scrolling fluido su iOS */
}

/* Imposta chiaramente un'altezza minima per le barre */
.filato-selector-inner,
.cura-selector-inner {
    display: flex;
    align-items: center;
    height: auto; /* si adatta automaticamente al contenuto */
    flex-wrap: nowrap; /* non andare a capo */
}

    /* eventuali bottoni contenuti nelle barre */
    .filato-selector-inner button,
    .cura-selector-inner button {
        flex-shrink: 0; /* evita che i bottoni si comprimano */
    }


.filato-selector-inner {
    display: inline-flex;
    flex-wrap: nowrap;
    gap: 0;
    white-space: nowrap;
}

.filato-btn {
    flex: 0 0 auto;
    padding: 10px;
    font-size: 14px;
    margin: 0;
    white-space: nowrap;
    background-color: #fafafa;
    color: #1d1d1d;
    border: 1px solid #00000033;
    font-weight: 500;
    font-size: 1rem;
    cursor: pointer;
    font-family: 'Futura Std';
}

.cura-selector {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.cura-selector-inner {
    display: inline-flex;
    flex-wrap: nowrap;
    gap: 0;
    white-space: nowrap;
}

.cura-btn {
    flex: 0 0 auto;
    padding: 10px;
    font-size: 14px;
    margin: 0;
    white-space: nowrap;
    background-color: #fafafa;
    color: #1d1d1d;
    border: 1px solid #00000033;
    font-weight: 500;
    font-size: 1rem;
    cursor: pointer;
    font-family: Futura;
}

.cura-selector {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.cura-selector-inner {
    display: inline-flex;
    flex-wrap: nowrap;
    gap: 0;
    white-space: nowrap;
}

.cura-btn {
    flex: 0 0 auto;
    padding: 10px;
    font-size: 14px;
    margin: 0;
    white-space: nowrap;
    background-color: #fafafa;
    color: #1d1d1d;
    border: 1px solid #00000033;
    font-weight: 500;
    font-size: 1rem;
    cursor: pointer;
    font-family: Futura;
}

.captionBlack-small-filato {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 130%;
    text-align: left;
    letter-spacing: -0.05em;
    color: #1D1D1D;
}

.captionBlack-small-cura {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 130%;
    text-align: left;
    letter-spacing: -0.05em;
    color: #1D1D1D;
}

.title-cura {
    font-family: 'Futura';
    font-size: 3rem;
    font-weight: 500;
    font-style: normal !important;
    line-height: 100%;
    text-align: left !important;
}

.title-filato {
    font-family: 'Futura';
    font-size: 3rem;
    font-weight: 500;
    font-style: normal !important;
    text-align: left !important;
}

.text-filati {
    margin-top: 50vh;
}

.title-mini {
    font-family: 'Futura';
	font-style:normal;
    font-size: 24px;
    font-weight: 500;
    letter-spacing: -0.05em;
    margin: 1rem;
    display:flex;
    justify-content:center;
    line-height:1;
}

.mi-filato-button {
    padding: 5px 14px;
    background-color: #fafafa;
    color: #1d1d1d;
    border: 1px solid #00000033;
    font-weight: 500;
    margin: 0rem 0.25rem;
    font-size: 13px;
    cursor: pointer;
    font-family: Futura;
    line-height: 112%;
    transition: background-color 0.3s ease;
    white-space: nowrap;
    height: 2rem; /* <- assicura che il testo interno non si spezzi su pi� righe */
}

.small-media-jumbo {
    width: 150px;
    height: auto;
    margin: 1rem;
    display: block;
}

.caption-anchor-left {
    position: absolute;
    margin: 1rem;
    top: 45%;
    transform: translate(0%, -50%);
    width: 45%;
}

.caption-anchor-right {
    margin-top: 50vh;
    margin-right: 1rem;
    margin-bottom: 1rem;
    width: 90%;
    text-align: left;
}

.denom-filato {
    font-family: 'Futura';
    font-size: 1rem;
    font-weight: 400;
    font-style: normal !important;
    text-align: left !important;
}
/* 1) Il contenitore interno diventa un flex container orizzontale */
.made-slider-inner.mobile-only {
    display: flex;
    transition: transform 0.5s ease; /* animazione morbida */
}

/* 2) Ogni slide occupa esattamente 100vw e non si restringe */
.made-slide.mobile-only {
    display: flex;
    flex-direction: column; /* impila immagine + caption verticalmente */
    width: 100vw;
    height: auto; /* l’altezza si adatta al contenuto */
    overflow: visible; /* niente più tagli */
    box-sizing: border-box;
}

.sticky-container > .progress-bar-container {
    position: absolute; /* Posizionato rispetto a .sticky-container */
    bottom: 30px; /* Distanza dal basso */
    left: 5%; /* Allineato a sinistra con margine */
    width: 90%; /* Larghezza */
    height: 6px;
    background-color: rgba(255, 255, 255, 0.3); /* Sfondo semi-trasparente */
    border-radius: 3px;
    z-index: 10; /* Sopra lo slider ma sotto eventuali altri overlay */
    opacity: 1; /* Assicurati sia visibile (prima era controllato da JS) */
    pointer-events: none; /* Non interagibile */
    transition: opacity 0.4s ease; /* Transizione (opzionale) */
}

.button-active {
    background-color: #1d1d1d !important; /* bg-gray-200 */
    color: #fafafa !important; /* text-gray-800 */
    white-space: nowrap;
}

@media (max-width: 1024px) {
	
	 .made-slider-section-container-aca,
  .made-slider-section-container-sos {
    position: relative;
    display: flex;
    flex-direction: column;
    height: auto !important;
    overflow: visible !important;
    margin-bottom: 4rem;
  }

  .made-slider-section-container-aca .made-slide.mobile-only,
  .made-slider-section-container-sos .made-slide.mobile-only {
    aspect-ratio: auto !important;
    height: auto !important;
  }

  .made-slider-section-container-aca .made-slider-inner.mobile-only,
  .made-slider-section-container-sos .made-slider-inner.mobile-only {
    flex: 0 0 auto;
  }

  .made-slider-section-container-aca .made-slider-footer,
  .made-slider-section-container-sos .made-slider-footer {
    position: static !important;
    margin-top: 0.75rem;
    padding: 0.75rem 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: #fff;
  }

  .made-slider-section-container-aca .made-slider-progress,
  .made-slider-section-container-sos .made-slider-progress {
    flex: 1;
    height: 3px;
    background: #ddd;
    border-radius: 2px;
    overflow: hidden;
  }

  .made-slider-section-container-aca .progress-line,
  .made-slider-section-container-sos .progress-line {
    height: 100%;
    background: #000;
    width: 0%;
    transition: width 0.3s ease;
  }


/* === Caption + collapse === */
.made-slider-section-container-aca .made-slide-caption,
.made-slider-section-container-sos .made-slide-caption {
  padding: 1rem;
  background-color: #fff;
  text-align: left;
}

/* compressa a ~5 righe di default */
.made-slider-section-container-aca .made-slide-subtitle,
.made-slider-section-container-sos .made-slide-subtitle {
  margin-top: 0.5rem;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  line-height: 1.15;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* espansa */
.made-slider-section-container-aca .made-slide-caption.is-expanded .made-slide-subtitle,
.made-slider-section-container-sos .made-slide-caption.is-expanded .made-slide-subtitle {
  -webkit-line-clamp: unset;
  max-height: none;
}

/* bottone Leggi tutto / Mostra meno */
.made-caption-toggle {
  margin-top: 0.5rem;
  padding: 0;
  border: none;
  background: none;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 500;
  text-decoration: underline;
  cursor: pointer;
  color: #1d1d1d;
}

.made-slider-section-container-aca .mobile-slider-nav,
  .made-slider-section-container-sos .mobile-slider-nav {
    position: absolute;
    top: 35%;
    transform: translateY(-50%);
    z-index: 5;
    width: 40px;
    height: 40px;
    border-radius: 999px;
    border: none;
    background: rgba(255,255,255,0.85);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
  }

  .made-slider-section-container-aca .mobile-slider-nav-prev,
  .made-slider-section-container-sos .mobile-slider-nav-prev {
    left: 8px;
  }

  .made-slider-section-container-aca .mobile-slider-nav-next,
  .made-slider-section-container-sos .mobile-slider-nav-next {
    right: 8px;
  }

  .made-slider-section-container-aca .mobile-slider-nav i,
  .made-slider-section-container-sos .mobile-slider-nav i {
    font-size: 1.2rem;
    line-height: 1;
  }
  
  
.hero-img {
    width: 100%;
    height: auto !important;
    object-fit: cover;
    display: block;
}
	
  .mgsxm-captionOverlay{ 
	display:none !important;
  }
  
  #mgsxmCaptionLive{
	margin:0;
	line-height: 0.95;
	font-size: 1.25rem;
	font-family: 'Times Now';
	text-align: left;
	touch-action: pan-y;    /* suggerisce al browser: solo scroll verticale */
    overflow: hidden; 
  }
  
   .mgsxm-caption-bar {
    display: flex;
    align-items: flex-start;     /* testo parte dall'alto */
    gap: 0rem;
    padding: 0.75rem 0rem 1rem;
    white-space: normal !important; /* annulla eventuale nowrap ereditato */
  }
  
  .mgsxm-nav {
    align-self: flex-start;
  }
  
.mgsxm-caption-live::before {
    content: attr(data-year);
    display: block;
    font-weight: 500;
    opacity: 0.85;
    margin-bottom: 0.25rem;
  }

  /* La foto resta come prima */
  .mgsxm-mediaBox { position: relative; }

  /* Caption globale sotto la barra anni */
  .mgsxm-caption-live {
	width: 100%;
    max-width: 100%;
	flex: 1 1 auto;
    min-width: 0;
    margin-top: 0;
    padding: 0;
	height:auto;
    font-size: 0.95rem;
	white-space: normal !important; 
    line-height: 0.95;
  }
  
  .mgsxm-slide {
    flex: 0 0 100%;
  }

  /* (opzionale) separatore visivo leggero */
  .mgsxm-caption-live::before {
    content: attr(data-year);
    display: block;
    font-weight: 500;
    margin: 0 0 0.35rem 0;
    opacity: 0.85;
  }
  .mgsxm-nav{
    flex:0 0 auto; width:2.25rem; height:2.25rem;
	border:0px;
    display:inline-flex; align-items:center; justify-content:center;
    background:#fff; font-size:1.3rem; line-height:1; padding:0;
    touch-action:manipulation;
  }
  .mgsxm-nav:active{ transform: scale(.98); }
	
	.captionMaglificio {
		font-family: 'Times Now';
		font-size: 20px;
		font-style: normal !important;
		line-height: 85%;
		letter-spacing: -0.05rem;
	}

    /* container cresce con il contenuto, niente overflow hidden */
    .made-slider-section-container-sostenibilita.mobile-only {
        width: 100vw;
        height: auto;
        overflow: visible;
    }

    /* inner rimane flex per lo scroll orizzontale */
    .made-slider-inner-sostenibilita {
        display: flex;
        transition: transform 0.5s ease;
    }

    /* ogni slide � colonna, altezza automatica */
    .made-slide-sostenibilita {
        flex: 0 0 100svw; /* occupa tutta la larghezza del viewport */
        display: flex;
        flex-direction: column;
        width: 100svw;
        height: auto;
        overflow: visible;
        box-sizing: border-box;
    }

    /* immagine full-width, height auto */
    .slide-img-mobile-sostenibilita {
        width: 100%;
        height: auto;
        object-fit: cover; /* o contain se vuoi vederla tutta */
        display: block;
    }

    /* caption subito sotto, tutto visibile */
    .made-slide-caption-sostenibilita {
        padding: 1rem;
        background: #fff;
        color: #1d1d1d;
        text-align: left;
        overflow: visible;
    }

    .made-slide-title-sostenibilita {
		margin: 0rem 0 0rem 1rem;
        font-size: 1.25rem;
        font-weight: 500;
        font-family: 'Futura';
    }

    .made-slide-subtitle-sostenibilita {
        margin: 1rem 0 !important;
        font-size: 1rem;
        line-height: 1.4;
        font-family: 'Inter';
    }

    /* footer subito sotto tutte le slide */
    .made-slider-footer-sostenibilita {
        margin-top: 0;
        width: 100%;
        padding: 0.75rem 1rem;
        background: #fff;
        box-sizing: border-box;
    }

    .made-slider-progress-sostenibilita {
        width: 100%;
        height: 4px;
        background: #ddd;
        border-radius: 2px;
        overflow: hidden;
    }

    .progress-line-sostenibilita {
        width: 0%; /* lo imposti via JS */
        height: 100%;
        background: #000;
        transition: width 0.3s ease;
    }

    .made-slider-section-container,
    .made-slider-section-container-mag {
        height: 40vh;
    }

    .made-slider-section-container,
    .made-slider-section-container-aca {
        height: 40vh;
    }
	.made-slider-section-container-aca {
        height: 65vh !important;
    }


    /* 2) Slide container resta grid, no posizioni assolute */
    .made-slide-mag {
        display: grid; /* mantiene overlay label */
    }

    /* 3) Label: meno margin, font-size pi� piccolo, posizione statica */
    .made-slide-label-mag {
        position: static !important; /* override se in precedenza era absolute */
        margin: 1rem 0rem; /* margini ridotti */
        font-size: 2rem; /* testo pi� piccolo */
        align-self: end; /* resta in basso */
        justify-self: start; /* in basso a sinistra, usa end per destra */
        font-weight:500;
    }
    /* MadeInItaly.css */
    .made-slider-images {
        grid-template-columns: repeat(3, 1fr);
        width: 100%;
        height: auto;
        overflow: hidden;
        position: relative;
    }

    .made-slide-caption {
        font-size: 1rem;
        line-height: 1.5rem;
        padding: 1rem;
        flex: 0 0 auto;
    }

    /* MaterialieCura.css */
    .grid-container {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1.5rem;
    }

    .card {
        margin-bottom: 0;
    }

    .title-bk,
    .captionBlack {
        font-size: 26px;
        margin: 0rem;
    }

    .made-slider-footer {
        display: flex;
        align-items: center;
        justify-content: flex-start; /* Gli elementi partono da sinistra */
        gap: 1rem; /* Spazio tra indice e progress bar */
    }

    .made-slider-section-container {
        position: relative;
    }

    .made-slider-progress {
        width: 100%;
        margin-right: 1rem;
        height: 2px;
        background-color: rgba(0, 0, 0, 0.4);
        overflow: hidden;
        z-index: 10;
    }

    .made-slide-index {
        font-family: 'Futura', sans-serif;
        font-size: 1rem;
        color: #1d1d1d;
        margin: 0 1rem;
        white-space: nowrap;
    }

    /* Barra di avanzamento effettiva */
    .progress-line {
        left: 0;
        top: 0;
        height: 6px;
        overflow: visible;
        width: 0%; /* Varia via JS */
        background: #000; /* Nero */
        transition: width 0.3s ease;
    }

    .jumbotron {
        display: none !important;
    }

    .made-slide-title {
        font-family: 'Futura';
        font-size: 1.5rem;
        font-weight: 500;
		margin: 0rem 0rem 0rem 0rem;
    }

    .made-slide-subtitle {
        font-family: 'Inter';
        font-size: 1rem;
        margin: 1rem 0rem !important;
        font-weight: 400;
		width:100% !important;
		line-height:1.15;
    }
	
	.read-more{
		text-decoration: underline;
	}
    .made-slider-container {
        overflow: hidden;
        width: 100%;
    }

    .made-slide {
        flex: 0 0 100vw; /* Ogni slide occupa il 100% della larghezza del container */
        box-sizing: border-box;
        height: auto;
    }

    .made-slider-inner {
        display: flex;
        transition: transform 0.3s ease;
    }

    .made-slide-title-cura {
        font-family: 'Futura';
        font-size: 1.5rem;
        font-weight: 500;
        margin: 1rem 1rem 0rem 0rem;
        text-align: left;
        padding: 10px;
    }

    .made-slide-subtitle-cura {
        font-family: 'Inter';
        font-size: 1rem;
        margin: 0;
        font-weight: 500;
        text-align: left;
        padding: 10px;
    }

    .made-slider-container-cura {
        overflow: hidden;
        width: 100%;
    }

    .made-slide-cura {
        flex: 0 0 100%; /* Ogni slide occupa il 100% della larghezza del container */
        box-sizing: border-box;
    }

    .made-slider-inner-cura {
        display: flex;
        transition: transform 0.3s ease;
    }

    .slide-img-mobile {
        width: 100%;
        max-width: 100svw;
        height: auto;
        margin: 0vh 70vw 0.5rem 0rem;
    }

    .filato-selector {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .filato-selector-inner {
        display: inline-flex;
        flex-wrap: nowrap;
        gap: 0;
        white-space: nowrap;
    }

    .button-active {
        background-color: #1d1d1d !important; /* bg-gray-200 */
        color: #fafafa !important; /* text-gray-800 */
        white-space: nowrap;
    }

    .filato-btn {
        flex: 0 0 auto;
        padding: 10px;
        font-size: 14px;
        margin: 0;
        white-space: nowrap;
        background-color: #fafafa;
        color: #1d1d1d;
        border: 1px solid #00000033;
        font-weight: 500;
        font-size: 1rem;
        cursor: pointer;
        font-family: Futura;
    }

    .cura-selector {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .cura-selector-inner {
        display: inline-flex;
        flex-wrap: nowrap;
        gap: 0;
        white-space: nowrap;
    }

    .cura-btn {
        flex: 0 0 auto;
        padding: 10px;
        font-size: 14px;
        margin: 0;
        white-space: nowrap;
        background-color: #fafafa;
        color: #1d1d1d;
        border: 1px solid #00000033;
        font-weight: 500;
        font-size: 1rem;
        cursor: pointer;
        font-family: Futura;
    }

    .title-bk {
        font-family: 'Futura';
        font-size: 24px;
        font-weight: 500;
        letter-spacing: -0.05em;
        text-align: left;
    }

    .caption-mini-container {
        max-width: 100%;
        margin: auto;
    }

    .captionBlack {
        font-family: 'Times Now';
        font-style: normal;
        font-weight: 400;
        font-size: 26px;
        line-height: 86%;
        /* or 60px */
        text-align: center;
        letter-spacing: -0.05em;
        color: #1D1D1D;
    }

    .titleMobile {
        font-family: 'Futura';
        font-size: 24px;
        font-weight: 500;
        color: #1D1D1D;
        letter-spacing: -0.05em;
    }

    .titleMobile-alt {
        font-family: 'Times Now';
        font-size: 26px;
        font-weight: 500;
        color: #1D1D1D;
        letter-spacing: -0.05em;
    }

    .captionBlack-small {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 300;
        font-size: 16px;
        line-height: 130%;
        /* or 60px */
        text-align: left;
        letter-spacing: -0.05em;
        color: #1D1D1D;
    }

    .small-media-desktop {
        display: none;
    }

    

    .container {
        width: 100% !important;
        min-width: 100%;
        max-width: 100%;
    }

    .slider-section-container {
        display: none;
    }

    .slider-spacer {
        display: none;
    }

    .carousel-container {
        display: block;
    }

    .captionBlack,
    .captionBlack-alt {
        font-size: 26px;
    }

    .section-subtitle {
        font-size: 24px;
    }

    .titleMini {
        font-size: 18px;
    }

    .hero-img {
        height: 100svh;
        width: 100svw;
        object-fit: cover;
    }

    .hero-title-white {
        font-size: 2.5rem;
    }

    .hero-title-alt-white {
        font-size: 2.5rem;
    }


    /* Riduci il margine superiore e inferiore delle sezioni testo */
    .section-2 {
        margin: 3rem auto; /* da 9rem a 3rem ad esempio */
        padding: 0 1rem;
    }

    /* Ricalibra le dimensioni dei titoli e delle caption per mobile */
    .titleMini {
        font-size: 18px; /* riduci rispetto ai desktop */
    }

    .captionBlack {
        font-size: 26px; /* adatta per una lettura su dispositivi piccoli */
    }

    .captionBlack-small-filato,
    .captionBlack-small-cura {
        font-size: 14px; /* font leggermente pi� piccolo per mobile */
    }
}

.desktop-tablet-only {
    display: flex;
    flex-direction: row;
    background: #FAFAFA;
    height: 85vh;
    border: 1px solid rgba(0,0,0,0.2);
}

    .desktop-tablet-only .column {
        width: 50%;
        display: flex;
        flex-direction: column;
        padding: 1rem;
    }

.mini-title {
    font-family: 'Futura';
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.caption-sostenibilita .title {
    font-family: 'Futura';
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
    color: #1d1d1d;
    line-height: 100%;
    font-weight:500;
}

.caption-sostenibilita .subtitle {
    font-family: 'Inter';
    font-size: 1rem;
    line-height: 1.4;
    color: #333;
	width: 45vw !important;
    margin: 0;
}

.jumbotron-sostenibilita-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* = jumbotron-sostenibilita 1 = */
.jumbotron-sostenibilita-type1 .column--text {
    justify-content: space-between; /* titolo in alto, caption in basso */
}

.jumbotron-sostenibilita-type1 .caption-sostenibilita {
    text-align: left;
}

.jumbotron-sostenibilita-type1 .column--media {
    justify-content: center;
    align-items: center;
}

/* = jumbotron-sostenibilita 2 = */
.jumbotron-sostenibilita-type2 .column--text {
    justify-content: space-between; /* titolo in alto, caption in basso */
}

.jumbotron-sostenibilita-type2 .caption-sostenibilita {
    align-self: flex-end; /* spinge il blocco caption tutto a destra */
    text-align: left;
}

.jumbotron-sostenibilita-type2 .column--media {
    justify-content: center;
    align-items: center;
}

.caption-cura {
    width: 80%;
    margin-right: 8vw;
}
.bottomMade{
	width: auto !important;
	height: auto !important;
    margin: 2rem !important;
	position: relative !important;
	transform: translateX(0) !important;
	left: 0% !important;
}
.captionMade{
	margin:1rem !important;
}

/* ========== Between 768px and 1280px ========== */
@media (min-width: 769px) and (max-width: 1280px) {
	
	.made-slide img, .made-slide-mag img, .made-slide-sostenibilita img
	{
        width: 100svw;
        height: 50svh;
        object-fit: cover;
        display: block;
    }
    .filato-btn,
    .cura-btn {
        padding: 10px 40px;
    }

    .title-mini {
        font-family: 'Futura';
        font-size: 36px;
        font-weight: 500;
        letter-spacing: -0.05em;
        margin: 3rem;
    }

    .captionBlack-small-cura {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 300;
        font-size: 22px;
        line-height: 130%;
        text-align: left;
        letter-spacing: -0.05em;
        color: #1D1D1D;
    }

    .captionBlack-small {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 300;
        font-size: 22px;
        line-height: 130%;
        text-align: center;
        letter-spacing: -0.05em;
        color: #1D1D1D;
    }

    
    .mobile-paragraph-left {
        width: 90vw;
        margin: 1rem;
        text-align: left;
    }

    .mobile-paragraph-center {
        width: 90vw;
        text-align: center;
    }

    .subtitle-bk {
        font-size: 36px;
    }

    .captionBlack {
        font-family: Times Now;
        font-weight: 400;
        font-size: 40px;
        line-height: 86%;
        letter-spacing: -0.05em;
        text-align: center;
    }

    .captionBlack-alt {
        font-family: Inter;
        font-size: 20px;
    }
    /* MadeInItaly.css */
    .made-slider-images {
        grid-template-columns: repeat(2, 1fr);
    }

    /* MaterialieCura.css */
    .card-title {
        font-size: 1.5rem;
    }

    .card-content {
        font-size: 1rem;
    }

    /* sostenibilita.css */
    .sustainability-steps {
        flex-direction: row;
        gap: 2rem;
    }

    /* StoriaStyle.css */
    .timeline {
        display: flex;
        overflow-x: auto;
    }
}

/* ========== Larger screens: min-width: 769px ========== */
@media (min-width: 769px) {
    /* style.css */
    .button-container {
        flex-direction: row;
        gap: 1rem;
    }

    .action-card {
        width: 45%;
    }
}

/* ========== Desktop: min-width: 1280px ========== */
@media (min-width: 1024px) {
	
	    .mini-shopping-cart .picture img {
			height:auto !important;
            width:100%;

		}
		
	.mini-shopping-cart .quantity {
    display: inline-block;
    font-size: 14px;
    font-style: normal !important;
    font-family: 'Inter' !important;
}
	.mini-shopping-cart-item-close {
    position: absolute;
    top: 17px;
    left: 0;
    width: 17px;
    height: 17px;
    border: none !important;
    font-size: 1rem;
    background:none !important;
	font-family: 'Inter';
}
    /* MadeInItaly.css, MaterialieCura.css, sostenibilita.css */
    .mobile-only {
        display: none;
    }

    /* StoriaStyle.css */
    .mobile-carousel,
    .mobile-media {
        display: none;
    }
}

/* --- Nuove classi minime per la sezione step --- */
.step-section{
	width: 100vw;
	height: auto;
	overflow: visible;
}
.steps-grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(260px, 1fr));
  gap: 12px;

  /* larghezza contenuta + centratura del blocco */
  /*width: min(1120px, 92vw);          /* 4×260 + 3×24 ≈ 1112px */
  margin-inline: auto;
  justify-content: center;           /* centra le tracce quando sono meno */
  text-align: left;
}

.step-card {
    background: #eaeaea;
    min-height: 300px;
    min-width: 300px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 24px;
    position: relative;
}

.step-card-contact {
    background: rgba(249, 246, 246, 1) !important;
    min-height: 300px;
    min-width: 300px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 24px;
    position: relative;
}
/* — Tablet: 2 colonne, sempre centrato — */
@media (max-width: 1024px){
  .steps-grid{
    grid-template-columns: repeat(2, minmax(300px, 1fr));
  }
}

/* — Mobile: impila 1 colonna — */
@media (max-width: 560px){
  .steps-grid{
    grid-template-columns: 1fr;
  }
  .step-card{
    min-width: 0;                    /* evita overflow su schermi stretti */
  }
}

.step-number {
	font-family: 'Futura', sans-serif;
	font-weight: 500;
	font-size: clamp(28px, 4.8vw, 64px);
	line-height: 1;
	color: #1d1d1d;
}

.step-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 12px 0 8px 0;
}

.note-grid{
    display:grid;
    grid-template-columns:auto 1fr;
    gap: clamp(16px, 3vw, 40px);
    align-items:start;
    width:80vw;          /* coerente con le altre sezioni */
    margin:0 auto;
    /*padding: clamp(24px, 6vw, 72px) 0;*/
  }
  .note-title{
    margin:0;
    font-weight:700;
    font-size: clamp(16px, 12vw, 24px);
	font-family:'Futura';
	font-style:normal;
    line-height:1;
    color:#1d1d1d;
	text-align:left;
  }
  .note-body{
    max-width: 80svw;
	text-align: left !important;
    color:#1d1d1d;
	font-family:'Inter';
	font-style:normal;
    font-size: clamp(12px, 1.8vw, 18px);
  }
  .note-body p{
    margin: 0 0 clamp(12px, 6vw, 18px) 0;   /* spazi ampi tra i blocchi */
  }

	.step-icon img {
		width: 25svw;
		height: auto;
	}

.step-copy p {
	margin: 0;
}

/* Responsiveness */

 .jumbo-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    min-height:80vh;
  }
  .measure-col{
    display:grid;
    grid-template-rows:1fr auto;      /* area centrale + footer */
    grid-template-columns:1fr 1fr;    /* footer: sx e dx */
    padding:6vw 2vw;
    background:#FAFAFA;
    overflow:hidden;
  }
  
  /* --- Responsive: in mobile le due colonne vanno in stack --- */
@media (max-width: 1024px){
  .jumbo-grid{
    grid-template-columns: 1fr;   /* da 2 colonne → 1 colonna */
  }

  /* Se nel desktop usi un divisorio verticale tra le colonne,
     qui lo trasformi in una riga orizzontale tra i blocchi (opzionale) */
  .measure-col + .measure-col{
    border-left: 0;
    border-top: 1px solid rgba(0,0,0,.2);
  }
}

  .measure-col + .measure-col{ border-left:1px solid rgba(0,0,0,.2); }

  /* Numero gigante di sfondo (nessun absolute) */
  .bg-number {
    grid-row: 1 / 2;
    grid-column: 1 / 3;
    justify-self: start;
    align-self: start;
    font-weight: 700;
    font-size: clamp(120px, 28vw, 320px);
    line-height: 1;
    font-style: normal;
    font-family: 'Futura';
    color: #1d1d1d;
    z-index: 0;
    pointer-events: none;
    user-select: none;
}

  /* Immagine centrale */
  .item-figure{
    grid-row:2/2; grid-column:1/3;
    justify-self:center; align-self:center;
    width:min(70%,520px); height:auto; z-index:1;
  }

  /* Chip in basso a sinistra */
  .spec-chip {
    grid-row: 3 / 3;
    grid-column: 1 / 2;
    justify-self: start;
    align-self: end;
    padding: 8px 12px;
    font-size: 12px;
    line-height: 1;
    text-transform: uppercase;
    background: #FAFAFA;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 4px;
    z-index: 1;
	font-family:'Futura';
	color:#1d1d1d;
}

  /* Misura grande in basso a destra (richiesta) */
  .measure-lg{
    grid-row:3/3; grid-column:2/2;  /* equivalente a 2/3 */
    justify-self:end; align-self:end;
    font-weight:600;
	font-family:'Futura';
    font-size:clamp(18px,2.6vw,36px);
    letter-spacing:-.02em; color:#1d1d1d;
    z-index:1;
  }

  @media (max-width:1025px){
    .jumbo-grid{ grid-template-columns:1fr; }
    .measure-col + .measure-col{
      border-left:0; border-top:1px solid rgba(0,0,0,.2);
    }
    .item-figure{ width:min(78%,480px); }

    .item-box .product-title {
        overflow: hidden;
        text-align: left;
        width: auto;
    }
    .item-box .add-info {
        width: 40vw;
        text-align:right;
    }
    .product-title a {
        font-size: 0.85rem;
    }
  }
  /* ===== Pagina Contatti (scope locale) ===== */
[data-page="contatti"] .section-4 .steps-grid{
  /* 3 colonne più larghe in desktop */
  grid-template-columns: repeat(3, minmax(320px, 1fr));
  gap: 32px;
  width: 80vw;
  margin-inline: auto;
}

/* Tile più ampi per questa pagina */
[data-page="contatti"] .section-4 .step-card{
  min-width: 320px;
  min-height: 320px;
  padding: 28px;
}

[data-page="contatti"] .section-4 .step-copy{
  font-family:'Futura';
  font-style:normal;
  color:#1D1D1D;
  font-weight:500;
}
[data-page="contatti"] .section-4 .step-copy-alt{
  font-family:'Futura';
  font-style:normal;
  font-weight:500;
  color:rgba(29, 29, 29, 0.5);

}

/* Titolo della card più piccolo (qui è .step-number) */
[data-page="contatti"] .section-4 .step-number{
  font-size: 40px;
  font-weight: 500;
  font-style:normal;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

/* Tablet: 2 colonne */
@media (max-width: 1024px){
  [data-page="contatti"] .section-4 .steps-grid{
    grid-template-columns: repeat(2, minmax(300px, 1fr));
  }
}

/* Mobile: 1 colonna e no overflow */
@media (max-width: 600px){
  [data-page="contatti"] .section-4 .steps-grid{
    grid-template-columns: 1fr;
    gap: 24px;
  }
  [data-page="contatti"] .section-4 .step-card{ min-width: 0; }
}

/* ====== HERO “Lavora con noi” (classi locali) ====== */
.gs-hero{
  display:grid;                 /* overlay sopra immagine */
  grid-template: 1fr / 1fr;
  height: 70vh;
  width: 100vw;
}

.gs-hero__img{
  grid-area: 1 / 1;
  width: 100%;
  height: 70vh;
  object-fit: cover;            /* copre tutto il box */
  display: block;
}

.gs-hero__overlay{
  grid-area: 1 / 1;             /* si sovrappone all’immagine */
  z-index: 1;
  display: flex;
  align-items: flex-start;       /* TOP (desktop) */
  justify-content: flex-start;   /* LEFT (desktop) */
}

.gs-hero__content{
  margin: clamp(24px, 5vw, 56px);               /* distanza dai bordi */
  max-width: min(540px, 45vw);                  /* blocco leggibile */
  display: flex;
  flex-direction: column;
  font-family:'Futura';
  font-style:normal;
  gap: 16px;
  color: #fafafa;                                  /* testo bianco come negli screenshot */
  text-align: left;
}

.gs-hero__title {
    margin: 0;
    font-weight: 500;
    letter-spacing: .02em;
    font-family: 'Futura';
    font-style: normal;
    text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.7);
    /* grande in desktop */
}

.gs-hero__text{
  margin: 0;
  line-height: 1.45;
  font-family:'Futura';
  font-style:normal;
  font-size: clamp(14px, 1.1vw, 18px);
  max-width: 60ch;
}

.gs-hero__btn{
  align-self: flex-start;                       /* sinistra in desktop */
  display: inline-block;
  padding: 16px 32px !important;
  background: #1d1d1d !important;
  font-family:'Futura'!important;
  font-size:16px;
  font-style:normal;
  text-transform:uppercase;
  color: #fafafa !important;
  text-decoration: none;
  font-weight: 500 !important;
  letter-spacing: -0.03em;
}
.gs-contact-form{
	background:rgba(255, 255, 255, 0) !important;
	width:50vw;
	height:50vh;
	margin: 0 auto 0px !important;
	padding:0 !important;
	
}
.gs-contact-input{font-family:Inter}

.contact-page form:before{
	display:none;
}

.required{
	display:none;
}
/* ====== Mobile: contenuto centrato, testo left, bottone centrato ====== */
@media (max-width: 1024px){
	.desktop-only {
        display: none !important;
    }

  .gs-hero{ min-height: 75vh; }

  .gs-hero__overlay{
    align-items: center;                        /* verticale centrato */
    justify-content: center;                    /* orizzontale centrato */
  }

  .gs-hero__content{
    margin: 0;
    padding: 24px;
    display:inline
    width: min(90vw, 340px);                    /* blocco stretto come nello screenshot */
    max-width: 90vw;
  }

  .gs-hero__title{ font-size: 2rem; }
  .gs-hero__text{ font-size: 14px; }
  .gs-hero__btn{ align-self: center; }         /* bottone centrato */
  
.gs-contact-form{
	background:rgba(255, 255, 255, 0) !important;
	width:75vw;
	height:50vh;
	
}
.gs-contact-input{font-family:Inter}

.contact-page form:before{
	display:none;
}

.required{
	display:none;
}
}

/* ==== FIX centratura captionBlack / captionBlack-alt ====
   Override della regola globale .category-description p
   che forza width:810px e margin-left:20px !important
   ----------------------------------------------------- */

.category-description .caption-container > p.captionBlack,
.category-description .caption-container > p.captionBlack-alt,
.category-description .caption-mini-container > p.captionBlack-small {
  width: auto !important;                 /* rimuove larghezza fissa */
  max-width: min(80vw, 1100px) !important;/* leggibilità responsive */
  margin: 0 auto 1.25rem !important;      /* centratura reale */
  text-align: center !important;
}

/* Copertura nel caso il <p> non sia figlio diretto */
.category-description .caption-container p.captionBlack,
.category-description .caption-container p.captionBlack-alt,
.category-description .caption-mini-container p.captionBlack-small {
  width: auto !important;
  max-width: min(80vw, 1100px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Centra eventuali elementi non-paragrafo all'interno dei contenitori */
.category-description .caption-container,
.category-description .caption-mini-container {
  display: grid;
  place-items: center;
}
.category-description .captionBlack-small-filato,
.category-description .captionBlack-small-cura{
	width: 45vw !important
}
/* Desktop largo */
@media (min-width: 1280px){
  .category-description .caption-container > p.captionBlack-alt{
    max-width: 1200px !important;
  }
}

/* Mobile */
@media (max-width: 1024px){
  .category-description .caption-container > p.captionBlack,
  .category-description .caption-container > p.captionBlack-alt{
    max-width: 90vw !important;
    margin: 0 auto 1rem !important;
  }
}

/* ==== fine FIX centratura caption ==== */
/* ==== FIX margine titolo–caption (Accademia) ==== */

/* Titolo immediatamente seguito da una caption: forza gap a 1rem */
.section-4 h2 + p.captionBlack,
.section-4 h2 + p.captionBlack-alt,
.section-4 h3 + p.captionBlack,
.section-4 h3 + p.captionBlack-alt,
.section-4 h4 + p.captionBlack,
.section-4 h4 + p.captionBlack-alt,
.jumbotron h2 + p.captionBlack-alt,
.jumbotron h3 + p.captionBlack-alt,
.caption-container h2 + p.captionBlack-alt,
.caption-container h3 + p.captionBlack-alt,
.caption-container h4 + p.captionBlack-alt {
  margin-top: 1rem !important;   /* distanza uniforme titolo→caption */
  width:80vw !important;
}

/* Se in qualche blocco il titolo è h5 */
.jumbotron h5 + p.captionBlack-alt,
.caption-container h5 + p.captionBlack-alt {
  margin-top: 1rem !important;
}

/* Variante per i titoli “subtitle-bk” che precedono una caption */
.section-4 .subtitle-bk + p.captionBlack-alt,
.section-4 .subtitle-bk + p.captionBlack,
.jumbotron .subtitle-bk + p.captionBlack-alt {
  margin-top: 1rem !important;
}

/* Mobile: stesso valore per coerenza */
@media (max-width: 1024px){
  .section-4 h2 + p.captionBlack,
  .section-4 h2 + p.captionBlack-alt,
  .section-4 h3 + p.captionBlack,
  .section-4 h3 + p.captionBlack-alt {
    margin-top: 1rem !important;
  }
}
/* ==== fine FIX margine titolo–caption ==== */

/* === Slider MAG: layout footer con label sopra la progress bar === */

/* Footer in griglia: 2 colonne (indice | barra) e 2 righe (label sopra, indice+barra sotto) */
.made-slider-section-container-mag .made-slider-footer{
  display: grid !important;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: .75rem;
}

/* Label centrata e a tutta larghezza nella riga 1 */
.made-slider-section-container-mag .made-slider-live-label{
  grid-column: 1 / -1;      /* span su entrambe le colonne */
  grid-row: 1;
  text-align: center;
  margin: 0 0 .35rem 0;     /* “appena sopra” la barra */
}

/* Riga 2: indice a sinistra, progress bar a destra */
.made-slider-section-container-mag .made-slide-index{
  grid-column: 1;
  grid-row: 2;
  text-align: left !important;
}

.made-slider-section-container-mag .made-slider-progress{
  grid-column: 2;
  grid-row: 2;
  width: 100%;
  max-width: none;          /* lascia occupare tutto lo spazio di colonna */
}

@media(max-width:769px){
    .wishlist-content .buttons {
        margin: 32px 0px 16px;
        text-align: center;
        justify-content: center;
        align-items: center;
        display: grid;
    }
    .wishlist-content .button-1 {
        margin:8px;
    }
    
    .section-hero {
        position: relative;
        margin-bottom: 50px;
        height: 30svh; /* << ALTEZZA SCHERMO INTERO >> */
        width: 100%; /* Larghezza piena */
        overflow: hidden; /* Nasconde ci� che potrebbe strabordare */
    }

    .overview .prices {
        margin: 10px 0;
        /* 	overflow: hidden; */
        display: flex;
        font-family: Futura;
        font-weight: 500;
        font-size: 2rem;
        line-height: 86%;
        letter-spacing: -1px;
    }
    .overview .old-product-price {
        margin: 0rem 1rem 0 0rem;
    }

    .quicktabs-accordion {
        max-width: 95%;
    }

    #quickTabs .full-description {
        margin: 1rem;
        background: #fefefe;
        color: #1d1d1d;
        font-family: Inter;
        font-weight: 400;
        font-size: 16px;
        font-style:normal !important;
        line-height: 112.00000000000001%;
        letter-spacing: 0;
        text-align: left;
        max-width: 92%;
        padding-left:1rem;
        padding-bottom:1rem;
    }

    .write-review .rating-wrapper > div {
        display: inline-block;
        margin: 0 5px;
        cursor: default;
        vertical-align: middle;
        height: 17px;
        color: #909090;
        font: 15px / 25px 'Inter', serif;
        font-style: normal;
    }
    
}

    /* Mobile: un filo più compatto */
    @media (max-width: 1024px) {
        .section-hero {
            position: relative;
            margin-bottom: 50px;
            height: 50svh; /* << ALTEZZA SCHERMO INTERO >> */
            width: 100%; /* Larghezza piena */
            overflow: hidden; /* Nasconde ci� che potrebbe strabordare */
        }



        .made-slider-section-container-mag .made-slider-footer {
            column-gap: .5rem;
        }

        .made-slider-section-container-mag .made-slider-live-label {
            margin-bottom: .3rem;
            display: block;
            text-align: left;
            margin: 0rem;
            font-size: 2rem;
            line-height: 1.25;
            font-family: 'Futura';
            font-weight: 500;
            background-color: transparent;
            color: #fafafa;
        }
    }
    /* Label sopra il footer: elemento indipendente */
    .made-slider-section-container-mag .made-slider-live-label {
    display: block;
    text-align: left;
    margin: 0;
    font-size: 2rem;
    line-height: 1.25;
    font-family: 'Futura';
    font-weight: 500;
    background-color: transparent;
    color: #fafafa;
}
/* overlay label per lo slider MAG */
.made-slider-images-mag{
  position: relative;            /* serve per posizionare l’overlay */
}

.made-slider-live-label{
  position: absolute;
  left: 50%;
  bottom: 0.75rem;               /* bordo basso dell’immagine */
  transform: translateX(-50%);
  z-index: 3;                    /* sopra l’immagine e overlay */
  pointer-events: none;

  /* tipografia: allineata allo stile label esistente */
  font-family: 'Futura', sans-serif;
  font-style: normal !important;
  font-size: 2.2rem;
  line-height: 1;
  color: #fff;
  text-align: center;
  text-shadow: 1px 1px 3px rgba(0,0,0,.55);
}

/* nascondi le label per-slide se non le vuoi duplicate */
.made-slide-label-mag{ display: none !important; }
.made-slider-live-label{
  left: 20px; transform:none; text-align:left;
}
/* === Centra bene la mini-caption dentro caption-mini-container === */

.category-description .caption-mini-container{
  display: grid;              /* più solido del flex per centrare un singolo child */
  place-items: center;        /* orizzontale + verticale */
  text-align: center;         /* fallback per eventuali altri nodi */
}

.category-description .caption-mini-container > p.captionBlack-small,
.category-description .caption-mini-container p.captionBlack-small{
  width: auto !important;                         /* via 810px fissi */
  max-width: min(92vw, 1000px) !important;        /* leggibilità */
  margin-left: auto !important;                   /* centratura reale */
  margin-right: auto !important;                  /* centratura reale */
  /* preserva i tuoi spazi verticali mt-12 / mb-12 (~3rem) */
  margin-top: 3rem !important;
  margin-bottom: 3rem !important;
  text-align: center !important;
}
/* === FIX per testi della sezione "mobile-paragraph-center" === */

.category-description .mobile-paragraph-center .caption-container p{
  width: auto !important;                      /* rimuove i 810px */
  max-width: min(92vw, 1000px) !important;      /* limita la lunghezza su schermi larghi */
  margin-left: auto !important;                 /* centratura orizzontale */
  margin-right: auto !important;                /* centratura orizzontale */
  text-align: center !important;                /* centra il testo all’interno */
}

/* opzionale: se vuoi che tutti i <p> in questo blocco abbiano stessa resa */
.category-description .mobile-paragraph-center .caption-container{
  display: grid;                /* grid = centratura più robusta */
  place-items: center;
  text-align: center;
}
/* Griglia 4 colonne desktop, 1 su mobile */
.rich-blog-grid {
    display: grid;
    grid-template-columns: repeat(4, 2fr);
    row-gap: 15svh;
    column-gap: 1.5rem;
    margin: 20svh 1.5rem 2rem 1.5rem;
}

*

/* Card */
.blog-card {
  display: flex;
  flex-direction: column;
  background: #fff;              /* o trasparente se preferisci */
  overflow: hidden;

}

/* Contenitore immagine con rapporto fisso (uniforma le altezze) */
.blog-card .thumb {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;          /* cambia in 4/3 o 1/1 se preferisci */
  background: #f2f2f2;
  overflow: hidden;
}

/* Immagine */
.blog-card .thumb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;              /* taglia e uniforma */
  display: block;
}

/* Corpo card */
.blog-card .card-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px 16px 16px;
}

/* Titolo */
.blog-card .post-title {
  font-weight: 500;
  line-height: 1.25;
  font-size: 1rem;
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;         /* tronca a 2 righe */
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0px !important;
  padding-left:1%;
  padding-right:1%;
}

/* Data */
.blog-card .post-date {
  font-size: 0.85rem;
  font-family: 'Inter';
  font-style:normal;
  opacity: 0.7;
  padding-right: 0.8rem;
}

/* CTA */
.blog-card .read-more {
  margin-top: 6px;
  font-weight: 500;
  text-decoration: none;
}

/* Responsive */
@media (max-width: 1024px) {
  .rich-blog-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
}

@media (max-width: 600px) {
  .rich-blog-grid {
    grid-template-columns: 1fr; /* 1 per riga su mobile */
  }
}
.blog-card .card-body {
  padding: 16px 0 0; /* nessun box bianco, stile più pulito */
}

.card-header-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-top: 12px;
}

.post-title {
  font-weight: 500;
  font-size: 1.1rem;
  color: #000;
  text-decoration: none;
  flex: 1;
}
.rich-blog-image img {
    width: 100svw;
	max-height: 100svh;
	object-fit: contain;
    margin:1rem 0;
}
.post-date {
  font-family:'Inter';
  font-size: 0.9rem;
  color: #666;
  white-space: nowrap;
  font-style:normal;
  margin-right: 1rem;
}
/* Forza sempre visibile il titolo del blog post */
.html-blogpost-page .page-title.blog-title.post-head,
.html-blogpost-page .page-title.blog-title.post-head .post-head__title {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 65svw;
    margin: auto;
    line-height:115%;
    padding:1rem 0;
}

.post-head{
  display: flex;
  align-items: baseline;      /* allinea bene testo h1 e data */
  flex-wrap: nowrap;
}

/* Titolo: 90% della riga */
.post-head__title{
  flex: 0 0 85%;
  margin: 0;                  /* evita spazi verticali extra dell'h1 */
  min-width: 0;               /* necessario per ellipsis in flex */
}

/* Spazio “5%” tra titolo e data */
.post-head{
  column-gap: 10%;
}

/* Data: resta a destra e non va a capo */
.post-head__date{
  flex: 1 1 auto;             /* prende il resto disponibile */
  text-align: right;
  white-space: nowrap;
}


/* Bottone stile Zara */
.post-button {
  display: inline-block;
  margin-top: 14px;
  padding: 6px 14px;
  border: 1px solid #000;
  font-size: 0.8rem;
  font-weight: 500;
  text-transform: uppercase;
  color: #000;
  text-decoration: none;
  transition: background .2s, color .2s;
}

.post-button:hover {
  background: #000;
  color: #fff;
}

#result{
	font-family:Inter;
	font-size:clamp(18px, 8.4vw, 24px);
	color:#1d1d1d;
	font-style:normal;
}

/* =========================
   LAYOUT (solo desktop)
   ========================= */
@media (min-width: 1024px) {

    .uptown-one-column-ajax-filters-wrapper{
        margin:0 !important;
        position:relative;
    }


    .page.category-page .page-body .catalog-layout {
        display: grid;
        grid-template-columns: 1fr; /* chiuso */
        gap: 24px;
        align-items: stretch; /* IMPORTANT: fa “stirare” la sidebar all’altezza della colonna prodotti */
    }

    .page.category-page .page-body.filters-open .catalog-layout {
        grid-template-columns: minmax(280px, 25vw) minmax(0, 1fr);
    }

    .page.category-page .page-body .filters-sidebar {
        align-self: stretch;
        background: #fff;
        display: flex;
        flex-direction: column;
        min-width: 0;
    }

    .page.category-page .page-body .catalog-main {
        min-width: 0; /* evita overflow */
    }

    /* =========================
     TOGGLE: chiuso = solo pulsante
     ========================= */
    .page.category-page .page-body:not(.filters-open) .filters-sidebar .filtersPanel {
        display: none !important; /* sovrascrive inline display:block del plugin */
    }

    .page.category-page .page-body:not(.filters-open) .filters-sidebar .close-filters {
        display: none !important;
    }

    .page.category-page .page-body:not(.filters-open) .filters-sidebar .clearFilterOptionsAll {
        display: none !important;
    }


        .nopAjaxFilters7Spikes .filtersTitlePanel .filtersTitle {
            font-weight: 500;
            color: #fafafa;
        }

    /* =========================
     PANNELLO FILTRI: piena altezza colonna
     ========================= */
    .nopAjaxFilters7Spikes .filtersPanel {
        background: #fff !important;
        width: auto !important; /* la larghezza la gestisce la colonna grid */
        margin: 1rem 0 !important;
        padding: 16px !important;
        position: static !important;
        flex: 1 1 auto; /* riempie verticalmente la sidebar */
        box-sizing: border-box;
    }
    .uptown-one-column-ajax-filters-wrapper .filter-block{
        margin:0 !important;
    }
    /* Togliamo il pseudo-elemento che spesso rompe altezze/overlay */
    .nopAjaxFilters7Spikes .filtersPanel:before {
        content: none !important;
        display: none !important;
    }

    .nopAjaxFilters7Spikes .filter-block {
        width: 25vw !important;
        padding: 1rem!important;
        float: none !important;
    }

    .nopAjaxFilters7Spikes .priceRangeMinMaxPanel,
    .nopAjaxFilters7Spikes .specification-min-max-panel {
        overflow: hidden;
        margin: 0 0 14px;
        padding: 7.5px 10px;
        color: #1d1d1d;
        font-size: 13px;
        font-style: normal;
        font-family: 'Futura', serif;
        font-weight: 500;
        background: #fff;
    }

    .nopAjaxFilters7Spikes .filter-block .title {
        position: relative;
        margin: 0;
        padding: 0;
        background: none;
        border: 0;
        font-weight: 500;
    }

    .nopAjaxFilters7Spikes .filtersGroupPanel li > label {
        display: block;
        position: relative;
        padding: 7px 10px 7px 38px;
        text-align: left;
        color: #1d1d1d !important;
        font-size: 13px;
        font-weight: 500;
    }

    .nopAjaxFilters7Spikes .filter-block a.toggleControl {
        padding: 7px 0;
        margin: 0 0 14px;
        border-bottom: 2px solid #f1f1f1 !important;
    }

    /* =========================
     GRIGLIA PRODOTTI: 4 -> 3 quando filtri aperti
     ========================= */
    .page.category-page .product-grid .item-grid,
	.page.product-details-page .product-grid .item-grid,
.page.search-page .product-grid .item-grid	{
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 18px;
    }

    .page.category-page .page-body.filters-open .product-grid .item-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    /* neutralizza vecchie width/float */
    .page.category-page .product-grid .item-grid > .item-box {
        width: auto !important;
        float: none !important;
    }
}

.nopAjaxFilters7Spikes #attributeFiltersDropDown7 .checkbox-list > li.checkbox-item input[type="checkbox"] {
    opacity:100 !important;
}
/* Responsive (fuori dal layout desktop) */
@media (max-width: 1023px) {
    .page.category-page .product-grid .item-grid,
	.page.product-details-page .product-grid .item-grid,
.page.search-page .product-grid .item-grid  {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }
}

@media (max-width: 520px) {
    .page.category-page .product-grid .item-grid,
	.page.product-details-page .product-grid .item-grid,
.page.search-page .product-grid .item-grid  {
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
}



@media(max-width:1024px)
{
	.mobile-menu {
        display: inline-block;
        color: #1d1d1d;
        vertical-align: middle;
        margin-right: 0rem;
        font-size: 1rem;
        padding: 1rem;
    }
	.filtersPanel {
			background: #ffffff !important;
			width: 80vw;
			position: relative !important;
			padding: 1vw !important;
			margin: 20px 0px !important;
		}

	.filtersPanel:before {
			display: block;
			position: absolute;
			top: 0;
			left: -100%;
			right: -100%;
			bottom: 0;
			background: #ffffff !important;
			width: 100vw !important;
			height: 100vh !important;
		}
	.filter-block {
			width: 80vw;
			margin: 0 0 0% 0% !important;
			float: left !important;
		}
	.priceRangeMinMaxPanel, .specification-min-max-panel {
		overflow: hidden;
		margin: 0 0 20px;
		padding: 7.5px 10px;
		color: #1d1d1d;
		font-size: 13px;
		font-style: normal;
		font-family: 'Futura', serif;
		font-weight:600;
		background: #ffffff;
	}
    .clearFilterOptionsAllProxy {
        display: inline-block;
        margin-bottom: 8px;
        text-decoration: underline;
        cursor: pointer;
        font-size: 16px;
        text-align: left;
    }

    .filter-block .title {
        position: relative;
        margin: 0;
        padding: 1rem;
        background: none;
        border: 0;
        font-weight: 500;
    }
	.filtersGroupPanel li>label {
		display: block;
		position: relative;
		padding: 7px 10px 7px 2.75rem;
		text-align: left;
		color: #1d1d1d !important;
		font-size: 13px;
		font-weight:500;
	}

	.filter-block a.toggleControl {
		padding: 7px 0;
		margin: 0 0 20px;
		border-bottom: 2px solid #f1f1f1 !important;
	}
	
	.nopAjaxFilters7Spikes {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1070;
        width: 85vw;
        height: 100%;
        overflow: hidden;
        background: #fff;
        -webkit-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
        -webkit-transform: translate(-100vw);
        -ms-transform: translate(-100vw);
        transform: translate(-100vw);
    }

}

.topic-page .page-body .topic-left
 {
    background: #ffffff;
    text-align: left !important;
    color: #1d1d1d;
    font: 15px / 25px 'Inter', serif;
    font-style: normal;
}

.mini-shopping-cart .count a {
    float: right;
    font-size: 14px;
    font-style: normal;
    font-family: 'Inter', serif;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
	
}
.mini-shopping-cart .count {
    border:0px !important;
	
}
.mini-shopping-cart-title {
    float: left;
    color: #1d1d1d;
    font-size: 15px;
	font-family:'Futura';
	font-weight:500;
    text-transform: uppercase;
}
.small-media       { width:30svw; aspect-ratio:3/4; height:auto; object-fit: contain; }
.mobile-media      { width:min(90vw,560px); aspect-ratio:3/4; height:auto; }
.carousel-slide>img{ width:100%; aspect-ratio:4/3; height:auto; object-fit:cover; }
.horizontal-slider .slide{ aspect-ratio:16/9; } /* coerente con le foto */
/* ================== MGS — CLS HARDENING PATCH ================== */

/* 0) Unità viewport stabili su mobile (evita salti con barra URL) */
@supports (height: 100svh) {
  .hero{
    min-height: 80svh; /* al posto di 100vh */
  }
}
.action-button-light:hover{
    background-color:#1d1d1d;
}
/* 1) Riserva spazio a header sticky (niente “rimbalzo” quando si fissa) */
:root {
    --header-h: 72px;
} /* metti la tua altezza reale */
.header, .master-header { min-height: var(--header-h); }
body.has-sticky-header { padding-top: var(--header-h); } 
/* In JS/razor aggiungi <body class="has-sticky-header"> se l’header diventa sticky */

/* 2) Slider/Hero e picture box con rapporto fisso (spazio riservato prima del load) */
.made-slider-section-container,
.made-slide, .made-slide-mag, .made-slide-sostenibilita {
  aspect-ratio: 16 / 9;
}
@media (max-width: 769px){
   .section-hero {
		position: relative !important;
		margin-bottom: 50px;
		height: 30svh;
		width: 100%;
		overflow: hidden;
		min-height:30svh !important;
	}
	.hero-img{
		aspect-ratio:4/3 !important;
	}
  .made-slider-section-container,
  .made-slide, .made-slide-mag, .made-slide-sostenibilita {
	  aspect-ratio: 16 / 9;
	}
  .made-slide img, .made-slide-mag img, .made-slide-sostenibilita img {
	  width: 100svw;
	  height: 50svh;
	  object-fit: cover;
	  display: block;
	}
}
@media (min-width:1025px){
	.made-slide img, 
	.made-slide-mag img{
	  width: 100svw;
	  height:100svh; 
	  object-fit: cover; 
	  display: block;
	}
}
.made-slide-sostenibilita img {
  width: 100svw;
  height:auto; 
  object-fit: cover; 
  display: block;
}
.product-grid .item-box .picture,
.related-products-grid .item-box .picture,
.cross-sells .item-box .picture {
  aspect-ratio: 4 / 5; 
  overflow: hidden;
}
/* .product-grid .item-box .picture img,
.related-products-grid .item-box .picture img,
.cross-sells .item-box .picture img {
  width: 100%; height: 100%; object-fit: cover; display: block;
} */

/* 4) Cookie bar / alert che appare in-page: riserva spazio quando visibile */
:root { --cookie-h: 64px; } /* altezza stimata barra cookie */
@supports selector(:has(*)) {
  body:has(.cookie-bar.is-visible) { padding-bottom: var(--cookie-h); }
  .cookie-bar { position: fixed; left:0; right:0; bottom:0; }
}

/* 5) Evita shift da focus/hover: niente cambi di bordo che spingono layout */
/* button, .button, .btn, a.button-active, .selector .option {
  border: 1px solid transparent;
} */

/* 6) Blocchi sotto la piega: misura “pigra” ma con dimensione intrinseca */
.section-lazy, .home-widget-lazy, .footer-widgets {
  content-visibility: auto;
  contain-intrinsic-size: 900px; /* stima: evita salti quando si materializza */
}

/* 7) Icon font / testi sovrapposti: niente overlay che sposta al paint */
.content-overlay { pointer-events: none; }
.bi, .icon, [class^="bi-"], [class*=" bi-"] { line-height: 1; }

/* 8) (dal giro precedente) descrizioni a 100% e non 100vw: no scrollbar = no CLS */
.category-description, .manufacturer-description, .vendor-description { width: 100% !important; }

.sticky-parent,
.horizontal-slider,
.mobile-carousel {
  overflow-anchor: none;
}
/* il contenitore sticky e lo slider non contaminano il resto */
.sticky-parent,
.sticky-container,
.horizontal-slider { contain: layout paint; }

/* le slide fuori viewport non vengono renderizzate */
.horizontal-slider .slide {
  content-visibility: auto;
  contain-intrinsic-size: 800px 550px; /* stima: metti la tua misura media */
}


/* 
#main-header, .header-lower, .header-selectors-wrapper,
.header-links-wrapper, .store-search-box {
  contain: layout paint;        
  overflow-anchor: none;        
}

#main-header.header-lower.sticky { min-height: 72px; }

.store-search-box input[type="text"]{
  min-height: 40px;
  transition: box-shadow .2s ease, background-color .2s ease;
}

.store-search-box .ui-autocomplete,
.store-search-box .suggestions {
  position: absolute;
  inset-block-start: 100%;
  inset-inline-start: 0;
  z-index: 40;
  max-height: 60svh;
  overflow:auto;
  content-visibility:auto;
  contain: layout paint;
  contain-intrinsic-size: 320px 320px; 
}

#topcartlink { display:inline-block; min-width: 3.8ch; text-align: right; }
#topcartlink .cart-qty, a.ico-cart, .cart-count { font-variant-numeric: tabular-nums; }

#flyout-cart.cart-wrapper {
  position: fixed;
  top: 72px; right: 16px;
  max-width: min(420px, 92vw);
  transform: translateY(-6px);
  opacity: 0;
  pointer-events: none;
  will-change: transform, opacity;
  contain: layout paint;
}
#flyout-cart.cart-wrapper.is-open {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
} */

/* === FIX PERFORMANCE: CSS Containment === */

/* Isolamento sticky slider (previene reflow su tutto il document) */
.sticky-parent,
.sticky-container,
.horizontal-slider {
  contain: layout paint; /* isola calcoli layout */
  overflow-anchor: none; /* disabilita scroll anchoring che causa shift */
}

/* Slide fuori viewport non renderizzate (enorme boost) */
.horizontal-slider .slide {
  content-visibility: auto; /* lazy render */
  contain-intrinsic-size: 1600px 900px; /* dimensione stimata per riservare spazio */
}

/* Mobile carousel */
.mobile-carousel,
.carousel {
  contain: layout paint;
  overflow-anchor: none;
}

/* Isolamento sezioni generiche */
.section-2,
.section-4,
.jumbotron {
  contain: layout style; /* isola stili e layout */
}

/* === FIX CLS: Aspect Ratio Riservato === */

/* Hero images */
.section-hero .hero-img,
.hero-section {
  aspect-ratio: 16 / 9;
  min-height: 0; /* evita conflitti con height: 100vh */
}

/* Slider desktop */
.horizontal-slider .slide {
  aspect-ratio: 16 / 9;
}

.horizontal-slider .slide .media {
  aspect-ratio: inherit; /* eredita dal genitore */
}

/* Carousel mobile */
.carousel-slide {
  aspect-ratio: 4 / 3;
}

.carousel-slide > img {
  aspect-ratio: inherit;
  object-fit: cover;
}

/* Small media */
.small-media,
.small-media-desktop {
  aspect-ratio: 3 / 4; /* proporzioni verticali */
}

/* Made slider */
.made-slide,
.made-slide-mag,
.made-slide-sostenibilita {
  aspect-ratio: 16 / 9;
}

@media (max-width: 1024px) {
  .made-slide,
  .made-slide-mag,
  .made-slide-sostenibilita {
    aspect-ratio: 16 / 9;
  }
  
  .made-slider-section-container,
  .made-slider-section-container-aca {
    height: auto !important;
    overflow: visible !important;
	margin-bottom: 1rem;
  }

  /* Le slide non devono forzare 75vh se sotto c'è una caption + footer */
  .made-slide.mobile-only {
    height: auto !important;
  }

  /* Footer in flusso, immediatamente sotto la caption */
  .made-slider-footer {
    position: static !important;
  }
}

/* ============= ANTI-CLS AGGRESSIVO ============= */

/* 1. STICKY PARENT: Altezza pre-calcolata via CSS variable */
.sticky-parent {
  /* height viene settata da JS, ma forziamo un minimo */
  min-height: calc(100vh * var(--slides, 6));
  max-height: calc(100vh * var(--slides, 6));
  height: calc(100vh * var(--slides, 6)); /* FORZA l'altezza */
  will-change: auto; /* NO will-change, causa layer promotion */
}

/* 2. STICKY CONTAINER: Dimensioni FISSE */
.sticky-container {
  position: sticky;
  top: 0;
  height: 100vh;
  min-height: 100vh;
  max-height: 100vh;
  width: 100%;
  overflow: hidden;
  /* Isolamento completo */
  contain: strict; /* invece di layout paint */
  content-visibility: auto;
}

/* 3. HORIZONTAL SLIDER: NO will-change se non in scroll */
.horizontal-slider {
  display: flex;
  height: 100%;
  width: max-content; /* invece di calcolo JS */
  will-change: auto; /* di default OFF */
  transform: translate3d(0, 0, 0); /* força GPU layer */
  backface-visibility: hidden; /* anti-aliasing fix */
}

/* 4. SLIDE: Dimensioni ESPLICITE + Aspect Ratio */
.horizontal-slider .slide {
  flex: 0 0 100vw; /* ESPLICITO: larghezza fissa */
  width: 100vw;
  height: 100vh;
  min-height: 100vh;
  position: relative;
  overflow: hidden;
  
  /* Containment per isolamento */
  contain: layout style paint;
  content-visibility: auto;
  contain-intrinsic-size: 1920px 1080px; /* stima per lazy render */
}

/* 5. MEDIA DENTRO SLIDE: Dimensioni FISSE */
.horizontal-slider .slide .media {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  /* CRITICAL: forza dimensioni per evitare shift */
  min-width: 100%;
  min-height: 100%;
}

/* 6. CAPTION: Posizione ASSOLUTA per non influenzare layout */
.horizontal-slider .slide .captionHistorical {
  position: absolute;
  top: 25%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 75vw;
  /* Isolamento */
  contain: layout style;
  will-change: auto;
}

.captionMade {
    font-family: Times Now;
    font-weight: 300;
    font-size: clamp(1rem, 2.5rem, 4rem);
}

/* === Made in Italy: override mobile solo per #jumbotron-filati === */
@media (max-width: 1024px) {
	
	.media-menu{
		display:none;
	}
	
	.bottomMade{
		margin:1rem !important;
	}
  /* ri-mostra la sezione (sovrascrive .jumbotron e .desktop-only) */
  #jumbotron-madeinitaly {
    display: flex !important;
    flex-direction: column;
    height: auto !important;
    background: #FAFAFA;
  }

  /* colonna immagine full-width sopra */
  #jumbotron-madeinitaly .colonna-sinistra {
    width: 100%;
    min-height: 50vh;
    height:50svh;
    background-size: cover;
    background-position: center;
    border-bottom: 1px solid rgba(0,0,0,0.1);
  }

  /* il distanziatore desktop non serve su mobile */
  #jumbotron-madeinitaly .mi-mt-40vh {
    display: none;
  }

  /* colonna testo sotto, padding comodo e layout verticale */
  #jumbotron-madeinitaly .colonna-destra {
    width: 100%;
    height: auto;
    border-width: 0;
    padding: 1.5rem 1rem 2rem;
    align-items: flex-start;
    justify-content: flex-start;
  }

  #jumbotron-madeinitaly .filato-desc,
  #jumbotron-madeinitaly .filato-prog-btn,
  #jumbotron-madeinitaly .bottomMade {
    margin: 0 0 1rem 0;
  }

 
  #jumbotron-madeinitaly .bottomMade {
    font-size: 1rem;
    line-height: .95;
  }

  #jumbotron-madeinitaly .filato-prog-btn {
    display: flex;
    justify-content: flex-start;
  }
  
  #jumbotron-madeinitaly .colonna-destra{
	height:40svh;
  }
    .captionMade {
        font-family: Times Now;
        font-weight: 300;
        font-size: 2rem;
    }
}
@media(max-width:768px){
    #jumbotron-madeinitaly .colonna-destra {
        height: 60svh;
    }
    .captionMade {
        font-family: Times Now;
        font-weight: 300;
        font-size: clamp(1rem, 2rem, 4rem);
    }
}



/* 10. MOBILE CAROUSEL: Dimensioni FISSE */
.mobile-carousel {
  position: relative;
  width: 100%;
  min-height: 630px; /* FISSO */
  height: auto;
  overflow: hidden;
  contain: layout paint;
}

.carousel-wrapper {
  overflow: hidden;
  contain: layout paint;
}

.carousel {
  display: flex;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1); /* easing custom */
  will-change: auto; /* OFF di default */
}

.carousel-slide {
  flex: 0 0 100%;
  min-width: 100%;
  position: relative;
  aspect-ratio: 4 / 3; /* FISSO */
  contain: layout style paint;
}

.carousel-slide > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 11. MOBILE PROGRESS BAR: Dimensioni FISSE */
.mobile-progress-bar-container {
  position: absolute;
  bottom: 7vh;
  left: 5%;
  width: 90%;
  height: 6px; /* FISSO */
  min-height: 6px;
  background-color: rgba(255, 255, 255, 0.4);
  border-radius: 3px;
  overflow: hidden;
  z-index: 10;
  contain: strict;
}



.year-btn {
  flex: 0 0 auto;
  min-width: 128px; /* FISSO */
  max-width: 256px;
  min-height: 50px;
  max-height:80px;  /* FISSO */
  font-family: 'Futura';
  background-color: #1c1c1c;
  color: white;
  border: 1px solid #fff;
  padding: 10px;
  font-size: 21px;
  margin: 0;
  white-space: nowrap;
  transition: background-color 0.2s ease; /* più veloce */
  /* Isolamento */
  contain: layout style paint;
}



/* 14. SEZIONI GENERICHE: Containment */
.section-hero,
.section-2,
.section-4,
.jumbotron {
  contain: layout style;
  content-visibility: auto;
}

/* 15. HERO IMAGE: Dimensioni ESPLICITE */
@media(min-width:1025px){
	.section-hero {
	  position: relative;
	  width: 100%;
	  height: 100svh;
	  overflow: hidden;
	  contain: strict;
	}
}
.section-hero .hero-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.mgsxm-carousel {
    position: relative
}

.mgsxm-carousel-track {
    display: flex;
    gap: 0;
    transform: translate3d(0,0,0);
    will-change: transform;
    transition: transform 280ms ease;
}

/* Slide con TESTO SOVRIMPRESSIONE su immagine 3:4 */
.mgsxm-slide {
    flex: 0 0 100%;
    max-width: 100%;
    position: relative
}

/* Box media 3:4 + overlay + caption in davanti */
.mgsxm-mediaBox {
    position: relative;
    width: 100%;
    aspect-ratio: 16/9; /* richiesto 3:4 */
    overflow: hidden;
    background: #f7f7f7; /* placeholder anti-CLS */
}

    .mgsxm-mediaBox > img.mgsxm-media {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }


/* CAPTION OVERLAY (davanti) */
.mgsxm-captionOverlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    color: #fff;
    padding: 14px 14px 16px 14px;
}

    .mgsxm-captionOverlay .mgsxm-slide-year {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 6px;
        font-weight: 700;
        letter-spacing: .02em
    }

    .mgsxm-captionOverlay .mgsxm-year-dot {
        width: 6px;
        height: 6px;
        background: #fff;
        border-radius: 999px;
        display: inline-block;
        opacity: .9
    }

    .mgsxm-captionOverlay .mgsxm-caption {
		font-size: 1.5rem;
		line-height: 0.99;
		font-family: 'Times Now';
		text-shadow: 0 2px 10px rgba(0, 0, 0, .25);
		text-align: left;
    }

/* Micro-tag "intro" sopra carousel */
.mgsxm-title-mini {
    letter-spacing: .08em;
    text-transform: uppercase;
    font-weight: 500;
    color: var(--mgsxm-muted);
    font-size: var(--mgsxm-title-mini-size);
    margin: 8px 0 10px
}

/* Progress */
.mgsxm-progress-wrap {
    padding: 10px 0 6px
}

.mgsxm-progress {
    position: relative;
    height: 4px;
    background: var(--mgsxm-border);
    border-radius: 999px;
    overflow: hidden
}

    .mgsxm-progress::after {
        content: "";
        position: absolute;
        inset: 0;
        transform: translateX(calc(var(--p,0)*100%));
        width: max(16%, calc(100% / var(--total,6)));
        background: var(--mgsxm-accent);
    }

/* Bottoni anni */
.mgsxm-years {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap
}

.mgsxm-years-inner {
    display: inline-flex;
    padding-bottom: 4px
}

.mgsxm-year-btn {
    appearance: none;
    border: 0.5px solid #1d1d1d;
    background: #fff;
    color: #1d1d1d;
    padding: 1rem 3rem;
    font-weight: 500;
    letter-spacing: .02em;
    font-size: 18px;
	font-family:'Futura';
    line-height: 1;
	width: 35svw;
}

    .mgsxm-year-btn[aria-current="true"] {
        background: #1d1d1d;
        color: #fff;
        border-color: #fafafa;
    }

.mgsxm-year-btn {
    touch-action: manipulation
}

.slider-mag-btn{
	width:1rem;
	height:3svh;
	border:0px;
	background-color: white;
}
#csCountry, #csLang{
    height:auto !important;
}

#csCountry > option {
    color: #1d1d1d;
}
#csLang > option{
	color:#1d1d1d;
}
#shippingSelectTable > option{
	color:#1d1d1d;
}
/* option{
	color:#fafafa;
} */

.inputs-country-province > option{
	color:#fafafa;
}
#FullName > option{
    background-color:#1d1d1d;
	color:#fafafa;
}
#shipping-address-select option {
    color: #1d1d1d;
}

#customerCountry > option {
    color: #fafafa;
}
#customerlanguage > option{
	color:#fafafa;
}

.title_infopg {
    padding: 3% 0 1%;
    font-family: Futura;
    font-weight: 500;
    font-size: 3rem;
    line-height: 90%;
    text-align: left;
}
.title_infopg_span {
    font-family: 'TimesNow';
    font-weight: 400;
    font-style: italic;
    font-size: 3.5rem;
    line-height: 90%;
    padding: 0 !important;
}

.checkout-data {
    width: 100%;
    padding-left: 3svw;
    padding-right: 3svw;
}
@media(max-width:768px) {
    .checkout-data {
        width: 100vw;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .opc .step-title {
        padding:1rem;
        border-bottom: 2px solid #f1f1f1;
        text-align: left;
        margin: 1rem;
    }
        .cart-summary-sticky {
        height: 50vh !important; 
    }
}
.cart-summary-sticky {
    height: 100svh;
    background-color: #f8f8f8;
    width:100%;
}

.cart-totals-wrapper {
    outline: 0px !important;
    border: 0px !important;
    /*margin: 3rem 5rem 1rem 3rem;
    padding: 0 !important;*/
}

.terms-of-service {
    padding:1rem;
}
.step-title{
    margin:0 !important;
    padding:1rem !important;
}

.opc .buttons {
    margin:1rem;
}

.step-title > h2 {
    font-family: 'Futura' !important;
    font-weight: 500 !important;
}
#shopping-cart-form {
    padding-left: 5svw;
    padding-right: 2svw;
}

@media (min-width: 992px) {
    
    .opc-two-col {
        display: grid;
        grid-template-columns: minmax(0,1fr) 10svw;
        gap: 32px;
        align-items: start;
    }
    .opc-right {
        position: sticky;
        top: 16px;
    }
    .checkout-info {
        width: 100%;
        padding:0 15%;
        
    }
}

@media (max-width: 991px) {
    .btn {
        width: 33svw;
    }
    .opc-two-col {
        display: block;
    }
    .inputs{
        text-align:left !important;
    }
    .opc-right {
        position: static;
        margin-top: 18px;
    }
    .checkout-info {
        width: 100%;
    }
}

.opc .step{
    background-color:#fff !important;
}

.icon{
    width:2rem !important;
    height:auto;
}


.cart-item {
    background-color: #f8f8f8;
}
.docs-table{
    margin-top:4rem;
    width:70svw;
}
.ci-price-under{
    font-size:1.25rem;
    font-weight:500;
}


.gsco-accordion__toggle:after {
    transform: translate(-50%,-50%) rotate(90deg);
}
.gsco-accordion__toggle {
    width: 28px;
    height: 28px;
    border: 0;
    background: none;
    cursor: pointer;
    position: relative;
}
.no-data{
    font-family:'Inter'!important;
    font-size:1.5rem !important;
    color:#1d1d1d !important;
    font-style:normal !important;
}

#billing-address-select > option{
    color:#1d1d1d;

}

.opc .step {
    padding: 0 !important;
    background-color: #fff;
}

#billing-new-address-form{
    margin-top:1rem !important;
    background-color: white!important;
}
/*.inputs{
    height:3.5rem;
}
.inputs > input[type="text"], input[type="password"], input[type="email"], input[type="tel"], textarea, select {
    height: 2.25rem !important;
}*/

.shipping-method, .method-list, .method-name, .section, .payment-method {
    background-color: #fff !important;
}

.payment-info > td{
    font-family:'Inter';
}

.order-summary-content .cart-two-col {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 0px;
    gap: 1rem;
    align-items: start;
    max-width: 70vw;
}

.pm-item:has(.pm-radio:checked) .method-name {
    /* stile visivo per l'item selezionato, es: */
    border:1px #1d1d1d solid;
    background: #f0f8ff;
}


.checkout-page .edit-address{
    background-color:#fff !important;
    border-top:0;
}
.option-list label{
    font-family: Inter !important;
    font-style:normal !important;
}
.opc-two-col {
    display: grid;
    grid-template-columns: 1fr 360px;
    align-items: start;
    gap: 24px;
}

.opc-right {
    overflow: visible;
}

#opc-totals-placeholder .cart-summary-sticky {
    position: sticky;
    top: 16px;
    max-height: calc(100vh - 10vh);
/*    overflow: auto;*/
}

.totals {
    max-width: 100% !important;
}
@media (max-width: 992px) {
    #opc-totals-placeholder .cart-summary-sticky {
        margin-top: 10vh;
        position: static;
        max-height: none;
        overflow: visible;
        width: 100vw;
    }

    .opc-two-col {
        display: block;
    }
}
.continue-shopping-button{
    color:#fff;
}

/* riga item */
.opc-item {
    display: grid;
    grid-template-columns: 96px 1fr 160px; /* img | contenuto | destra */
    gap: 16px;
    align-items: start;
    padding: 12px 0;
}

/* centro */
.opc-item-main {
    min-width: 0;
}

/* destra: qty + remove allineati */
.opc-item-right {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-end;
}

    .opc-item-right .quantity {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

    .opc-item-right .product-quantity {
        display: flex;
        align-items: center;
        gap: 8px;
    }

/* mobile: impila */
@media (max-width: 768px) {
    .btn {
        width: 50svw;
    }
    .opc-item {
        grid-template-columns: 72px 1fr;
        grid-template-areas:
            "img main"
            "right right";
    }

    .product-picture {
        grid-area: img;
    }

    .opc-item-main {
        grid-area: main;
    }

    .opc-item-right {
        grid-area: right;
        align-items: flex-start;
    }


}
.qty-btn {
    font-size: 1rem;
    border: 0px !important;
    background-color: transparent;
    padding: 1rem !important;
    font-weight:600;
}
.qty-input {
    background: transparent;
    border: 0px !important;
    font-weight: 600;
}

.remove-btn {
    margin: 0rem;
    margin-right: 2rem;
    border: 0px;
    background: transparent;
    font-size: 13px;
    text-decoration-line: underline;
}

.edit-item {
    text-decoration-line: underline;
    margin: 0.75rem 0rem 0rem 0rem;
}

.estimate-shipping-address-control option {
    color: #1d1d1d;
}
/* ========== MOBILE (< 768px) ========== */
@media (max-width: 768px) {
    .edit-item {
        text-decoration-line: underline;
        margin: 0.75rem 1rem 0rem 0rem;
        float: inline-end;
    }
    /* il wrapper diventa una colonna */
    .cart-two-col {
        display: flex; /* se già flex va bene */
        flex-direction: column; /* colonna */
        gap: 16px;
    }

        /* sinistra e destra full width */
        .cart-two-col .cart-items-col .cart-items-list,
        .cart-two-col .cart-summary-col {
            width: 100%;
            max-width: 100svw;
            flex: 0 0 100%;
        }

        /* l'aside deve stare sotto: mettilo dopo in ordine */
        .cart-two-col .cart-items-col {
            order: 1;
        }

        .cart-two-col .cart-summary-col {
            order: 2;
        }

        /* sticky OFF su mobile */
        .cart-two-col .cart-summary-sticky {
            position: static !important;
            top: auto !important;
        }

        /* evita effetti “colonna”/padding strani */
        .cart-two-col .cart-totals-wrapper {
            width: 100%;
        }
}
/* ===== DESKTOP / TABLET: 2 colonne vere ===== */
.order-summary-content .cart-two-col {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(200px, 25svw);
    gap: 24px;
    align-items: start;
    max-width: 100%;
}
.order-summary-content .cart-two-col-opc {
    display: grid;
    grid-template-columns: minmax(0,1fr) 5svw;
    gap: 32px;
    align-items: start;
}

/* ===== MOBILE (<768): la colonna destra va sotto e prende tutta la larghezza ===== */

/* Desktop: mostra X, nascondi testo */
/*.remove-btn .remove-text {
    display: none;
}

.remove-btn .remove-icon {
    display: inline;
}*/


/* Mobile */
@media (max-width: 768px) {
    /* Meta più “a colonna”: taglia + qty sotto */
    .ci-meta {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    /* Mobile: mostra testo Elimina, nascondi X */
    /*.remove-btn .remove-text {
        display: inline;
    }

    .remove-btn .remove-icon {
        display: none;
    }*/

    /* look “link” (modifica se vuoi più button-like) */
    .remove-btn {
        background: none;
        border: 0;
        padding: 0;
        text-decoration: underline;
        font-size:13px;
    }
}
.ci-qty{
    margin-right:1rem;
}

@media (max-width: 768px) {

    /* la riga qty non deve spezzare */
    .ci-qty {
        display: flex;
        align-items: center;
        gap: 0px;
        flex-wrap: nowrap;
        margin-right:1rem;
    }

        /* stepper sempre su UNA riga */
        .ci-qty .qty-stepper {
            display: inline-flex;
            align-items: center;
            gap: 14px; /* distanza tra - / input / + */
            flex-wrap: nowrap;
            white-space: nowrap;
        }

        /* evita che i bottoni vadano a capo o prendano 100% */
        .ci-qty .qty-btn,
        .ci-qty .quantity {
            display: inline-flex !important;
            align-items: center;
            justify-content: center;
            flex: 0 0 auto;
            width: auto !important;
            min-width: 24px; /* tocco comodo */
            padding: 0;
        }

        /* numero “pulito” senza box */
        .ci-qty .qty-input--readonly {
            background: transparent !important;
            border: 0 !important;
            box-shadow: none !important;
            width: 2.2em; /* abbastanza per 2 cifre */
            text-align: center;
            padding: 0;
        }
}

.cart-collaterals .coupon-box,
.cart-collaterals .giftcard-box {
    padding: 0px;
    margin: 1rem 0;
}
.cart-collaterals .deals > div {
    white-space: normal;
    width: 100%;
}

.cart-collaterals {
    float: left;
    width: 65svw;
    overflow: hidden;
}
/* =========================
   CHECKOUT: totals sidebar - fix taglio a destra
   ========================= */

.checkout-page .opc-two-col {
    /* evita colonne troppo rigide + contenuti che sforano */
    grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
    column-gap: 32px;
}

/* l'aside dentro la griglia deve stare a 100% della colonna, niente vw */
.checkout-page .opc-right #opc-totals-placeholder .cart-summary-col {
    width: 100% !important;
    max-width: 100% !important;
}

/* niente width in svw e niente clipping orizzontale */
.checkout-page .opc-right #opc-totals-placeholder .cart-summary-sticky {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important; /* via il “taglio” */
    box-sizing: border-box;
}

/* quei margini ti ammazzano lo spazio utile dentro 360px */
.checkout-page .opc-right #opc-totals-placeholder .cart-totals-wrapper {
    margin: 0 !important;
    padding: 15% !important; /* usa padding, non margin */
    box-sizing: border-box;
}

/* extra: le tabelle devono adattarsi sempre */
.checkout-page .opc-right #opc-totals-placeholder .cart-total {
    width: 100%;
    table-layout: fixed;
}

.checkout-page .opc-right #opc-totals-placeholder .cart-total-left,
.checkout-page .opc-right #opc-totals-placeholder .cart-total-right {
    overflow-wrap: anywhere;
}

/* PayPal messages: non deve “bucare” la colonna */
.checkout-page .opc-right #opc-totals-placeholder .paypal-messages-container {
    max-width: 100%;
    overflow: hidden;
}

/* mobile: totals sotto, full width */
@media (max-width: 768px) {
    .checkout-page .opc-two-col {
        grid-template-columns: 1fr;
    }

    .checkout-page .opc-right {
        margin-top: 16px;
    }
    #checkout-steps {
        max-width: 95%;
    }
}

/* =========================
   CHECKOUT - FIX TAGLIO ASIDE TOTALI
   ========================= */

/* La griglia del checkout: sinistra fluida + destra con larghezza sensata */
.checkout-page .opc-two-col {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(320px, 28vw, 420px);
    column-gap: 24px;
}

/* IMPORTANTISSIMO: togli i vincoli in svw che ti tagliano l'aside */
.checkout-page .opc-right,
.checkout-page .opc-right .cart-summary-col,
.checkout-page #opc-totals-placeholder .cart-summary-col {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    box-sizing: border-box;
}

/* Evita qualsiasi clipping orizzontale */
.checkout-page .opc-right,
.checkout-page #opc-totals-placeholder,
.checkout-page #opc-totals-placeholder .cart-summary-sticky,
.checkout-page #opc-totals-placeholder .cart-totals-wrapper {
    overflow: visible !important;
}

    /* La tabella deve occupare tutta la larghezza disponibile */
    .checkout-page #opc-totals-placeholder .total-info,
    .checkout-page #opc-totals-placeholder table.cart-total {
        width: 100% !important;
        table-layout: auto !important;
    }

    .checkout-page #opc-totals-placeholder .cart-total td {
        overflow: visible !important;
    }

    /* Se qualche tema limita la span del valore */
    .checkout-page #opc-totals-placeholder .value-summary {
        display: inline !important;
        max-width: none !important;
    }
.cart-options .button-2,
.cart-options .estimate-shipping-button,
.cart-options .button-2.continue-shopping-button {
    padding: 16px 32px;
    margin: 1rem 0rem 1rem;
	text-align:center;
}

/* Checkout: nascondi PayPal pay-later messages sotto i totali */
/*.checkout-page .paypal-messages-container,
.checkout-page [data-pp-message],
.checkout-page [id^="zoid-paypal-message-"] {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
}*/
/* OPC - MOBILE: i totali devono stare nel flusso, sotto, mai sticky/fixed */
@media (max-width: 992px) {

    .opc-two-col {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        width: 100% !important;
    }

    .opc-left,
    .checkout-data {
        width: 100% !important;
        max-width: 100% !important;
    }

    .opc-right {
        order: 2 !important; /* dopo la colonna sinistra */
        width: 100% !important;
        display: block !important;
        padding: 16px 0 0 !important;
    }

    #opc-totals-placeholder {
        width: 100% !important;
    }

        /* ammazza qualunque sticky/fixed che causa overlay su mobile */
        #opc-totals-placeholder aside.cart-summary-col,
        #opc-totals-placeholder .cart-summary-col,
        #opc-totals-placeholder .cart-summary-sticky {
            position: static !important;
            top: auto !important;
            bottom: auto !important;
            left: auto !important;
            right: auto !important;
            z-index: auto !important;
            transform: none !important;
        }
    #customerlanguage > option,
    #customerCountry > option {
        color: #1d1d1d;
    }
}

/* OPC - DESKTOP: qui invece puoi tenere lo sticky */
@media (min-width: 993px) {
    #opc-totals-placeholder .cart-summary-sticky {
        position: sticky;
        top: 20vh;
    }
}
.blog-card .rich-blog-image {
    margin: 0;
}

    .blog-card .rich-blog-image a {
        display: block;
    }

    .blog-card .rich-blog-image img,
    .blog-card .thumb-img {
        width: 100%;
        height: 225px; /* scegli tu */
        object-fit: cover;
        object-position: top;
        display: block;
    }
/* --- Payment method buttons --- */
#payment-method-block.pm-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
    align-self:center;
    justify-content:center;
}

.payment-method .method-list li {
    width:100%;
    max-width:100%;
}
    /* nascondo il li "classico" */
#payment-method-block.pm-btns .pm-item {
    margin: 8px 0;
    border: solid 1px #e8e8e8;
}




/* descrizione sotto */
.pm-desc-wrap {
    margin-top: 14px;
    border: 1px solid #e5e5e5;
    border-radius: none;
    padding: 12px 14px;
}

.pm-desc-title {
    font-weight: 600;
    margin-bottom: 6px;
}

.pm-desc {
    opacity: .95;
}
@media (max-width: 768px) {

    .captionMI {
        margin-bottom: 2rem;
        margin-top: 2rem;
    }
    .order-summary-content .cart-two-col-opc {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 0svw;
        gap: 0px;
        align-items: start;
    }
    .payment-method .method-list li {
        width: 100%;
        margin-inline:auto;
        max-width: 100%;
    }
    #payment-method-block.pm-btns {
        flex-direction: column;
    }
    
}
@media (max-width: 480px) {
    .order-summary-content .ci-media img {
        width: 80px;
        margin-left:0.5rem;
    }
}
@media (max-width: 480px) {
    .order-summary-content .cart-item {
        grid-template-columns: 80px minmax(0,1fr);
        grid-template-areas:
            "media main"
            "right right";
    }

    .order-summary-content .ci-media {
        grid-area: media;
    }

    .order-summary-content .ci-main {
        grid-area: main;
    }

    .order-summary-content .ci-right {
        grid-area: right;
        justify-self: end;
    }
    .order-summary-content .ci-actions {
        margin-top:0.5rem;
    }
}

.ci-main {
    padding: 0.5rem 0rem 0.5rem 0rem;
}

.opc-ship-to-same label{
    margin-left:1rem;
}

.pay-logos-row {
    display: flex;
    flex-wrap: nowrap; /* sempre una riga */
    width: 100%;
    gap: 12px; /* aria tra i loghi */
    height: 30svh;
}

.pay-logo {
    flex: 1 1 0; /* 3 parti uguali */
    box-sizing: border-box;
    padding: 6px; /* aria “interna” per non far toccare i bordi */
    display: flex;
    align-items: center;
    justify-content: center;
}

    .pay-logo .slide-img {
        width: 100%;
        max-width: 120px; /* limita la dimensione su desktop */
        height: auto;
        object-fit: contain;
    }

/* opzionale: su mobile riduci un filo il max per evitare loghi troppo grandi */
@media (max-width: 480px) {
    .pay-logos-row {
        gap: 8px;
    }

    .pay-logo {
        padding: 4px;
    }

        .pay-logo .slide-img {
            max-width: 90px;
        }
    .item-grid {
        display: block;
        flex-wrap: wrap !important;
        gap: 12px !important;
        padding: 1rem;
    }
}

/* OPC: nascondi sempre PayPal Messages (Pay Later messages) */
#opc-two-col .paypal-messages-container,
#opc-two-col [data-pp-message],
#opc-two-col iframe[id^="zoid-paypal-message-uid_"],
#opc-two-col div[id^="zoid-paypal-message-uid_"] {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}
.opc-select-address-container{
    width: 100%;
    margin-bottom: 1rem;
}
.list-container{
    display:flex;
    text-align:left;
}
.article-term-title {
    font-family: 'Futura';
    font-size: 28px;
    font-weight: 500;
    letter-spacing:0;
    text-align:left !important;
}

#customerCurrency{
    /*display:none !important;*/
}



.miniProductDetailsView .overview .qty-input {
    width: 70%;
}

@media(min-width:1279px){
    /*.miniProductDetailsView .overview .qty-input {
        width: 80%;
    }*/
}
.k-window.ajaxCart [data-ajaxcart-miniview="1"] .message-error {
    display: none;
    position: static;
}

.message-error{
    color:darkred;
    font-weight:600;
}

.product-price span{
    font-size:1.5rem !important;
}
.overview .old-product-price,
.overview .old-product-price span {
    font-size: 1.5rem !important;
}


.mega-menu.menu_sinistra li.has-sublist.gs-col-collapsed > .sublist-wrap {
    display: none !important;
}

.Primavera, .Spring,
.Categoria, .Category,
.Materiali, .Material,
.Autunno, .Fall,
.Abbigliamento, .Apparel,
.Accessori, .Accessories,
.Cura, .care {
    top: 0; /* di fatto verrà sovrascritto dallo style inline */
}

.modal-header{
    margin-bottom:1rem;
}

@media (max-width: 768px) {

    .order-details-page h1{
        font-size:24px;
    }
        /* override IMPORTANT della tua regola con 0px */
        .order-summary-content .cart-two-col {
        grid-template-columns: 1fr !important;
        max-width: 100%;
    }

    .order-summary-content .cart-summary-col {
        width: 100svw;
        background-color: #f8f8f8;
    }

    /* sticky off + width/height fluidi */
    .order-summary-content .cart-summary-sticky {
        position: static !important;
        top: auto !important;
        width: 100% !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }

    /* margini più “mobile friendly” */
    .order-summary-content .cart-totals-wrapper {
        margin: 1.5rem 1rem 1rem 0rem;
    }

    #shopping-cart-form {
        padding-left: 0svw;
        padding-right: 0svw;
    }

    .cart-collaterals {
        width: 100svw;
    }

    .cart-collaterals .deals > div{
        white-space: normal;
        width: 100vw;
        padding: 1rem;
        display:flex;
    }

    .cart-collaterals .hint {
        margin:1rem 0;
    }

    .cart-options .button-2.continue-shopping-button {
        padding: 1rem;
		width: 100%;
        text-align: center;
    }
 }
.validation-summary-errors li,
.miniProductDetailsView .message-error li {
    margin: 0 0 10px;
    font-size: 1rem;
}

.wishlist-content .button-1 {
    display: inline-block;
    padding: 16px 32px;
    font-size: 16px;
    background: #1d1d1d;
    border: 0;
    color: #fff;
    text-transform: uppercase;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
    margin: 16px;
}

.cart th, .data-table th, .forums-table-section th, .footable-loaded th {
    color: #1d1d1d;
    font: 1rem 'Inter', serif;
    font-style: normal;
    text-align: center;
    background: #f8f8f8;
    padding: 17px;
    white-space: nowrap;
}

.cart td, .data-table td, .compare-products-table td, .forums-table-section td
{
    min-width: 100px;
    border: 1px solid #f1f1f1;
    background: #fff;
    padding: 1rem;
}

.page-title {
    margin: 1rem 0;
}

.cart-collaterals .coupon-code input,
.cart-collaterals .coupon-code button {
    width: 100%;
}

@media(max-width:1520px) {
    .miniProductDetailsView .overview .qty-input {
        width: 70%;
    }

    .miniProductDetailsView .overview {
        padding: 0.25rem;
        width: 25vw;
    }

    .miniProductDetailsView .product-essential {
        grid-template-columns: minmax(0, 1fr) 55%;
    }
}

@media(min-width:1440px) {
    .miniProductDetailsView .overview .qty-input {
        width: 70%;
    }

    .miniProductDetailsView .overview {
        padding: 0.25rem;
        width: 30vw;
    }

    .miniProductDetailsView .product-essential {
        grid-template-columns: minmax(0, 1fr) 60%;
    }
}

@media(max-width:1320px) {
    .miniProductDetailsView .product-essential {
        grid-template-columns: minmax(0, 1fr) 60%;
    }

    .miniProductDetailsView .overview {
        padding: 0.25rem;
        width: 30vw;
    }
}
@media(min-width:1920px){
    .miniProductDetailsView .overview{
        padding:0.25rem;
        width:25vw;
    }
    
    .miniProductDetailsView .product-essential {
        grid-template-columns: minmax(0, 1fr) 50%;
    }
}
@media(min-width:1980px) {
    .miniProductDetailsView .overview {
        padding: 0.25rem;
        width: 25vw;
    }

    .miniProductDetailsView .product-essential {
        grid-template-columns: minmax(0, 1fr) 50%;
    }
}

@media (max-width: 1024px) {

    .cart-collaterals .deals > div{
        width:100%;
    }
    .cart-collaterals .hint{
        margin:0;
    }
    .cart-collaterals .coupon-code input,
    .cart-collaterals .coupon-code button {
        width: 100%;
    }

    .page-title h1 {
        font-size: 4rem;
        padding: 1rem;
        margin-top: 1rem;
    }

    .cart-summary-col .cart-total td label,
    .cart-summary-col .cart-total td span,
    .cart-summary-col .terms-of-service label,
    .cart-summary-col .terms-of-service a,
    .cart-summary-col .terms-of-service p,
    .cart-summary-col .checkout-button {
        font-size: 0.75rem;
    }

    /* wrapper titolo + prezzo in colonna */
    .item-box .details .title-and-price {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
    }

    /* titolo full width */
    .item-box .details .product-title {
        width: 100%;
        min-width: 0;
        margin: 0;
    }

        .item-box .details .product-title a {
            width: 100%;
            display: block;
        }

    /* prezzo sotto, full width */
    .item-box .details .add-info {
        width: 100%;
        order: 2;
    }

    .item-box .details .product-title {
        order: 1;
    }

    /* se avevi width fissa desktop (tipo 20svw), neutralizzala in mobile */
    .item-box .product-title {
        width: 100% !important;
    }

    .item-box .prices {
        text-align: left;
    }
}

.page-title{
    margin-top:1rem;
}

/* Applichiamo queste regole solo quando lo schermo è piccolo (Mobile/Tablet) */
@media screen and (max-width: 1279px) {

    /* Impedisce alla pagina di allargarsi orizzontalmente */
    #main, .master-wrapper-content {
        overflow-x: hidden;
        width: 100%;
    }

    /* Contenitore principale dello slider mobile */
    .mgsxm-wrap {
        width: 100% !important;
        overflow: hidden !important; /* Taglio netto di tutto ciò che esce */
        position: relative;
        /* Evita che il tocco orizzontale faccia sobbalzare la pagina */
        touch-action: pan-y;
    }

    /* La traccia che contiene le foto in riga */
    .mgsxm-carousel-track {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        width: 100%;
        /* Il transform è gestito dal JS, ma qui garantiamo il layout */
    }

    /* La singola slide deve essere larga quanto lo schermo */
    .mgsxm-slide {
        flex: 0 0 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    /* Forza le immagini a non superare mai la larghezza dello schermo */
    .mgsxm-media {
        width: 100% !important;
        height: auto !important;
        display: block;
    }
}

@media screen and (max-width: 1279px) {

    /* --- FIX 1: La barra degli anni deve scorrere INTERNAMENTE --- */
    /* Il contenitore esterno diventa una finestra scrollabile */
    .mgsxm-years {
        width: 100% !important;
        max-width: 100vw !important; /* Non deve mai superare lo schermo */
        overflow-x: auto !important; /* Abilita lo scroll orizzontale QUI */
        overflow-y: hidden !important;
        display: flex !important;
        white-space: nowrap !important;
        /* Nascondiamo la scrollbar brutta */
        scrollbar-width: none; /* Firefox */
        -ms-overflow-style: none; /* IE/Edge */
        -webkit-overflow-scrolling: touch; /* Scroll fluido su iOS */
    }

        .mgsxm-years::-webkit-scrollbar {
            display: none; /* Chrome/Safari */
        }

    .mgsxm-years-inner::-webkit-scrollbar {
        display: none; /* Chrome, Safari, Edge */
    }
    /* Il contenitore interno può essere largo quanto vuole */
    #mgsxmYears.mgsxm-years-inner {
        width: auto !important; /* Lascialo allargare */
        display: flex !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch; 
        overscroll-behavior-x: contain;
        scrollbar-width: none;
        flex-direction: row !important;
        position: static !important; /* Evita posizionamenti strani */
        margin: 0 !important;
        padding-right: 20px; /* Un po' di aria alla fine */
        border: none !important; /* Rimuoviamo il bordo rosso di debug se rimasto */
    }

    /* --- FIX 2: I Modali fuori schermo --- */
    /* Li nascondiamo dal calcolo della larghezza finché non servono */
    .side-modal,
    #loginModalContent {
        /* Se sono fuori schermo, non devono contare */
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }

    /* --- FIX 3: La "Serratura" finale --- */
    html, body {
        overflow-x: hidden !important; /* Taglia via tutto ciò che i fix sopra non hanno preso */
        width: 100% !important;
        position: relative;
    }
}
@media screen and (max-width: 1279px) {
    /* 1. Reset del contenitore (UL) */
    body ul.ui-autocomplete.ui-menu {
        background-color: #ffffff !important;
        background: #ffffff !important;
        border: 1px solid #dcdcdc !important;
        color: #000000 !important;
    }

    /* 2. Colore Nero FORZATO su Link e Span (Normal State) */
    /* Usiamo 'body' per vincere su qualsiasi stile del tema */
    body .ui-menu .ui-menu-item a.ui-menu-item-wrapper,
    body .ui-menu .ui-menu-item a.ui-menu-item-wrapper span,
    body .ui-menu .ui-menu-item div {
        color: #000000 !important;
        -webkit-text-fill-color: #000000 !important; /* Fix specifico WebKit/iOS */
        font-weight: 500 !important; /* Lo rendiamo un po' più cicciotto per vederlo meglio */
        background-color: transparent !important;
        background: transparent !important;
        text-decoration: none !important;
        text-shadow: none !important;
    }

        /* 3. Stato ATTIVO / SELEZIONATO (Quando lo tocchi) */
        /* Sovrascriviamo il blu di default di jQuery UI */
        body .ui-menu .ui-menu-item a.ui-menu-item-wrapper.ui-state-active,
        body .ui-menu .ui-menu-item a.ui-menu-item-wrapper:hover,
        body .ui-menu .ui-menu-item a.ui-menu-item-wrapper:active {
            background-color: #f2f2f2 !important; /* Grigio chiaro invece del blu */
            background: #f2f2f2 !important;
            color: #000000 !important;
            -webkit-text-fill-color: #000000 !important;
            border: none !important;
            margin: 0 !important;
        }

    /* 4. Fix estremo per iOS Dark Mode */
    /* Forza il browser a trattare questo blocco come se fosse in light mode */
    body .ui-autocomplete {
        color-scheme: light !important;
    }
}

@media screen and (max-width: 1279px) {
    /* FORZA IL CONTENITORE A STARE SOPRA TUTTO */
    ul.ui-autocomplete {
        visibility: visible !important;
        opacity: 1 !important;
        z-index: 2147483647 !important; /* Massimo valore possibile */
        background-color: white !important;
        max-height: 50vh !important;
        overflow-y: auto !important;
    }

    /* FORZA L'ELEMENTO DELLA LISTA AD AVERE UN'ALTEZZA */
    .ui-menu-item {
        clear: both !important;
        width: 100% !important;
        min-height: 50px !important; /* Altezza minima forzata */
        margin: 0 !important;
        padding: 0 !important;
    }

        /* FORZA IL TESTO DENTRO */
        .ui-menu-item-wrapper,
        .ui-menu-item a,
        .ui-menu-item span {
            display: block !important;
            position: relative !important; /* Assicura che non sia nascosto sotto */
            height: auto !important;
            min-height: 40px !important;
            line-height: 40px !important; /* Centratura verticale */
            font-size: 16px !important; /* Font leggibile */
            color: black !important;
            -webkit-text-fill-color: black !important;
            visibility: visible !important;
            text-indent: 0 !important; /* Resetta rientri strani */
            overflow: visible !important;
        }
    .icon-header {
        filter: none;
    }

    .country-selector-wrapper, .language-selector {
        display: inline-flex !important;
    }
    
    
}

/* Il contenitore principale */
.cura-container {
    display: grid;
    /* MAGIA RESPONSIVE:
     Crea colonne che sono larghe almeno 250px.
     Se c'è spazio, ne mette 3. Se lo schermo è piccolo, ne mette 1 o 2.
     Tutto automatico!
  */
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    width: 100%;
}

/* Il singolo blocchetto (Icona + Testo) */
.cura-item {
    display: flex;
    align-items: center; /* Centra verticalmente l'icona rispetto al testo */
    gap: 15px; /* Spazio tra icona e testo */
    padding: 10px;
}

/* Stile dell'icona (per sicurezza) */
.cura-icon {
    width: 30px; /* O la dimensione che preferisci */
    height: auto;
    flex-shrink: 0; /* Impedisce all'icona di schiacciarsi se il testo è lungo */
}


.ajaxcart-custom-close {
    position: fixed;
    top: 20px;
    left: 20px;
    width: 50px;
    height: 50px;
    background-color: #000;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 100000;
    font-family: sans-serif;
    font-size: 24px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
    transition: transform 0.2s;
}

/* Impedisce fisicamente la visualizzazione dei media del menu su mobile */
@media only screen and (max-width: 1024px) {
    .mega-menu.menu_sinistra .media-menu,
    .mega-menu.menu_sinistra video {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
}

.password-recovery-page .tooltip {
	font: 15px 'Inter', serif;
    font-style: normal;
 }

/* ═══════════════════════════════════════════════════════════
   PAYMENT METHOD - Layout con Radio + Label a SX, Logo a DX
   ════════════════════════════════════════════════════════════ */

/* Reset lista */
.payment-method .method-list {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

    .payment-method .method-list li {
        display: block;
        border-bottom: 1px solid #ddd;
    }

        .payment-method .method-list li:last-child {
            border-bottom: none;
        }

    /* Wrapper della singola riga: flexbox con spazio tra */
    .payment-method .method-list .method-name {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0.75rem;
        height:10svh;
        min-height: 3rem;
        background: #fff;
        cursor: pointer;
        transition: background 0.15s;
    }



    /* LEFT SIDE: payment-details contiene radio + label */
    .payment-method .method-list .payment-details {
        display: flex;
        align-items: center;
        gap: 12px;
        flex: 1; /* Occupa tutto lo spazio disponibile */
        order: 1; /* Forza a sinistra */
    }

    /* Radio button custom */
    .payment-method .method-list input[type="radio"] {
        appearance: none;
        -webkit-appearance: none;
        width: 20px;
        height: 20px;
        min-width: 20px;
        border: 2px solid #bbb;
        border-radius: 50%;
        cursor: pointer;
        position: relative;
        transition: border-color 0.15s;
        margin: 0;
    }

        .payment-method .method-list input[type="radio"]:checked {
            border-color: #1d1d1d;
        }

            .payment-method .method-list input[type="radio"]:checked::after {
                content: '';
                position: absolute;
                top: 3px;
                left: 3px;
                width: 10px;
                height: 10px;
                border-radius: 50%;
                background: #1d1d1d;
            }

    /* Label del metodo */
    .payment-method .method-list .payment-details label {
        font-size: 16px;
		text-align:left;
        color: #1d1d1d;
        cursor: pointer;
        margin: 0;
    }

/* RIGHT SIDE: payment-logo */
.payment-method .payment-logo {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    order: 2; /* Forza a destra */
    margin-left: auto; /* Spinge a destra */
}

    .payment-method .payment-logo img {
        max-height: 32px;
        width: auto;
        display: block;
    }

.payment-method .method-list {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

    .payment-method .method-list li {
        border-bottom: 1px solid #ddd;
    }

        .payment-method .method-list li:last-child {
            border-bottom: none;
        }

    /* ── Riga cliccabile ───────────────────────── */
    .payment-method .method-list label {
        display: flex;
        align-items: center;
        gap: 16px;
        padding: 0rem 1rem;
        cursor: pointer;
        background: #fff;
        min-height: 24px;
    }


    /* ── Radio custom ──────────────────────────── */
    .payment-method .method-list input[type="radio"] {
        appearance: none;
        -webkit-appearance: none;
        width: 20px;
        height: 20px;
        min-width: 20px;
        border: 2px solid #bbb;
        border-radius: 50%;
        cursor: pointer;
        position: relative;
        transition: border-color 0.15s;
    }

        .payment-method .method-list input[type="radio"]:checked {
            border-color: #222;
        }

            .payment-method .method-list input[type="radio"]:checked::after {
                content: '';
                position: absolute;
                top: 3px;
                left: 3px;
                width: 10px;
                height: 10px;
                border-radius: 50%;
                background: #222;
            }

    /* ── Nome metodo ───────────────────────────── */
    .payment-method .method-list .payment-name {
        font-size: 16px;
        color: #1d1d1d;
    }

    /* ── Logo metodo ───────────────────────────── */
    .payment-method .method-list .payment-logo img {
        max-height: 48px;
        width: auto;
        display: block;
    }

    /* ── Riga selezionata: bordo intero ────────── */
    .payment-method .method-list li.is-selected label {
        outline: 2px solid #222;
        outline-offset: -2px;
    }

    @media(max-width:768px){
        .item-box .details .title-and-price {
            gap:0px;
        }
       .opc-select-address-container {
            width: 100%;
            padding: 0 1rem;
            margin: auto;
        }
        .cart-summary-col .cart-total td label, .cart-summary-col .cart-total td span, .cart-summary-col .terms-of-service label, .cart-summary-col .terms-of-service a, .cart-summary-col .terms-of-service p, .cart-summary-col .checkout-button {
            font-size: 1rem;
        }
        .page-title h1 {
            font-size: 4rem;
            padding: 1rem;
            margin-top: 2svh;
        }

        .blogpost-page .page-title h1,
        .news-item-page .page-title h1 {
            text-transform: none;
            /*font-size: 25px;*/
            font-size:2rem;
            font-weight: 600;
            letter-spacing: initial;
        }
        .html-blogpost-page .page-title.blog-title.post-head,
        .html-blogpost-page .page-title.blog-title.post-head .post-head__title {
            width: 90svw;
        }
        .blogpost-body p {
            text-align:justify;
        }
    }

    #jumbotron-madeinitaly .colonna-destra{
        border:0px;
    }

/* Scroll lock */
/* Scroll lock attivo quando il mega menu è aperto */
body.mega-menu-open {
    overflow: hidden;
}

    /* Opzionale: evita il salto degli elementi fixed (es. header sticky) */
    body.mega-menu-open header,
    body.mega-menu-open .header-fixed {
        padding-right: var(--scrollbar-compensation, 0px);
    }

li.mega-menu-close-btn {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}
.mega-menu-close-btn button{
    width: 100%;
    z-index: 10;
    opacity: 1;
    pointer-events: none;
    display: flex;
    align-items: left;
    border:none;
    justify-content: left;
    padding: 32px;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(4px);
    color: #111;
    font-size: 24px;
    cursor: pointer;
    transition: opacity 250ms ease, background 150ms ease;
}

.cs-select {
    background: url(../img/chevron.png) right 8px center no-repeat;
    border-bottom: 1px solid rgba(255,255,255,0.35);
    border-top: 0;
    border-left: 0;
    border-right: 0;
    color: #fff;
    padding: 12px 4px;
    min-width: 33%;
    flex: 1;
}

.cs-gate-bg {
    position: fixed;
    inset: 0;
    z-index: 9998;
    background: url('/images/home/landing_desktop_old.jpg') top / cover no-repeat;
    /* Parte senza blur — foto nitida */
    filter: blur(0) brightness(1);
    transform: scale(1.00); /* leggero over-scale per evitare bordi visibili quando il blur si attiva */
    transition: filter 1.2s cubic-bezier(.4,0,.2,1), transform 1.2s cubic-bezier(.4,0,.2,1);
}

.body-404 {
    background: url('/images/home/landing_desktop_old.jpg') top / cover no-repeat;
}

/* ===== FASE 2: quando .cs-revealed è applicata — blur + scurisci ===== */
.cs-revealed .cs-gate-bg {
    filter: blur(16px) brightness(.85);
    transform: scale(1.20);
}

.cs-gate {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

.cs-card {
    max-width: 760px;
    width: 95%;
    text-align: center;
    padding: 40px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

/* ===== LOGO: grande in fase 1, si riduce e sale in fase 2 ===== */
.cs-logo-container {
    margin-bottom: 0;
    transition: transform 1s cubic-bezier(.4,0,.2,1), margin-bottom 1s cubic-bezier(.4,0,.2,1);
    transform: translateY(0);
}

    .cs-logo-container img {
        width: 30vw; /* desktop: 30% viewport */
        max-height: none;
        height: auto;
        transition: width 1s cubic-bezier(.4,0,.2,1);
    }

.cs-revealed .cs-logo-container {
    transform: translateY(-20px);
    margin-bottom: 32px;
}

    .cs-revealed .cs-logo-container img {
        width: 12vw; /* desktop: rimpicciolisce */
    }

/* ===== FORM + TESTO: nascosti, appaiono in fade ===== */
.cs-gate-form-area {
    opacity: 0;
    transform: translateY(24px);
    pointer-events: none;
    transition: opacity .8s .4s cubic-bezier(.4,0,.2,1), transform .8s .4s cubic-bezier(.4,0,.2,1);
}

.cs-revealed .cs-gate-form-area {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
    width: 35vw;
    display: contents;
}


/* ===== Stili form invariati ===== */
.cs-btn {
    border: 1px solid rgba(255,255,255,0.35);
    border-top: 0;
    padding: 0px 8px;
    background: transparent;
    color: #fff;
    cursor: pointer;
    margin-top: 18px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.cs-footer {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 10000;
}

.cs-gate-txt {
    font-family: 'Futura', sans-serif;
    opacity: .9;
    margin: 40px;
    font-size: 16px;
}

.cs-input-container {
    display: flex;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
}


@media (max-width: 768px) {
    .cs-card {
        padding: 20px 12px;
    }

    .cs-logo-container img {
        width: 90vw; /* mobile: 90% viewport in fase 1 */
    }

    .cs-revealed .cs-logo-container img {
        width: 50vw; /* mobile: riduce ma resta leggibile */
    }

    .cs-select {
        min-width: 100%;
    }
}

@media(max-width:1024px) {
    .body-404,
    .cs-gate-bg {
        background: url('/images/home/landing_mobile.jpg') center / cover no-repeat;
    }

    .cs-btn {
        width: 100%;
        background-color: #1d1d1d;
        border: none;
        padding: 8px;
    }
}

.mega-menu-overlay-close {
    position: fixed;
    bottom: 16px;
    left: 16px;
    z-index: 999;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.7);
    background: rgba(0, 0, 0, 0.55);
    color: rgb(255, 255, 255);
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    transition: opacity 250ms, transform 150ms;
    pointer-events: auto;
    backdrop-filter: blur(4px);
}

.mega-menu-overlay {
    position: fixed;
    inset: 0px;
    background: rgba(0, 0, 0, 0.45);
    z-index: 998;
    opacity: 1;
    transition: opacity 250ms;
    pointer-events: auto;
}
/* ============================================
   FILTRI LATERALI — wrapper dedicato creato via JS
   ============================================ */
.mgs-filters-layout {
    display: grid;
    grid-template-columns: 0 1fr;
    gap: 0;
    transition: grid-template-columns 300ms ease, gap 300ms ease;
    position: relative;
    align-items: start;
}

    .mgs-filters-layout.filters-open {
        grid-template-columns: 25vw 1fr;
        gap: 24px;
    }

    .mgs-filters-layout > .uptown-one-column-ajax-filters-wrapper {
        grid-column: 1;
        min-width: 0;
        overflow: hidden;
        max-height: calc(100vh - var(--is-navbar-height, 160px));
        overflow-y: auto;
        position: sticky;
        top: var(--is-navbar-height, 160px);
    }

    .mgs-filters-layout > .page {
        grid-column: 2;
        min-width: 0;
    }

    .mgs-filters-layout .filtersPanel {
        width: 100%;
    }

    .mgs-filters-layout:not(.filters-open) .filtersPanel {
        display: none !important;
    }

    .mgs-filters-layout.filters-open .filtersPanel {
        display: block !important;
    }

    .mgs-filters-layout > .uptown-one-column-ajax-filters-wrapper .nopAjaxFilters7Spikes > .filtersTitlePanel {
        display: none;
    }

/* ============================================
   TOOLBAR (invariato)
   ============================================ */
.product-selectors {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding: 12px 0;
    border-top: 1px solid #ededed;
    border-bottom: 1px solid #ededed;
    margin-bottom: 20px;
}

    .product-selectors .filtersTitlePanel {
        display: flex;
        align-items: center;
        gap: 12px;
        cursor: pointer;
        font-size: 16px;
        text-transform: uppercase;
        user-select: none;
    }

        .product-selectors .filtersTitlePanel .filtersTitle {
            font-weight: 500;
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .product-selectors .filtersTitlePanel .filtersTitle {
            font-weight: 500;
            display: flex;
            align-items: center;
            gap: 8px;
        }

            .product-selectors .filtersTitlePanel .filtersTitle::before {
                content: '';
                display: inline-block;
                width: 24px;
                height: 24px;
                background-image: url('../img/filter.png');
                background-position: center;
                background-size: contain;
                background-repeat: no-repeat;
                -webkit-transform: translateZ(0);
                transform: translateZ(0);
                -webkit-transition: -webkit-transform 250ms ease;
                transition: transform 250ms ease;
            }

.mgs-filters-layout.filters-open .filtersTitlePanel .filtersTitle::before {
    -webkit-transform: rotate(-90deg) translateZ(0);
    transform: rotate(-90deg) translateZ(0);
}

.product-selectors .filtersTitlePanel .clearFilterOptionsAll {
    color: #999;
    font-size: 12px;
    text-decoration: underline;
    cursor: pointer;
}

.product-selectors .product-sorting {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* ============================================
   Responsive < 1024px
   ============================================ */
@media (max-width: 1024px) {
    .mgs-filters-layout,
    .mgs-filters-layout.filters-open {
        display: block;
        grid-template-columns: none;
    }

        .mgs-filters-layout > .uptown-one-column-ajax-filters-wrapper {
            position: fixed;
            top: 0;
            left: 0;
            width: 85vw;
            max-width: 360px;
            height: 100vh;
            max-height: 100vh;
            background: #fff;
            z-index: 1000;
            transform: translateX(-100%);
            transition: transform 300ms ease;
            box-shadow: 2px 0 20px rgba(0, 0, 0, .15);
            padding: 20px;
        }

        .mgs-filters-layout.filters-open > .uptown-one-column-ajax-filters-wrapper {
            transform: translateX(0);
        }
}

.category-page .product-selectors {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}
.product-selectors .filtersTitlePanel,
.category-page .product-selectors > .filtersTitlePanel {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    background-color: #1d1d1d;
    padding: 4px 32px;
    margin-left: 12px;
    color: #fff;
}

html {
    scroll-behavior: auto !important;
}
body {
    overflow: visible !important;
}