/* Seamless editorial intro: text first, wide imagery below, no card or sage panel. */
html body header.tbp-page-hero {
  box-sizing: border-box;
  display: block;
  width: 100%;
  margin: 0 0 24px;
  padding: 8px 0 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  text-align: start;
}
html body .tbp-page-hero__copy { min-width: 0; }
html body .tbp-page-hero .tbp-page-hero__title {
  margin: 0;
  padding: 0;
  color: #084828;
  font-family: inherit;
  font-size: clamp(28px, 3.2vw, 40px);
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -.035em;
  text-transform: none;
  text-align: center;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
html body .tbp-page-hero .tbp-page-hero__description {
  max-width: 85ch;
  margin: 12px auto 0;
  padding: 0;
  color: #486454;
  font-family: inherit;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.45;
  text-wrap: pretty;
  text-align: start;
  text-align-last: start;
  hyphens: none;
}
html body .tbp-page-hero__visual {
  display: block;
  width: 100%;
  height: 240px;
  margin: 20px 0 0;
  overflow: hidden;
  border-radius: 20px;
  background: transparent;
}
html body .tbp-page-hero__visual img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: cover;
  object-position: center;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: inherit;
  box-shadow: none;
  filter: none;
}
html body header.tbp-page-hero--home,
html body header.tbp-page-hero--map {
  width: min(1160px, calc(100% - 24px));
  margin: 8px auto 24px;
}
/* Keep the activity/people in the panorama's crop rather than the empty background. */
html body .tbp-page-hero__visual--mestieri img { object-position: 50% 65%; }
html body .tbp-page-hero__visual--insieme img { object-position: 50% 30%; }
html body .tbp-page-hero__visual--panettiere img { object-position: 50% 35%; }
html body .tbp-home-feed > .tbp-home-feed__back { margin: 0 12px 12px; }
@media (max-width: 599px) {
  html body header.tbp-page-hero {
    padding: 4px 0 0;
    margin-bottom: 20px;
  }
  html body .tbp-page-hero .tbp-page-hero__title {
    font-size: 26px;
  }
  html body .tbp-page-hero .tbp-page-hero__description {
    margin: 12px 0 0;
    font-size: 14px;
    line-height: 1.4;
  }
  html body .tbp-page-hero__visual { height: 112px; margin-top: 16px; border-radius: 16px; }
}
/* Map owns the remaining viewport: keep its compact intro in the existing first grid row. */
@media (max-width: 849px) {
  html body header.tbp-page-hero--map {
    margin: 4px auto 12px;
    padding: 0;
  }
  html body .tbp-page-hero--map .tbp-page-hero__title { font-size: 26px; }
  html body .tbp-page-hero--map .tbp-page-hero__description { font-size: 13px; margin-top: 8px; }
  html body .tbp-page-hero--map .tbp-page-hero__visual { height: 80px; margin-top: 12px; }
}

/* Cerca: testata come quella del Catalogo (Elind, 19/9). Niente foto, titolo
   e frase allineati a sinistra con le stesse misure di .tbp-catalogo-header,
   e subito sotto i filtri. */
html body .tbp-page-hero.tbp-page-hero--search {
  max-width: 1160px;
  margin: 0 auto 14px;
  padding: 12px 4px 0;
  text-align: left;
}
html body .tbp-page-hero.tbp-page-hero--search .tbp-page-hero__title {
  margin: 0 0 6px;
  font-size: clamp(26px, 2.5vw, 32px);
  line-height: 1.15;
  letter-spacing: -.5px;
  text-align: left;
  text-wrap: balance;
}
html body .tbp-page-hero.tbp-page-hero--search .tbp-page-hero__description {
  max-width: 60ch;
  margin: 0;
  padding: 0;
  color: #536d60;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.45;
  text-align: left;
  text-align-last: left;
  text-wrap: pretty;
}
html[data-tbp-theme="dark"] body .tbp-page-hero.tbp-page-hero--search .tbp-page-hero__description { color: var(--tbp-night-muted, #b5b5b5); }

/* Schermate vere del sito al posto delle illustrazioni (CEO, 1/10, kit foto-tema-1-10).
   Una versione per tema: si vede solo quella del tema in uso, le altre non si scaricano
   (display:none + loading="lazy"). Senza attributo di tema vale la chiara. */
html body .tbp-page-hero__visual--sito { position: relative; }
html body .tbp-page-hero__visual--sito .tbp-page-hero__tema { display: none; width: 100%; height: 100%; }
html body .tbp-page-hero__visual--sito .tbp-page-hero__tema--light,
html[data-tbp-theme="dark"] body .tbp-page-hero__visual--sito .tbp-page-hero__tema--dark,
html[data-tbp-theme="tobepolo"] body .tbp-page-hero__visual--sito .tbp-page-hero__tema--tobepolo { display: block; }
html[data-tbp-theme="dark"] body .tbp-page-hero__visual--sito .tbp-page-hero__tema--light,
html[data-tbp-theme="tobepolo"] body .tbp-page-hero__visual--sito .tbp-page-hero__tema--light { display: none; }
/* Mai tagliare un telefono: l'immagine sta tutta nella fascia, appoggiata al bordo basso
   (i telefoni escono dal fondo), e lo spazio che avanza ha lo stesso colore del suo fondo. */
html body .tbp-page-hero__visual--sito { background: #F4F7F5; }
html[data-tbp-theme="dark"] body .tbp-page-hero__visual--sito { background: #1E1E1E; }
html[data-tbp-theme="tobepolo"] body .tbp-page-hero__visual--sito { background: #F7F4ED; }
html body .tbp-page-hero__visual--sito img { object-fit: contain; object-position: 50% 100%; border-radius: 0; }
@media (max-width: 599px) {
  /* 160 px invece di 112: a 112 dei tre telefoni si vedrebbe solo l'intestazione. */
  html body .tbp-page-hero__visual--sito { height: 160px; }
}