:root {
  --bg:#ffffff; --bg-soft:#f6f7fb; --text:#0b0b0f; --muted:#4c4f5a; --card:#ffffff; --border:#e7e9f0;
  --accent-1:#6c5ce7; --accent-2:#00c2a8; --accent-3:#ff6b6b; --accent-4:#ffd166;
  --shadow:0 10px 30px rgba(0,0,0,.06);
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#0b0b0f; --bg-soft:#10131a; --text:#f4f6fb; --muted:#b9bfd1; --card:#131722; --border:#23293a; --shadow:0 10px 30px rgba(0,0,0,.35); }
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body{ margin:0; font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji"; background:var(--bg); color:var(--text); -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

img{ max-width:100%; height:auto; display:block; }
a{ color:var(--accent-1); text-decoration:none; }
a:hover{ text-decoration:underline; }
/* Mostra il focus solo sugli elementi interattivi (evita cornici su container/dialog durante tap o selezione testo) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible{
  outline:3px solid var(--accent-2);
  outline-offset:2px;
  border-radius:6px;
}

.container{ width:min(1120px,92%); margin-inline:auto; }
.section{ padding:2.5rem 0; }
/* Riduci lo spazio superiore quando non mostri il breadcrumb */
main.container.section{ padding-top:1.25rem; }
#blogpage.section{ padding-top:1.25rem; }
.section h2{ font-size:clamp(1.3rem, 1.2vw + 1rem, 2rem); margin:0 0 1rem; }
.subtle{ color:var(--muted); }
.hide{ display:none !important; }

.grid{ display:grid; gap:1rem; grid-template-columns:repeat(12,1fr); }
.card{ grid-column:span 12; border:1px solid var(--border); background:var(--card); border-radius:18px; padding:1rem; box-shadow:var(--shadow); }
@media (min-width:720px){ .card{ grid-column:span 6; } }
@media (min-width:1000px){ .card{ grid-column:span 4; } }

.btn{ display:inline-flex; align-items:center; gap:.5rem; border:0; cursor:pointer; text-decoration:none;
  padding:.7rem 1rem; border-radius:.9rem; font-weight:600; letter-spacing:.2px;
  background:linear-gradient(135deg, var(--accent-1), var(--accent-2)); color:white; box-shadow:var(--shadow); }
.btn:hover{ transform:translateY(-1px); }
@media (prefers-reduced-motion: reduce){ .btn:hover{ transform:none; } }

.tag{ display:inline-block; padding:.22rem .5rem; border-radius:999px; border:1px solid var(--border); background:var(--bg-soft); font-size:.8rem; margin-right:.4rem; }

/* Footer centrato (punto 2) */
footer .container{ text-align:center; }
