@media (min-width: 1024px) {
  .catalog-product-view .page-main .columns > .column.main{
    display:flex !important; flex-wrap:wrap !important; align-items:flex-start !important; gap:32px !important;
  }
  .catalog-product-view .page-main .columns > .column.main > .page.messages{
    order:0 !important; flex:1 1 100% !important;
  }
  .catalog-product-view .page-main .columns > .column.main > .product.media{
    order:1 !important; flex:0 0 420px !important; max-width:420px !important; margin-bottom:0 !important;
  }
  .catalog-product-view .page-main .columns > .column.main > .product-main-content{
    order:2 !important; flex:1 1 0% !important; min-width:520px !important;
    display:flex !important; flex-wrap:wrap !important; align-items:flex-start !important; gap:24px !important;
    position:relative !important; padding-right:352px !important; /* 320 sidebar + 32 gap */
  }
  .catalog-product-view .product-main-content .product-info-main{
    order:1 !important; flex:1 1 460px !important; min-width:460px !important;
  }
  .catalog-product-view .product-main-content .product-info-left-cms{
    position:absolute !important; top:0 !important; right:0 !important; width:320px !important; max-width:320px !important;
  }
  .catalog-product-view .product-main-content .product-info-content{
    order:3 !important; width:100% !important; max-width:100% !important; margin-top:16px !important;
  }
  .catalog-product-view .page-main .columns > .column.main > .product.info.detailed{
    order:4 !important; flex:0 1 calc(100% - 352px) !important; max-width:calc(100% - 352px) !important; align-self:flex-start !important;
  }
}

/* MOBILE: rimetti l'ordine giusto con alta specificità */
@media (max-width:1023.98px){

  /* rendo flessibile la colonna principale per poter usare order */
  body.catalog-product-view .page-main .columns > .column.main{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:16px !important;
  }

  /* 1) Galleria PER PRIMA */
  body.catalog-product-view .page-main .columns > .column.main > .product.media{
    order:1 !important;
  }

  /* 2) Blocco contenuti subito dopo */
  body.catalog-product-view .page-main .columns > .column.main > .product-main-content{
    order:2 !important;
    padding-right:0 !important;  /* niente spazio sidebar in mobile */
  }

  /* ATTENZIONE: il container dei contenuti DEVE essere flex in colonna,
     così order funziona anche per i figli interni */
  body.catalog-product-view .product-main-content{
    display:flex !important;
    flex-direction:column !important;
    gap:16px !important;
    position:static !important;   /* annulla assoluti desktop */
  }

  /* 2a) Titolo/Prezzo/ATC */
  body.catalog-product-view .product-main-content .product-info-main{
    order:1 !important;
  }

  /* 2b) Spedizione & Pagamenti DOPO il main (NON prima) */
  body.catalog-product-view .product-main-content .product-info-content{
    order:3 !important;
  }

  /* 2c) Banner dopo (o nascondi se vuoi) */
  body.catalog-product-view .product-main-content .product-info-left-cms{
    order:4 !important;
    position:static !important;
    width:auto !important;
    max-width:100% !important;
  }

  /* 3) Descrizione/Recensioni per ultime */
  body.catalog-product-view .page-main .columns > .column.main > .product.info.detailed{
    order:5 !important;
  }

  /* Tieni correlati/upsell ancora più in basso */
  body.catalog-product-view .page-main .columns > .column.main > .product-related-contanier,
  body.catalog-product-view .page-main .columns > .column.main > .block.related,
  body.catalog-product-view .page-main .columns > .column.main > .upsell,
  body.catalog-product-view .page-main .columns > .column.main > .block.upsell{
    order:99 !important;
  }
}

@media (min-width:1024px){
  /* metti correlati/upsell DOPO la descrizione, allineati alla colonna sinistra */
  .catalog-product-view .page-main .columns > .column.main > .product-related-contanier,
  .catalog-product-view .page-main .columns > .column.main > .block.related,
  .catalog-product-view .page-main .columns > .column.main > .upsell,
  .catalog-product-view .page-main .columns > .column.main > .block.upsell{
    order: 6;
    flex: 0 1 calc(100% - 352px);
    max-width: calc(100% - 352px);
    align-self: flex-start;
  }
}