/**
 * Pagina argomento — sfondi e card più leggibili.
 * Canvas muted continuo sotto le sezioni; card bianche con bordo leggero.
 */

body.tax-argomento #main-container {
  --siagid-argomento-surface: #ebeef0;
  --siagid-argomento-card: #fff;
  --siagid-argomento-border: color-mix(in srgb, var(--bs-primary, #06c) 14%, #cfd5da);
  --siagid-argomento-shadow: 0 0.35rem 1rem rgba(17, 24, 39, 0.07);
}

body.tax-argomento #main-container > section > [class*="pt-40"],
body.tax-argomento #main-container > section > .bg-grey-card {
  background-color: var(--siagid-argomento-surface);
}

body.tax-argomento #main-container > section .it-card {
  background-color: var(--siagid-argomento-card);
  border: 1px solid var(--siagid-argomento-border);
  box-shadow: var(--siagid-argomento-shadow);
}

body.tax-argomento #main-container > section .it-card.it-card-banner,
body.tax-argomento #main-container > section .it-card.bg-primary {
  border-color: transparent;
}

body.tax-argomento #main-container > section .row-title h3 {
  color: #1a1a1a;
  border-color: color-mix(in srgb, var(--bs-primary, #06c) 28%, #c5cdd3) !important;
  margin-bottom: 0;
}

/* Padding sul wrapper: spazio DOPO la linea (il margin sull'h3 collassa nel row). */
body.tax-argomento #main-container > section .row-title > .col-12 {
  padding-bottom: 1.75rem !important;
}

@media (min-width: 992px) {
  body.tax-argomento #main-container > section .row-title > .col-12 {
    padding-bottom: 2.25rem !important;
  }
}

body.tax-argomento #main-container > section .it-card-title a,
body.tax-argomento #main-container > section .it-card-profile-name a {
  text-decoration: none;
}

@media (hover: hover) and (pointer: fine) {
  body.tax-argomento #main-container > section .it-card:hover {
    box-shadow: 0 0.55rem 1.35rem rgba(17, 24, 39, 0.1);
    transform: translateY(-2px);
    transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 180ms cubic-bezier(0.16, 1, 0.3, 1);
  }
}

body.tax-argomento #main-container > section .it-card:has(a:focus-visible) {
  outline: 2px solid var(--bs-primary, #06c);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  body.tax-argomento #main-container > section .it-card:hover {
    transform: none;
  }
}

@media print {
  body.tax-argomento #main-container > section > [class*="pt-40"],
  body.tax-argomento #main-container > section > .bg-grey-card {
    background: #fff !important;
  }

  body.tax-argomento #main-container > section .it-card {
    box-shadow: none !important;
    border: 1px solid #ccc !important;
  }
}
