/* ==========================================================================
   SuperEasyWeb — pagine/chi-siamo.css (rilancio 28/09/2026)
   Solo composizione: hero ridotto, anteprima, quattro ruoli, nastro. Niente bolle o avvisi.
   ========================================================================== */

/* hero interno: display ridotto (≤ 96 px), tile più bassa dell'hero della home */
.hero-interna { min-height: clamp(420px, 56vh, 580px); }
.hero-interna .t-hero { font-size: clamp(48px, 7vw, 96px); max-width: 14ch; }
.hero-interna > .pillola { align-self: flex-start; }
@media (max-width: 767px) { .hero-interna { min-height: 0; } .hero-interna .hero__azioni { margin-bottom: 40px; } }
@media (min-width: 768px) {
  .hero-interna .linguetta--bd { max-width: min(44ch, 46%); }
  .hero-interna .hero__azioni { max-width: 50%; }
}

/* anteprima nella tile cielo */
.anteprima { display: flex; flex-direction: column; justify-content: center; }
.anteprima__corpo { padding: 14px; background: var(--sfondo); }
.anteprima__corpo .mockup { margin-inline: auto; }
.anteprima .mockup--finestra { aspect-ratio: 4 / 3.4; }

/* chi ci lavora: quattro riquadri bianchi, 4 → 2 → 1 colonne */
.ruoli { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); }
.ruolo { padding: clamp(20px, 2.2vw, 28px); border-radius: var(--r-in); background: var(--carta); }
.ruolo p:not(.t-h3) { font-size: 16px; line-height: 1.45; }
.ruolo__n {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--ink); color: var(--carta);
  font-family: var(--f-display); font-weight: 800; font-size: 18px; line-height: 1;
}
@media (max-width: 1023px) { .ruoli { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .ruoli { grid-template-columns: 1fr; } }

/* nastro dei mestieri */
.nastro-tile { padding-block: 26px; }

/* cta finale */
.cta-finale { padding-block: clamp(40px, 6vw, 88px); }