/* Footer a gruppi (1.3.6): riga alta (marchio, slogan, indirizzo, social), quattro gruppi su tutta la larghezza, copyright.
   Tutto e' limitato a footer.footer--groups: il footer senza gruppi non cambia. Colori e caratteri: quelli del sito (--rays, --sun, --shell, --black). */
footer.footer--groups {
  --f-line: rgba(133, 122, 74, 0.35);
}
footer.footer--groups #footer {
  display: block;
}

/* ---- riga alta ---- */
footer.footer--groups .footer-top {
  display: flex;
  align-items: center;
  padding-bottom: 48px;
}
footer.footer--groups .footer-brand {
  position: relative;
  flex: none;
  width: 260px;
  height: 110px;
  margin-right: 48px;
  border-right: 1px solid var(--f-line);
}
footer.footer--groups .fb-wave,
footer.footer--groups .fb-sun {
  position: absolute;
  display: block;
}
footer.footer--groups .fb-wave {
  left: 0;
  bottom: 0;
  width: 200px;
  aspect-ratio: 2.7;
}
footer.footer--groups .fb-wave .wave {
  top: 0;
  left: 0;
  right: auto;
  bottom: auto;
  width: 100%;
}
footer.footer--groups .fb-sun {
  right: 48px;
  top: 8px;
  width: 52px;
  aspect-ratio: 1;
}
footer.footer--groups .fb-sun .sun {
  top: 0;
  left: 0;
  width: 100%;
}
footer.footer--groups .footer-tagline {
  flex: 0 1 340px;
  margin-right: auto;
  padding-right: 32px;
}
footer.footer--groups .footer-tagline h6 {
  margin: 0;
  color: var(--black);
}
footer.footer--groups .footer-tagline h6:first-child {
  color: var(--shell);
}
footer.footer--groups address.footer-address {
  width: auto;
  margin: 0 56px 0 0;
}
footer.footer--groups .footer-address div {
  margin: 0;
}
footer.footer--groups .footer-address > div > p {
  position: relative;
  margin: 0 0 12px;
  padding-left: 36px;
  color: var(--black);
}
footer.footer--groups .footer-address > div > p::before,
footer.footer--groups .footer-group a[href^="tel:"] p::before,
footer.footer--groups .footer-group a[href^="mailto:"] p::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.1em;
  width: 20px;
  height: 20px;
  background: var(--shell);
  -webkit-mask: var(--f-icon) center / contain no-repeat;
  mask: var(--f-icon) center / contain no-repeat;
}
footer.footer--groups .footer-address > div > p {
  --f-icon: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'><path d='M12 21s7-6.2 7-11.5A7 7 0 0 0 5 9.5C5 14.8 12 21 12 21z'/><circle cx='12' cy='9.5' r='2.4'/></svg>");
}
footer.footer--groups .footer-address .el {
  display: block;
  padding-left: 36px;
}
footer.footer--groups .footer-social {
  display: flex;
  align-items: center;
  gap: 20px;
  align-self: stretch;
  padding-left: 56px;
  border-left: 1px solid var(--f-line);
  font-size: 0;
}
footer.footer--groups .footer-soc {
  display: block;
  width: 52px;
  height: 52px;
  background: var(--shell);
  -webkit-mask: var(--soc-icon, none) center / contain no-repeat;
  mask: var(--soc-icon, none) center / contain no-repeat;
  transition: background-color 0.3s ease-out;
}
footer.footer--groups .footer-soc:hover,
footer.footer--groups .footer-soc:focus-visible {
  background: var(--sun);
}

/* ---- quattro gruppi ---- */
footer.footer--groups .footer-groups {
  display: grid;
  grid-template-columns: repeat(4, auto);
  justify-content: space-between;
  column-gap: 40px;
  row-gap: 40px;
  padding: 48px 0;
  border-top: 1px solid var(--f-line);
}
footer.footer--groups .footer-group {
  width: auto;
  min-width: 0;
}
footer.footer--groups .footer-group .title {
  white-space: nowrap;
  margin-bottom: 28px;
}
footer.footer--groups .footer-group li a {
  overflow-wrap: anywhere;
}
footer.footer--groups .footer-group li + li a p {
  margin: 0 0 14px;
}
footer.footer--groups .footer-group a[href^="tel:"] p,
footer.footer--groups .footer-group a[href^="mailto:"] p {
  position: relative;
  padding-left: 36px;
}
footer.footer--groups .footer-group a[href^="tel:"] p {
  --f-icon: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'><path d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z'/></svg>");
}
footer.footer--groups .footer-group a[href^="mailto:"] p {
  --f-icon: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'><rect x='3' y='5' width='18' height='14' rx='2'/><path d='M3 7l9 6 9-6'/></svg>");
}

/* ---- copyright ---- */
footer.footer--groups .footer-copy {
  margin: 0;
  padding-top: 32px;
  border-top: 1px solid var(--f-line);
}

/* ---- tablet ---- */
@media screen and (max-width: 1199px) {
  footer.footer--groups .footer-top {
    flex-wrap: wrap;
    row-gap: 32px;
  }
  footer.footer--groups .footer-brand {
    margin-right: 32px;
  }
  footer.footer--groups .footer-tagline {
    flex: 1 1 240px;
    margin-right: 0;
  }
  footer.footer--groups address.footer-address {
    margin-right: 40px;
  }
  footer.footer--groups .footer-social {
    padding-left: 40px;
  }
  footer.footer--groups .footer-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-content: stretch;
  }
}
/* ---- mobile ---- */
@media screen and (max-width: 575px) {
  footer.footer--groups .footer-group .title {
    white-space: normal;
    min-height: 3.2em;
    margin-bottom: 16px;
  }
  footer.footer--groups .footer-top {
    flex-direction: column;
    align-items: flex-start;
  }
  footer.footer--groups .footer-brand {
    width: 100%;
    max-width: 260px;
    margin-right: 0;
    border-right: 0;
  }
  footer.footer--groups .footer-tagline {
    flex: none;
    padding-right: 0;
  }
  footer.footer--groups address.footer-address {
    margin-right: 0;
  }
  footer.footer--groups .footer-social {
    padding-left: 0;
    border-left: 0;
  }
  footer.footer--groups .footer-groups {
    column-gap: 20px;
  }
}