/* Catalogo ECU (/ecu/*) sul tenant — tema scuro coerente con il sito (Fase 2, passo 2).
   Il documento ECU e' autonomo: carica solo questo foglio, header-premium e mobile-menu-premium.
   Il rosso viene dai token --color-primary-* (rampa del tenant); il testo rosso usa la tinta 400. */
body:has(> main.ecu-main){
  --e-bg:#0b0b0c;--e-surface:#141417;--e-card:#18181c;--e-line:rgba(255,255,255,.10);
  --e-text:#f5f5f6;--e-muted:rgba(255,255,255,.72);--e-subtle:rgba(255,255,255,.55);
  background:var(--e-bg);color:var(--e-text);
  font-family:'DM Sans','Inter',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  margin:0;
}
body:has(> main.ecu-main) .ecu-main{
  font-family:inherit;color:var(--e-text);line-height:1.6;padding:0 0 32px;
  --rosso:var(--color-primary-500,#c7081b);--bg:var(--e-bg);--bd:var(--e-line);
}
.ecu-main a{color:var(--color-primary-400,#dc5060)}
.ecu-main a:hover{text-decoration:underline;text-underline-offset:3px}
.ecu-main :focus-visible{outline:3px solid var(--color-primary-400,#dc5060);outline-offset:3px;border-radius:4px}
/* Hero: niente fascia grigia a tutta larghezza, titolo semplice */
.ecu-main .hero{background:none;border-bottom:1px solid var(--e-line);padding:40px 0 28px;margin:0}
.ecu-main .hero h1{font-size:clamp(1.75rem,3.6vw,2.5rem);line-height:1.15;font-weight:700;letter-spacing:-0.01em;color:#fff;margin:0 0 8px}
.ecu-main .hero p{color:var(--e-muted);font-size:1rem}
.ecu-main .bc{color:var(--e-subtle);font-size:.875rem;padding:16px 0 4px}
.ecu-main .bc a{color:var(--e-muted)}
/* Card e griglie */
.ecu-main .card{background:var(--e-surface);border:1px solid var(--e-line);border-radius:12px;padding:22px 24px;margin:18px 0;box-shadow:none}
.ecu-main .card p{color:var(--e-muted);margin:0}
.ecu-main .card h2{font-size:1.25rem;font-weight:700;letter-spacing:-0.005em;color:#fff;margin:0 0 14px;border-left:3px solid var(--color-primary-500,#c7081b);padding-left:12px}
.ecu-main .grid{gap:12px}
.ecu-main .grid a.it{
  background:var(--e-card);border:1px solid var(--e-line);border-radius:8px;padding:12px 14px;color:var(--e-muted);
  font-size:.875rem;line-height:1.45;transition:border-color .2s ease,background-color .2s ease;
}
.ecu-main .grid a.it:hover{border-color:rgba(var(--color-primary-400-rgb,220,80,96),.6);background:#1d1d22;text-decoration:none}
.ecu-main .grid a.it b{color:#fff;font-weight:600}
/* Tabelle */
.ecu-main table.spec td{border-bottom:1px solid var(--e-line);color:var(--e-text)}
.ecu-main table.spec td:first-child{color:var(--e-muted)}
.ecu-main table.files th{background:rgba(255,255,255,.04);color:var(--e-muted);border-bottom:1px solid var(--e-line)}
.ecu-main table.files td{border-bottom:1px solid var(--e-line);color:var(--e-text)}
/* Etichette e note */
.ecu-main .badge{background:rgba(34,160,80,.14);color:#6fdc94;border:1px solid rgba(34,160,80,.35)}
.ecu-main .badge.gray{background:rgba(255,255,255,.06);color:var(--e-muted);border-color:var(--e-line)}
.ecu-main .opts span{background:rgba(255,255,255,.06);border:1px solid var(--e-line);color:var(--e-muted)}
.ecu-main .note{background:rgba(255,255,255,.04);border-left:3px solid var(--e-line);color:var(--e-muted)}
.ecu-main .cta-alt{color:var(--e-muted)}
/* CTA: pieno e piatto; secondario con bordo */
.ecu-main .cta a{border-radius:8px}
.ecu-main .cta .t{background:var(--color-primary-500,#c7081b);background-image:none;color:#fff;border:1px solid var(--color-primary-500,#c7081b)}
.ecu-main .cta .t:hover{background:var(--color-primary-600,#a50616);border-color:var(--color-primary-600,#a50616);text-decoration:none}
.ecu-main .cta .b{background:transparent;border:1px solid var(--color-primary-400,#dc5060);color:var(--color-primary-400,#dc5060)}
.ecu-main .card.cta-top{background:var(--e-surface);border:1px solid rgba(var(--color-primary-400-rgb,220,80,96),.35)}
/* Moduli aggiuntivi e FAQ */
.ecu-main .modcard{background:var(--e-card);border:1px solid var(--e-line);color:var(--e-text)}
.ecu-main .modcard:hover{box-shadow:none;border-color:rgba(var(--color-primary-400-rgb,220,80,96),.6);text-decoration:none}
.ecu-main .modcard img{background:#fff;border-radius:6px;padding:4px}
.ecu-main .modinfo strong{color:#fff}
.ecu-main .modpw{color:#6fdc94}
.ecu-main .modprice{color:#fff}
.ecu-main .modbuy{background:var(--color-primary-500,#c7081b);border-radius:6px}
.ecu-main .faq details{background:var(--e-surface);border:1px solid var(--e-line)}
.ecu-main .faq summary{color:#fff}
.ecu-main .faq details[open] summary{border-bottom:1px solid var(--e-line)}
.ecu-main .faq .ans{color:var(--e-muted)}
/* Ricerca nell'elenco */
.ecu-main .ecu-filter{margin:0 0 16px}
.ecu-main .ecu-filter input{
  width:100%;max-width:420px;box-sizing:border-box;background:var(--e-bg);color:var(--e-text);
  border:1px solid var(--e-line);border-radius:8px;padding:12px 14px;font:inherit;
}
.ecu-main .ecu-filter input::placeholder{color:var(--e-subtle)}
.ecu-main .ecu-filter input:focus{border-color:var(--color-primary-400,#dc5060);box-shadow:0 0 0 3px rgba(var(--color-primary-400-rgb,220,80,96),.25);outline:none}
.ecu-main .ecu-filter-empty{color:var(--e-muted);margin:8px 0 0}
/* Piede */
body:has(> main.ecu-main) footer.site{background:#08080a;border-top:1px solid var(--e-line);color:var(--e-subtle)}
body:has(> main.ecu-main) footer.site a{color:var(--e-muted)}
@media (prefers-reduced-motion:reduce){.ecu-main .grid a.it{transition:none}}
/* Elementi con colori inline pensati per lo sfondo chiaro */
.ecu-main ul[style*="color"],.ecu-main ul[style*="color"] li{color:var(--e-muted) !important}
.ecu-main p[style*="color"],.ecu-main small[style*="color"],.ecu-main div[style*="color:#"]{color:var(--e-muted) !important}
.ecu-main ul li::marker{color:var(--e-subtle)}