/* ===== CSS per Clone Struttura (prefissato con .clone-scope) ===== */
.clone-scope *, .clone-scope *::before, .clone-scope *::after { box-sizing: border-box; }
.clone-scope { color: #111; }
.clone-scope a { color: inherit; text-decoration: none; }

.clone-scope .site{ display:flex; flex-direction:column; min-height:100vh; font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; }
.clone-scope .container{ width:min(1200px,94%); margin:0 auto; }

/* Header */
.clone-scope header{ background:#fff; border-bottom:1px solid #eee; }
.clone-scope .nav{ display:flex; align-items:center; justify-content:space-between; padding:14px 0; }
.clone-scope .brand{ font-weight:700; letter-spacing:.4px; }
.clone-scope .nav-links{ display:flex; gap:18px; }
.clone-scope .cta{ padding:8px 14px; border-radius:8px; border:1px solid #111; }

/* Main */
.clone-scope main{ flex:1; }
.clone-scope .hero{ display:grid; grid-template-columns:1fr 420px; gap:32px; padding:48px 0; align-items:center; }
.clone-scope .hero h1{ font-size:clamp(24px,4vw,40px); line-height:1.05; margin-bottom:12px; }
.clone-scope .hero p{ color:#444; margin-bottom:18px; }
.clone-scope .placeholder{ background:#f6f7f9; border:1px dashed #e2e2e2; padding:18px; border-radius:10px; }

.clone-scope .grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:28px 0; }
.clone-scope .card{ background:#fff; border:1px solid #eee; padding:18px; border-radius:10px; min-height:120px; }

.clone-scope .two-col{ display:grid; grid-template-columns:2fr 1fr; gap:20px; margin:24px 0; }
.clone-scope .article{ background:#fff; border:1px solid #eee; padding:18px; border-radius:10px; }
.clone-scope .sidebar{ background:#fff; border:1px solid #eee; padding:18px; border-radius:10px; }

/* Footer */
.clone-scope footer{ margin-top:auto; background:#fafafa; border-top:1px solid #eee; padding:24px 0; color:#444; }
.clone-scope .footer-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }

/* Responsive */
@media (max-width:900px){
  .clone-scope .hero{ grid-template-columns:1fr; }
  .clone-scope .grid{ grid-template-columns:repeat(2,1fr); }
  .clone-scope .two-col{ grid-template-columns:1fr; }
  .clone-scope .footer-grid{ grid-template-columns:repeat(2,1fr); }
  .clone-scope .nav-links{ display:none; }
}
@media (max-width:520px){
  .clone-scope .grid{ grid-template-columns:1fr; }
  .clone-scope .footer-grid{ grid-template-columns:1fr; }
  .clone-scope .cta{ display:none; }
}
