/* Millevini: header, footer e titoli pagina */

#sp-header {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 90px !important;

  background: transparent !important;

  border-bottom: 1px solid #fff;

  box-shadow: none;

  z-index: 1000;

}

#sp-header.header-sticky {

  position: fixed;

  background: #8f1440 !important;

}

#sp-header > .container, #sp-header > .container-fluid,

#sp-header .row, #sp-header .logo, #sp-header .sp-column {

  min-height: 90px;

}

#sp-header .logo { display: flex; align-items: center; }

#sp-header .sp-megamenu-parent > li > a,

#sp-header .sp-megamenu-parent > li > span {

  color: #fff !important;

  line-height: 89px !important;

}

#sp-header .social-icons a, #sp-header #offcanvas-toggler {

  color: #fff !important;

}

#sp-header #offcanvas-toggler { height: 90px; line-height: 90px; }

#sp-header .burger-icon > span { background-color: #fff !important; }

#sp-header .social-icons { line-height: 89px; }

#sp-header.header-sticky .logo-default { display: none !important; }

#sp-header.header-sticky .logo-sticky { display: inline-block !important; }

#sp-bottom, #sp-footer {

  background: #8f1440 !important;

  color: #fff !important;

}

#sp-bottom h1, #sp-bottom h2, #sp-bottom h3,

#sp-bottom h4, #sp-bottom h5, #sp-bottom h6,

#sp-bottom a, #sp-footer a, #sp-footer .sp-copyright {

  color: #fff !important;

}

/* Trasparenza: 0% in alto, 100% in basso. */

.sp-page-title {

  position: relative;

  isolation: isolate;

  min-height: 400px;

  box-sizing: border-box;

  display: flex;

  align-items: center;

  padding: 90px 0;

  background-repeat: no-repeat !important;

  background-size: cover !important;

  background-position: center center;

}

.sp-page-title::before {

  content: "";

  position: absolute;

  inset: 0;

  z-index: -1;

  pointer-events: none;

  background: linear-gradient(to bottom, rgba(143,20,64,1) 0%, rgba(143,20,64,0) 100%);

}

.sp-page-title > .container { width: 100%; }



/* Mantiene logo e navigazione nella stessa fascia da 90px. */

#sp-header .row { flex-wrap: nowrap; }

#sp-header #sp-logo { flex: 0 0 auto; width: auto; }

#sp-header .logo img { width: 220px; max-width: 100%; height: auto; max-height: 36px; }

#sp-header #sp-menu { flex: 1 1 0; width: 0; min-width: 0; }

#sp-header .sp-megamenu-parent > li > a { padding-left: 12px; padding-right: 12px; }

@media (max-width: 991.98px) {

  #sp-header .social-wrap { display: none !important; }

}

@media (max-width: 575.98px) {

  #sp-header .logo img { width: 180px; }

}



#sp-bottom table, #sp-bottom th, #sp-bottom td,

#sp-footer table, #sp-footer th, #sp-footer td {

  color: #fff !important;

  --bs-table-color: #fff;

  --bs-table-striped-color: #fff;

  --bs-table-hover-color: #fff;

  --bs-table-bg: transparent;

}



/* Logo nelle dimensioni precedenti, spostato di 10px in basso. */

#sp-header .logo a { display: flex; align-items: center; max-width: 100%; transform: none; }

@media (max-width: 991.98px) {

  #sp-header #sp-logo { flex: 0 1 auto; min-width: 0; max-width: calc(100% - 60px); }

  #sp-header #sp-menu { flex: 1 0 48px; min-width: 48px; }

}





#sp-header .sp-megamenu-parent { white-space: nowrap; }



/* Altezza naturale del logo standard: nessuna deformazione. */

#sp-header .logo img.logo-default { height: auto; max-height: none; object-fit: contain; }



/* Spostamento riservato al logo non sticky. */

#sp-header:not(.header-sticky) .logo a { transform: translateY(10px); }

#sp-header.header-sticky .logo a { transform: none; }

.sp-page-title .sp-page-title-heading {
    margin-top: 50px!important;
     
}
.sp-page-title .sp-page-title-sub-heading {
    font-size: 24px;
 
}
@media (max-width: 600px) {
.sp-page-title .sp-page-title-sub-heading {
    font-size: 16px;
 
}

}
@media (min-width: 600px) {
.sp-page-title .sp-page-title-heading {
    font-size: 60px!important;
     
}

}

