/* Integrazione nel layout del sito. Caricare dopo corpo.css e saldi_autunno_2026.css. */
.sa26-page #corpo_centrale_colonna_dx { min-width: 0; }
.sa26-page .sa26-site-home { font-size: 18px; }
.sa26-page .sa26-site-breadcrumb-arrow { margin-left: 5px; margin-right: 5px; }
.sa26-host { width: 100%; min-width: 0; container-type: inline-size; container-name: sa26layout; }
.sa26-legacy-anchor { display: block; height: 0; }
.sa26-host .sa26 { min-width: 0; }
.sa26-host .sa26-wrap { width: 100%; max-width: 1320px; padding-left: 28px; padding-right: 28px; }
.sa26-host .sa26-hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1.03fr); min-height: 480px; }
.sa26-host .sa26-hero-copy { min-width: 0; padding: 42px 32px; }
.sa26-host .sa26-hero h1 { font-size: 48px; font-size: clamp(36px, 4.8cqw, 62px); overflow-wrap: break-word; }
.sa26-host .sa26-hero-media { min-height: 370px; }
.sa26-host .sa26-hero-media > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sa26-host .sa26-hero-caption { flex-wrap: wrap; gap: 5px 14px; }
.sa26-host .sa26-hero-caption span:first-child { font-size: 22px; }
.sa26-host .sa26-section-head { flex-wrap: wrap; }
.sa26-host .sa26-categories { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sa26-host .sa26-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sa26-host .sa26-info-grid, .sa26-host .sa26-faq-grid { gap: 36px; }
.sa26-host .sa26-help { flex-wrap: wrap; }
.sa26-host .sa26-reason { padding-inline: 12px; }

/* Adattamento alla larghezza della colonna, anche su schermi desktop. */
@container sa26layout (min-width: 1120px) {
  .sa26-host .sa26-categories { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .sa26-host .sa26-product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@container sa26layout (max-width: 850px) {
  .sa26-host .sa26-hero { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .sa26-host .sa26-hero h1 { font-size: clamp(36px, 7.2cqw, 58px); }
  .sa26-host .sa26-hero-copy { padding: 38px 28px; }
  .sa26-host .sa26-hero-lead { max-width: 570px; }
  .sa26-host .sa26-hero-media { height: 300px; min-height: 0; }
  .sa26-host .sa26-reasons-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .sa26-host .sa26-reason { justify-content: flex-start; padding-inline: 0; }
  .sa26-host .sa26-reason + .sa26-reason { border-left: 0; }
  .sa26-host .sa26-info-grid, .sa26-host .sa26-faq-grid { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .sa26-host .sa26-section { padding-top: 44px; padding-bottom: 44px; }
  .sa26-host .sa26-contact-section { padding-top: 0; padding-bottom: 0; }
}
@container sa26layout (max-width: 600px) {
  .sa26-host .sa26-wrap { padding-left: 20px; padding-right: 20px; }
  .sa26-host .sa26-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sa26-host .sa26-category { flex-direction: row; text-align: left; padding: 17px 12px; gap: 10px; }
  .sa26-host .sa26-category svg { width: 26px; height: 26px; }
  .sa26-host .sa26-category strong { font-size: 14px; }
  .sa26-host .sa26-section-head { align-items: flex-start; flex-direction: column; gap: 14px; }
  .sa26-host .sa26-help { padding: 28px 24px; flex-direction: column; align-items: flex-start; }
}
@container sa26layout (max-width: 530px) {
  .sa26-host .sa26-product-grid { grid-template-columns: minmax(0, 1fr); }
  .sa26-host .sa26-hero-copy { padding: 34px 22px; }
  .sa26-host .sa26-hero-media { height: 250px; }
}

/* Fallback per i browser che non supportano le container query. */
@media (max-width: 700px) {
  .sa26-host .sa26-wrap { padding-left: 20px; padding-right: 20px; }
  .sa26-host .sa26-hero { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .sa26-host .sa26-hero-copy { padding: 34px 22px; }
  .sa26-host .sa26-hero h1 { font-size: clamp(36px, 10vw, 56px); }
  .sa26-host .sa26-hero-media { height: 250px; min-height: 0; }
  .sa26-host .sa26-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sa26-host .sa26-info-grid, .sa26-host .sa26-faq-grid { grid-template-columns: minmax(0, 1fr); }
  .sa26-host .sa26-help { padding: 28px 24px; }
}
@media (max-width: 530px) {
  .sa26-host .sa26-product-grid { grid-template-columns: minmax(0, 1fr); }
}

/* Banner e fasce colorate fino ai bordi */
.sa26-page #corpo_centrale_colonna_dx > #volantino.sa26-host {
  width: calc(100% + 60px);
  max-width: none;
  margin-left: -30px;
  margin-right: -30px;
}