/* Stile condiviso per le pagine "Approfondimenti" — coerente con la home di Business Plan Milano */
html { scroll-behavior:smooth; }
* { box-sizing:border-box; }
body { margin:0; background:#faf7f1; color:#1b2a4a; font-family:'Sora',sans-serif; }
a { color:#1f3f8f; text-decoration:none; }
a:hover { color:#152e6b; }
img { max-width:100%; }
.skip-link { position:absolute; left:-9999px; top:0; background:#1f3f8f; color:#fff; padding:10px 18px; z-index:100; }
.skip-link:focus { left:12px; top:12px; color:#fff; }

/* Header (identico alla home) */
.site-header { position:sticky; top:0; z-index:50; background:rgba(22,32,58,0.94); backdrop-filter:blur(10px); border-bottom:1px solid rgba(195,151,56,0.4); }
.site-header .inner { max-width:1200px; margin:0 auto; padding:16px 32px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:12px; color:#faf7f1; }
.brand-mark { width:44px; height:44px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; }
.brand-mark svg { display:block; width:44px; height:44px; }
.brand-name { font:700 20px 'Bricolage Grotesque',sans-serif; letter-spacing:0.01em; }
.site-nav { display:flex; align-items:center; gap:26px; font:600 14px 'Sora',sans-serif; flex-wrap:wrap; }
.site-nav a { color:rgba(250,247,241,0.78); }
.site-nav a:hover { color:#c39738; }
.site-nav a.cta { background:#1f3f8f; color:#faf7f1; padding:11px 24px; border-radius:100px; transition:all .2s ease; }
.site-nav a.cta:hover { background:#152e6b; color:#faf7f1; transform:translateY(-1px); }

.kicker { font:600 12px 'Sora',sans-serif; letter-spacing:0.14em; text-transform:uppercase; color:#1f3f8f; margin-bottom:16px; display:inline-flex; align-items:center; gap:10px; }
.kicker::before { content:''; display:block; width:26px; height:2px; background:#c39738; }

/* Breadcrumb */
.crumbs { max-width:820px; margin:0 auto; padding:28px 32px 0; font:600 13px 'Sora',sans-serif; color:#8b8171; }
.crumbs a { color:#1f3f8f; }

/* ===== Indice articoli ===== */
.guide-hero { max-width:820px; margin:0 auto; padding:36px 32px 8px; }
.guide-hero h1 { font:800 44px/1.08 'Bricolage Grotesque',sans-serif; letter-spacing:-0.02em; margin:8px 0 16px; color:#0f1a2e; }
.guide-hero p { font:400 18px/1.6 'Sora',sans-serif; color:#5a5348; margin:0; max-width:640px; }
.guide-list { max-width:820px; margin:0 auto; padding:40px 32px 72px; display:grid; gap:18px; }
.guide-card { display:block; background:#ffffff; border:1px solid #e9e2d4; border-left:3px solid #c39738; border-radius:18px; padding:28px 32px; transition:transform .2s ease, box-shadow .2s ease; }
.guide-card:hover { transform:translateY(-4px); box-shadow:0 16px 36px rgba(27,42,74,0.10); }
.guide-card h2 { font:700 22px/1.25 'Bricolage Grotesque',sans-serif; margin:0 0 8px; color:#0f1a2e; }
.guide-card p { font:400 15px/1.6 'Sora',sans-serif; color:#5a5348; margin:0 0 12px; }
.guide-card .more { font:700 14px 'Sora',sans-serif; color:#1f3f8f; }

/* ===== Articolo ===== */
.article { max-width:720px; margin:0 auto; padding:20px 32px 24px; }
.article h1 { font:800 42px/1.12 'Bricolage Grotesque',sans-serif; letter-spacing:-0.02em; margin:12px 0 20px; color:#0f1a2e; text-wrap:balance; }
.article .meta { display:flex; align-items:center; gap:14px; flex-wrap:wrap; font:600 13.5px 'Sora',sans-serif; color:#8b8171; padding-bottom:28px; margin-bottom:8px; border-bottom:1px solid #e9e2d4; }
.article .meta .author { color:#1b2a4a; }
.article .lead { font:400 20px/1.6 'Newsreader',serif; color:#3a3a3a; margin:28px 0; }
.article-body { font:400 17px/1.75 'Sora',sans-serif; color:#2a3348; }
.article-body h2 { font:700 27px/1.25 'Bricolage Grotesque',sans-serif; color:#0f1a2e; margin:44px 0 14px; }
.article-body h3 { font:700 19px 'Sora',sans-serif; color:#1b2a4a; margin:30px 0 8px; }
.article-body p { margin:0 0 18px; }
.article-body strong { color:#1b2a4a; }
.article-body ul { margin:0 0 18px; padding-left:22px; }
.article-body li { margin-bottom:10px; }
.article-body em { font-style:italic; }
.pull { border-left:3px solid #c39738; background:#f2f7fb; border-radius:0 14px 14px 0; padding:20px 26px; margin:28px 0; font:italic 400 20px/1.5 'Newsreader',serif; color:#1b2a4a; }
.pull strong { font-weight:700; font-style:italic; color:#a87c22; }
.case { background:#eef4fa; border:1px solid #d8e6f2; border-radius:16px; padding:24px 28px; margin:26px 0; }
.case img { display:block; width:calc(100% + 56px); margin:-24px -28px 20px; border-radius:16px 16px 0 0; height:auto; object-fit:cover; }
.case .tag { display:inline-block; font:600 11px 'Sora',sans-serif; letter-spacing:0.1em; text-transform:uppercase; color:#0f1a2e; background:#c39738; padding:4px 11px; border-radius:100px; margin-bottom:12px; }
.case p { margin:0; font-size:16px; }

/* CTA fine articolo */
.article-cta { max-width:720px; margin:8px auto 72px; padding:0 32px; }
.article-cta .box { background:#0f1a2e; border-radius:22px; padding:40px; text-align:center; }
.article-cta h2 { font:800 26px/1.2 'Bricolage Grotesque',sans-serif; color:#faf7f1; margin:0 0 12px; }
.article-cta p { font:400 15.5px/1.6 'Sora',sans-serif; color:rgba(250,247,241,0.8); margin:0 0 24px; }
.article-cta a { display:inline-block; background:#1f3f8f; color:#faf7f1; font:700 16px 'Sora',sans-serif; padding:15px 32px; border-radius:100px; transition:all .2s ease; }
.article-cta a:hover { background:#c39738; color:#0f1a2e; }

/* Footer (identico alla home) */
.site-footer { background:#0f1a2e; border-top:2px solid #c39738; }
.site-footer .inner { max-width:1200px; margin:0 auto; padding:44px 32px; display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; font:400 14px 'Sora',sans-serif; color:rgba(250,247,241,0.55); }
.footer-brand { font:700 20px 'Bricolage Grotesque',sans-serif; color:#faf7f1; }
.footer-brand span { color:#c39738; }
.site-footer a { color:inherit; }
.footer-social { display:flex; align-items:center; gap:14px; }
.footer-social a { display:inline-flex; align-items:center; gap:7px; color:rgba(250,247,241,0.7); font:600 13px 'Sora',sans-serif; }
.footer-social a:hover { color:#c39738; }
.footer-social svg { width:20px; height:20px; flex:0 0 auto; }

@media (max-width: 720px) {
  .guide-hero h1 { font-size:34px; }
  .article h1 { font-size:32px; }
  .article-body h2 { font-size:23px; }
  .site-nav { gap:14px; font-size:13px; }
  .site-footer .inner { flex-direction:column; align-items:flex-start; gap:10px; }
}