/* Menu laterale mobile: palette Millevini. */
.offcanvas-menu { background: #8f1440 !important; color: #fff !important; }
.offcanvas-menu a, .offcanvas-menu span, .offcanvas-menu p, .offcanvas-menu h1, .offcanvas-menu h2, .offcanvas-menu h3, .offcanvas-menu .menu-toggler, .offcanvas-menu .close-offcanvas { color: #fff !important; }
.offcanvas-menu .close-offcanvas::before, .offcanvas-menu .close-offcanvas::after { background: #fff !important; }
@keyframes audioWave { 
  25% { background: linear-gradient(#8f1440, #8f1440) 0px 50% / 0.5em 2em no-repeat, linear-gradient(#8f1440, #8f1440) 0.625em 50% / 0.5em 0.25em, linear-gradient(#8f1440, #8f1440) 1.25em 50% / 0.5em 0.25em, linear-gradient(#8f1440, #8f1440) 1.875em 50% / 0.5em 0.25em, linear-gradient(#8f1440, #8f1440) 2.5em 50% / 0.5em 0.25em; }
  37.5% { background: linear-gradient(#8f1440, #8f1440) 0px 50% / 0.5em 0.25em no-repeat, linear-gradient(#8f1440, #8f1440) 0.625em 50% / 0.5em 2em, linear-gradient(#8f1440, #8f1440) 1.25em 50% / 0.5em 0.25em, linear-gradient(#8f1440, #8f1440) 1.875em 50% / 0.5em 0.25em, linear-gradient(#8f1440, #8f1440) 2.5em 50% / 0.5em 0.25em; }
  50% { background: linear-gradient(#8f1440, #8f1440) 0px 50% / 0.5em 0.25em no-repeat, linear-gradient(#8f1440, #8f1440) 0.625em 50% / 0.5em 0.25em, linear-gradient(#8f1440, #8f1440) 1.25em 50% / 0.5em 2em, linear-gradient(#8f1440, #8f1440) 1.875em 50% / 0.5em 0.25em, linear-gradient(#8f1440, #8f1440) 2.5em 50% / 0.5em 0.25em; }
  62.5% { background: linear-gradient(#8f1440, #8f1440) 0px 50% / 0.5em 0.25em no-repeat, linear-gradient(#8f1440, #8f1440) 0.625em 50% / 0.5em 0.25em, linear-gradient(#8f1440, #8f1440) 1.25em 50% / 0.5em 0.25em, linear-gradient(#8f1440, #8f1440) 1.875em 50% / 0.5em 2em, linear-gradient(#8f1440, #8f1440) 2.5em 50% / 0.5em 0.25em; }
  75% { background: linear-gradient(#8f1440, #8f1440) 0px 50% / 0.5em 0.25em no-repeat, linear-gradient(#8f1440, #8f1440) 0.625em 50% / 0.5em 0.25em, linear-gradient(#8f1440, #8f1440) 1.25em 50% / 0.5em 0.25em, linear-gradient(#8f1440, #8f1440) 1.875em 50% / 0.5em 0.25em, linear-gradient(#8f1440, #8f1440) 2.5em 50% / 0.5em 2em; }
}

.offcanvas-menu .burger-icon > span { background-color: #fff !important; }

/* Orari: righe a scheda, colori Millevini e lettura mobile. */
table.orari {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 8px;
  margin: 0;
  --bs-table-bg: transparent;
  --bs-table-hover-bg: transparent;
  --bs-table-accent-bg: transparent;
}
table.orari > tbody > tr > td {
  padding: 15px 18px;
  border: 0;
  background: #faf5f3;
  color: #38272d;
  vertical-align: middle;
  box-shadow: none;
  font-size: 15px;
  line-height: 1.5;
  font-variant-numeric: tabular-nums;
  transition: background-color .2s ease;
}
table.orari td:first-child {
  border-radius: 8px 0 0 8px;
  font-weight: 700;
  color: #8f1440;
  border-left: 3px solid #8f1440;
}
table.orari td:last-child { border-radius: 0 8px 8px 0; }
table.orari tr:hover > td { background: #f1e4e7; }
#sp-component table.orari td:nth-child(3) { display: none; }
#sp-component table.orari tr:last-child > td { background: #f1e4e7; }
#sp-bottom table.orari > tbody > tr > td {
  background: rgba(255,255,255,.08);
  color: #fff !important;
  padding: 17px 18px;
}
#sp-bottom table.orari td:first-child { border-left-color: rgba(255,255,255,.65); }
#sp-bottom table.orari tr:hover > td { background: rgba(255,255,255,.14); }
#sp-bottom table.orari td span { font-size: 15px !important; }
@media (max-width: 575.98px) {
  table.orari, table.orari tbody { display: block; }
  table.orari tr {
    display: grid;
    grid-template-columns: minmax(95px, .85fr) minmax(0, 1.15fr);
    margin: 0 0 10px;
    background: #faf5f3;
    border-radius: 8px;
    overflow: hidden;
    border-left: 3px solid #8f1440;
  }
  table.orari > tbody > tr > td,
  #sp-bottom table.orari > tbody > tr > td { padding: 10px 12px; border: 0; border-radius: 0; background: transparent; }
  table.orari td:first-child { grid-column: 1; grid-row: 1 / span 2; align-self: center; }
  table.orari td:not(:first-child) { grid-column: 2; }
  #sp-component table.orari tr:last-child > td { background: transparent; }
  #sp-component table.orari tr:last-child { background: #f1e4e7; }
  #sp-component table.orari tr:last-child td:last-child { display: none; }
  #sp-bottom table.orari tr { background: rgba(255,255,255,.08); border-left-color: rgba(255,255,255,.65); }
  #sp-bottom table.orari tr:hover > td { background: transparent; }
}
