/* ==========================================================================
   JTWIA — home 2027 (Elementor): sezioni proprie della home
   Versione 2.1 (22 ottobre 2026) con i componenti condivisi spostati in
   jtwia-components.css il 26 ottobre 2026 (stesse regole, nessun cambio d'aspetto).
   Sorgente storico: export-elementor/jtwia-home.css.

   Qui restano solo le sezioni che appartengono alla home: la manifestazione, ricerca,
   prevenzione, territorio, partner. Dipende da jtwia-components.css (e quindi da
   jtwia-base.css). Testi, immagini, colori, spaziature e sfondi si modificano
   dall'editor. Ogni regola parte da una classe jtwia-.

   Caricato dal tema figlio (functions.php). NON incollarlo anche nel CSS personalizzato
   della pagina né nel CSS aggiuntivo: le regole si duplicherebbero.
   ========================================================================== */

/* Contorno del focus su sfondo scuro, per le sezioni scure della home. */
.jtwia-research, .jtwia-partners { --jtwia-focus: #fff; }

/* ==========================================================================
   La manifestazione
   ========================================================================== */
.jtwia-intro { overflow-x: clip; }
.jtwia-intro__photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.jtwia-section .widget-image-caption { margin-top: 0.6rem; }

/* Elenco con freccia a destra e filetto rosa sopra. */
.jtwia-pillars { border-top: 2px solid var(--jtwia-magenta); }
.jtwia-pillars .elementor-icon-list-item > a {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  width: 100%;
  padding: 0.85rem 0;
  text-decoration: none;
}
.jtwia-pillars .elementor-icon-list-text { flex: 1; padding-left: 0; }
.jtwia-pillars .elementor-icon-list-item > a:hover { color: var(--jtwia-magenta-deep); }

@media (min-width: 1025px) {
  .jtwia-intro__photo img { aspect-ratio: 5 / 4; }
  /* La foto esce dalla griglia verso il bordo destro della pagina. */
  .jtwia-intro__photo .elementor-widget-container { margin-right: calc(-1 * var(--jtwia-gutter)); }
}
@media (min-width: 1312px) {
  .jtwia-intro__photo .elementor-widget-container { margin-right: calc((76rem - 100vw) / 2 + var(--jtwia-gutter)); }
}

/* ==========================================================================
   Ricerca
   ========================================================================== */
/* Un'ulteriore ombra dal basso per tenere leggibile il testo sulla foto. */
.jtwia-research::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(to bottom, rgba(42, 14, 36, 0.15), rgba(42, 14, 36, 0.55));
  pointer-events: none;
}
.jtwia-research > .elementor-container { position: relative; z-index: 1; }
.jtwia-research .jtwia-research__big { text-wrap: balance; }

.jtwia-project { padding-block: 1.1rem; border-bottom: 1px solid rgba(255, 255, 255, 0.45); }
.jtwia-project--first { border-top: 2px solid #fff; }
.jtwia-project p:first-child { font-size: 1.25rem; line-height: 1.3; }
.jtwia-project p:last-child { margin-top: 0.2rem; font-size: 0.9375rem; opacity: 0.9; }

/* ==========================================================================
   Prevenzione
   ========================================================================== */
.jtwia-prevention__photo img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; object-position: 50% 70%; }
.jtwia-item { padding-top: 1.1rem; border-top: 2px solid var(--jtwia-magenta); }
.jtwia-item .elementor-heading-title a:hover { color: var(--jtwia-magenta-deep); text-decoration: underline; }
@media (min-width: 1025px) {
  .jtwia-prevention__photo img { aspect-ratio: 21 / 9; }
}

/* ==========================================================================
   Territorio
   ========================================================================== */
.jtwia-territory__photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 30%; }
.jtwia-territory__figure img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
@media (min-width: 768px) and (max-width: 1024px) {
  .jtwia-territory__photo img { aspect-ratio: 16 / 10; }
}
@media (min-width: 1025px) {
  .jtwia-territory .jtwia-territory__side > .elementor-widget-wrap { align-content: flex-start; }
  .jtwia-territory__photo { position: sticky; top: 6rem; align-self: flex-start; }
}

/* ==========================================================================
   Partner
   ========================================================================== */
/* I quattro file hanno circa il 32% di trasparenza sopra e il 29% sotto, e il segno occupa
   il 39% dell'altezza in tutti. Il riquadro 12:5 ritaglia la banda centrale (il vuoto) e
   si regola con max-width: Elementor imposta width: 100% sull'immagine, quindi il limite
   va messo su max-width. Stessa altezza visibile per tutti = equilibrio ottico. */
.jtwia-logo img {
  max-width: 10rem;
  height: auto;
  aspect-ratio: 12 / 5;
  object-fit: cover;
  object-position: 50% 52%;
}
@media (max-width: 767px) { .jtwia-logo img { max-width: 8.5rem; } }
.jtwia-logos .elementor-column > .elementor-widget-wrap { padding: 0 1rem 1.5rem 0; }