/* Pagina Contatti: canali diretti, sedi e richiesta guidata. */
.contact-page .company-hero h1 {max-width: 10.5ch}
.contact-hero-panel {display: flex; flex-direction: column; justify-content: center; padding: clamp(1.5rem, 5vw, 5rem); background: var(--color-ink); color: var(--color-surface)}
.contact-panel-title {max-width: 22ch; margin: 0 0 clamp(1rem, 3vw, 2.5rem); font-family: var(--font-serif); font-size: clamp(1.75rem, 3.3vw, 3.25rem); font-weight: 700; line-height: 1.05; text-wrap: balance}
.contact-channel {position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .25rem 1rem; align-items: end; padding-block: clamp(1rem, 2.2vw, 1.6rem); border-top: 1px solid var(--color-border-contact); color: inherit; transition: color .25s ease, transform .35s cubic-bezier(.16, 1, .3, 1)}
.contact-channel:last-child {border-bottom: 1px solid var(--color-border-contact)}
.contact-channel span {grid-column: 1; color: var(--color-text-on-dark-muted); font-size: .95rem}
.contact-channel strong {grid-column: 1; min-width: 0; overflow-wrap: anywhere; font-size: clamp(1.2rem, 2.2vw, 1.75rem); line-height: 1.2}
.contact-channel i {grid-column: 2; grid-row: 1 / 3; align-self: center; font-style: normal; font-size: 1.5rem; transition: transform .35s cubic-bezier(.16, 1, .3, 1)}
.contact-channel:hover {color: var(--color-surface-pure); transform: translateX(.35rem)}
.contact-channel:hover i {transform: translate(.25rem, -.25rem)}
.contact-location-list {border-top: 1px solid var(--company-rule)}
.contact-location {display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: 1rem; padding-block: clamp(1.5rem, 3vw, 2.5rem); border-bottom: 1px solid var(--company-rule)}
.contact-location-number {padding-top: .3rem; color: var(--color-brand-red); font-weight: 700; font-variant-numeric: tabular-nums}
.contact-location h3 {font-size: clamp(1.6rem, 3vw, 2.7rem)}
.contact-location p {margin-top: .35rem; color: var(--color-text-muted); font-size: 1.05rem; line-height: 1.5}
.contact-location-actions {grid-column: 2; display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; align-items: center}
.contact-location-actions a {display: inline-flex; align-items: center; min-height: 44px; border-bottom: 1px solid currentColor; color: var(--color-ink); font-weight: 700; transition: color .2s ease, transform .3s cubic-bezier(.16, 1, .3, 1)}
.contact-location-actions a:hover {color: var(--color-brand-red); transform: translateX(.25rem)}
.contact-page .company-source-note {margin-top: 2rem}

@media (min-width: 700px) {
  .contact-location {grid-template-columns: 3rem minmax(14rem, .8fr) minmax(0, 1.2fr); align-items: center; gap: clamp(1.5rem, 4vw, 4rem)}
  .contact-location-actions {grid-column: 3; justify-content: flex-end}
}

@media (max-width: 699px) {
  .contact-page .company-hero h1 {font-size: clamp(2.65rem, 11vw, 3.6rem)}
  .contact-hero .company-hero-inner {grid-template-rows: auto auto}
  .contact-hero .company-hero-copy {padding-bottom: clamp(3rem, 12vw, 4.5rem)}
  .contact-hero .company-hero-cta {margin-bottom: .25rem}
  .contact-hero-panel {min-height: 19rem; margin-inline: calc(var(--gutter) * -1)}
  .contact-panel-title {font-size: 1.65rem}
  .contact-channel {padding-block: .9rem}
  .contact-channel strong {font-size: 1.1rem}
}

@media (max-width: 699px) and (max-height: 720px) {
  .contact-hero .company-hero-inner {grid-template-rows: auto auto}
  .contact-hero-panel {min-height: 17rem}
}

@media (prefers-reduced-motion: reduce) {
  .contact-channel, .contact-channel i, .contact-location-actions a {transition: none}
}
