.backgroundtoset{min-height: 100vh;min-height: 100svh;display: flex;align-items: center;justify-content: center;color:#fff;text-align: center;
}

.backgroundtosethalf{aspect-ratio: 3 / 4;overflow: hidden;display: flex;align-items: center;justify-content: center;color:#fff;text-align: center;
}

.bg-base{background-position:center;background-size:cover;background-repeat:no-repeat;
/* fallback */--bg-current: none;
background-image:  linear-gradient(0deg,    rgba(0,0,0,var(--alphagradient_start)) var(--percentgradient_start),    rgba(0,0,0,var(--alphagradient_stop))  var(--percentgradient_stop)  ),  var(--bg-current);
}

.bg-base-shop{background-position:center;background-size:cover;background-repeat:no-repeat;
/* fallback */--bg-current: none;
background-image:  linear-gradient(0deg,    rgba(0,0,0,var(--alphagradient_start)) var(--percentgradient_start),    rgba(0,0,0,var(--alphagradient_stop))  var(--percentgradient_stop)  ),  var(--bg-url);
}

.box-title-shop{font-size:1.2em; font-weight: 500; padding-bottom:0.5rem}
.box-btn-shop{width:90px; border:#fff 1px solid; border-radius: 0;  font-size: 0.9em; color: #fff; background-color: none; display: block; margin: 0 auto 6rem auto}

.mySwiper{--swiper-theme-color: #000; margin-top: 2rem}
/* .swiper-slide{margin-right: 0 !important} */

.mySwiper .swiper-controls{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:12px;
}

/* qui forziamo davvero la pagination a NON occupare 100% */
.mySwiper .swiper-pagination{position: static !important;width: auto !important;flex: 0 0 auto !important;inset: auto !important;     /* reset di top/left/right/bottom */transform: none !important;margin: 0 !important;
}

/* frecce NON più assolute */
.mySwiper .swiper-button-prev,
.mySwiper .swiper-button-next{position: static;        /* IMPORTANTISSIMO */margin:0;width:28px;height:28px;border:1px solid #000;border-radius:0;
}

/* icona freccia più piccola */
.mySwiper .swiper-button-prev::after,
.mySwiper .swiper-button-next::after{font-size:12px;font-weight:700;
}

/* se vuoi anche un filo trasparenti */
.mySwiper .swiper-button-prev,
.mySwiper .swiper-button-next{opacity:.75;
}
.mySwiper .swiper-button-prev:hover,
.mySwiper .swiper-button-next:hover{opacity:1;
}

.blocco-finale{max-width: 600px; margin-top:2rem; margin-left: auto; margin-right: auto}

@media (max-width: 575.98px){ .bg-base{ --bg-current: var(--bg-fit-480); } }
@media (min-width: 576px) and (max-width: 767.98px){ .bg-base{ --bg-current: var(--bg-fit-768); } }
@media (min-width: 768px) and (max-width: 991.98px){ .bg-base{ --bg-current: var(--bg-land-1200); } }
@media (min-width: 992px) and (max-width: 1399.98px){ .bg-base{ --bg-current: var(--bg-land-1920); } }
@media (min-width: 1400px){ .bg-base{ --bg-current: var(--bg-land-2400); } }

/* se vuoi gestire retina per le versioni “fit” */
@media (max-width: 767.98px) and (min-resolution: 2dppx){.bg-base{ --bg-current: var(--bg-fit-1080); }
}
@media (max-width: 767.98px) and (min-resolution: 3dppx){.bg-base{ --bg-current: var(--bg-fit-1320); }
}


.row-dove{margin-top: 2.5rem}

.text-dsc{font-size: 1em}
.text-dsc strong {font-weight: 500}
.text-dsc a{color: var(--colorblack); text-decoration: underline;}

h4{font-size: 1.4em; font-weight: 500}
.container-sector{width: 100%; display: flex; flex-direction: column; }
.text-block{max-width: 100%; margin-top: 2rem; margin-bottom: 2rem; padding-left: 0.5rem; padding-right: 0.5rem}
.block-left{order:2}
.block-right{order:1}

#form-professionisti .col-12 {padding-bottom:0.75rem}
label {font-size: 0.8em;}
.btn-buy,
.btn-buy:hover,
.btn-buy:focus,
.btn-buy:active,
.btn-buy:focus-visible{min-width:200px; border:var(--colorblack) 1px solid; border-radius: 0;  font-size: 1.1em; color: #fff; background-color: var(--colorblack); display: block; margin: .25rem auto .25rem auto}


.field-errore{border-color:#ff0000 !important;}
.div-errore{font-size: 0.8em; color: #ff0000}
#esito{min-height: 2rem}

.copertine{display: flex; flex-wrap: wrap;}
.copertina{
width:100%;
aspect-ratio:4 / 3;
position:relative;
overflow:hidden;
background-image: var(--bg-url);
background-repeat:no-repeat;
background-position:center center;
background-size:cover;
display:flex;
align-items:center;
justify-content:center;
font-size:2em;
font-weight:500;
color:#fff;
transition: transform 0.4s ease;
text-decoration: none !important;
}

.copertina::before{
content:"";
position:absolute;
inset:0;
background:rgba(0,0,0,0.35);
z-index:1;
pointer-events:none;
transition: opacity 0.45s cubic-bezier(0.25, 0.1, 0.25, 1);
  will-change: opacity;
}

.copertina > .text-center{
position:relative;
z-index:2;
}

.btn-map,
.btn-map:hover,
.btn-map:focus,
.btn-map:active,
.btn-map:focus-visible {border:var(--colorblack) 1px solid; background: #fff; border-radius: 0; text-align: center; color: var(--colorblack); font-weight: 500; min-width: 120px}
.map-canvas{width: 100%; min-height: 600px}

@media (hover: hover) and (pointer: fine) {
  .copertina:hover::before {
    opacity: 0.2;
  }

}


@media (min-width: 768px){ .text-dsc{font-size: 1.1em}h4{font-size: 1.6em}.div-errore{font-size: 0.9em; color: #ff0000}.copertina{width:50%;} .row-dove{margin-top: 2rem}
}
@media (min-width: 992px){.container-sector{width: 100%; display: flex; flex-direction: row;}.container-block{width:50%}.text-block{max-width: 80%}.container-block-text{display: flex; align-items: center; justify-content: center}.block-left{order:1}.block-right{order:2}
}

@media (min-width: 1200px){.text-dsc{font-size: 1.2em}h4{font-size: 1.8em}.text-block{max-width: 60%}.copertina{width:25%;}
}

.picture{width: 100%; aspect-ratio: 3/4}