/* ============================================================================
   Multidialogo Blog — stylesheet
   Eredita variabili da style.css del sito principale.
   ============================================================================ */

/* HERO --------------------------------------------------------------------- */
.bl-hero{padding:140px 0 60px;background:linear-gradient(180deg,var(--bg-soft) 0%,var(--bg) 100%);text-align:center;border-bottom:1px solid var(--line)}
.bl-hero .eyebrow{font-size:.82rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--orange);margin-bottom:18px;display:inline-block}
.bl-hero h1{font-weight:800;font-size:clamp(2.4rem,5vw,4rem);line-height:1;letter-spacing:-0.04em;margin:0 0 22px;max-width:18ch;margin-left:auto;margin-right:auto}
.bl-hero h1 em{color:var(--orange);font-style:normal}
.bl-hero p{font-size:clamp(1rem,1.6vw,1.2rem);color:var(--text-soft);max-width:60ch;margin:0 auto;line-height:1.5}

/* SEZIONE LISTA ------------------------------------------------------------ */
.bl-section{padding:60px 0 100px}
.bl-section-title{font-weight:800;font-size:1.7rem;letter-spacing:-0.025em;margin:50px 0 26px}

/* GRID --------------------------------------------------------------------- */
.bl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
@media(max-width:960px){.bl-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.bl-grid{grid-template-columns:1fr}}

/* CARD --------------------------------------------------------------------- */
.bl-card{display:flex;flex-direction:column;background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;text-decoration:none;color:inherit;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .3s;box-shadow:var(--shadow)}
.bl-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-hover);border-color:var(--line-strong)}
.bl-cover{position:relative;aspect-ratio:16/10;background:var(--bg-elev);overflow:hidden}
.bl-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease)}
.bl-card:hover .bl-cover img{transform:scale(1.05)}
.bl-cover .ph{position:absolute;inset:0;display:grid;place-items:center;color:var(--text-faint)}
.bl-cover .ph svg{width:50%;max-width:120px;opacity:.6}
.bl-audio-badge{position:absolute;top:12px;right:12px;background:var(--orange);color:#fff;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-size:.9rem;box-shadow:0 4px 12px rgba(240,88,0,.4)}
.bl-txt{padding:24px 26px 26px;display:flex;flex-direction:column;flex:1}
.bl-cat{display:inline-block;font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--orange);background:var(--accent-soft);padding:5px 12px;border-radius:100px;margin-bottom:14px;align-self:flex-start}
.bl-card h2{font-weight:800;font-size:1.2rem;line-height:1.25;letter-spacing:-0.022em;margin:0 0 12px;color:var(--text)}
.bl-excerpt{color:var(--text-soft);font-size:.92rem;line-height:1.55;margin:0 0 16px;flex:1}
.bl-meta{font-size:.82rem;color:var(--text-faint);display:flex;gap:6px;flex-wrap:wrap}

/* FEATURED (articolo in evidenza) ----------------------------------------- */
.bl-feat{display:grid;grid-template-columns:1.15fr 1fr;background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;text-decoration:none;color:inherit;box-shadow:var(--shadow);transition:transform .5s var(--ease),box-shadow .5s var(--ease);margin-bottom:20px}
.bl-feat:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover)}
.bl-feat-cover{position:relative;aspect-ratio:auto;min-height:380px;background:var(--bg-elev);overflow:hidden}
.bl-feat-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease)}
.bl-feat:hover .bl-feat-cover img{transform:scale(1.04)}
.bl-feat-cover .ph{position:absolute;inset:0;display:grid;place-items:center;color:var(--text-faint)}
.bl-feat-cover .ph svg{width:50%;max-width:140px;opacity:.6}
.bl-feat-txt{padding:48px 48px 44px;display:flex;flex-direction:column;justify-content:center}
.bl-feat-tag{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:var(--orange);padding:6px 14px;border-radius:100px;align-self:flex-start;margin-bottom:18px}
.bl-feat-cat{margin-bottom:18px}
.bl-feat h2{font-weight:800;font-size:clamp(1.6rem,2.6vw,2.4rem);line-height:1.1;letter-spacing:-0.03em;margin:0 0 18px;color:var(--text)}
.bl-feat p{color:var(--text-soft);font-size:1.04rem;line-height:1.55;margin:0 0 22px}
@media(max-width:860px){.bl-feat{grid-template-columns:1fr}.bl-feat-cover{min-height:240px;aspect-ratio:16/9}.bl-feat-txt{padding:32px 28px}}

.bl-empty{text-align:center;padding:80px 0}
.bl-empty h2{font-weight:800;font-size:1.6rem;margin:0 0 12px}
.bl-empty p{color:var(--text-soft)}

/* ARTICOLO SINGOLO --------------------------------------------------------- */
.bl-article{padding-top:100px}
.bl-article-head{padding:40px 0 40px;background:var(--bg-soft);border-bottom:1px solid var(--line)}
.bl-breadcrumb{font-size:.84rem;color:var(--text-faint);margin-bottom:22px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.bl-breadcrumb a{color:var(--text-soft);text-decoration:none;transition:color .2s}
.bl-breadcrumb a:hover{color:var(--orange)}
.bl-breadcrumb span{color:var(--text-faint)}
.bl-article-cat{margin-bottom:20px}
.bl-article-head h1{font-weight:800;font-size:clamp(2rem,4.5vw,3.6rem);line-height:1.06;letter-spacing:-0.035em;margin:0 0 22px;color:var(--text);max-width:22ch}
.bl-article-excerpt{color:var(--text-soft);font-size:clamp(1.05rem,1.6vw,1.25rem);line-height:1.55;margin:0 0 26px;max-width:60ch;font-weight:400}
.bl-article-meta{font-size:.92rem;color:var(--text-faint);display:flex;gap:22px;flex-wrap:wrap}
.bl-article-meta span{display:inline-flex;align-items:center;gap:4px}

.bl-article-cover{padding:40px 0 0}
.bl-article-cover img{width:100%;height:auto;display:block;border-radius:var(--radius-lg);box-shadow:var(--shadow)}

/* PLAYER AUDIO ------------------------------------------------------------- */
.bl-article-audio{padding:30px 0 0}
.bl-audio-card{display:flex;align-items:center;gap:18px;padding:18px 22px;background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.bl-audio-icon{width:46px;height:46px;border-radius:50%;background:var(--accent-soft);color:var(--orange);display:grid;place-items:center;font-size:1.4rem;flex-shrink:0}
.bl-audio-info{display:flex;flex-direction:column;gap:2px;min-width:130px}
.bl-audio-info b{font-size:.96rem;font-weight:700}
.bl-audio-info span{font-size:.82rem;color:var(--text-faint)}
.bl-audio-card audio{flex:1;height:38px;min-width:0}
@media(max-width:520px){.bl-audio-card{flex-wrap:wrap}.bl-audio-card audio{width:100%}}

/* CORPO ARTICOLO ----------------------------------------------------------- */
.bl-article-body{padding:50px 0 50px}
.bl-content{max-width:720px;margin:0 auto;font-size:1.08rem;line-height:1.75;color:var(--text)}
.bl-content > *{margin-bottom:24px}
.bl-content h2{font-weight:800;font-size:1.7rem;line-height:1.2;letter-spacing:-0.025em;margin:48px 0 18px;color:var(--text)}
.bl-content h3{font-weight:700;font-size:1.32rem;line-height:1.3;margin:36px 0 14px;color:var(--text)}
.bl-content h4{font-weight:700;font-size:1.12rem;margin:30px 0 12px}
.bl-content p{color:var(--text);font-size:1.08rem;line-height:1.75}
.bl-content a{color:var(--orange);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}
.bl-content a:hover{text-decoration-thickness:2.5px}
.bl-content strong{font-weight:700;color:var(--text)}
.bl-content em{font-style:italic}
.bl-content ul,.bl-content ol{padding-left:24px;margin:0 0 24px}
.bl-content ul li,.bl-content ol li{margin-bottom:8px;color:var(--text)}
.bl-content blockquote{border-left:4px solid var(--orange);padding:6px 0 6px 22px;margin:30px 0;color:var(--text-soft);font-style:italic;font-size:1.12rem}
.bl-content img{max-width:100%;height:auto;border-radius:var(--radius);margin:30px auto;display:block;box-shadow:var(--shadow)}
.bl-content code{background:var(--bg-elev);padding:2px 8px;border-radius:6px;font-size:.92em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.bl-content pre{background:var(--bg-elev);padding:20px;border-radius:var(--radius);overflow-x:auto;font-size:.92rem;margin:24px 0}
.bl-content pre code{padding:0;background:transparent}
.bl-content hr{border:none;border-top:1px solid var(--line);margin:40px 0}

/* SHARE -------------------------------------------------------------------- */
.bl-article-share{padding:30px 0 60px;background:var(--bg-soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.bl-article-share .wrap{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap}
.bl-article-share span{font-weight:700;color:var(--text-soft);font-size:.94rem}
.bl-article-share a{width:42px;height:42px;border-radius:50%;background:var(--bg-card);border:1px solid var(--line);color:var(--text);display:grid;place-items:center;text-decoration:none;font-weight:800;transition:all .25s;font-size:.94rem}
.bl-article-share a:hover{background:var(--orange);color:#fff;border-color:var(--orange);transform:translateY(-3px)}

/* RELATED ------------------------------------------------------------------ */
.bl-related{padding:60px 0 100px;background:var(--bg);border-top:1px solid var(--line)}
.bl-related .bl-section-title{margin:0 0 30px;text-align:center}

/* HERO ARTICOLO con immagine di sfondo --------------------------------------- */
.bl-article-head.has-cover{
  position:relative;
  background:#001432;
  background-image:linear-gradient(135deg, rgba(0,12,32,.78) 0%, rgba(0,30,72,.62) 55%, rgba(0,12,32,.85) 100%), var(--bl-hero-img);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  padding:80px 0 70px;
  min-height:380px;
  display:flex;
  align-items:center;
  border-bottom:none;
}
.bl-article-head.has-cover .bl-breadcrumb,
.bl-article-head.has-cover .bl-breadcrumb a,
.bl-article-head.has-cover .bl-breadcrumb span{color:rgba(255,255,255,.72)}
.bl-article-head.has-cover .bl-breadcrumb a:hover{color:#fff}
.bl-article-head.has-cover h1{color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.35)}
.bl-article-head.has-cover .bl-article-excerpt{color:rgba(255,255,255,.92)}
.bl-article-head.has-cover .bl-article-meta{color:rgba(255,255,255,.78)}
.bl-article-head.has-cover .bl-cat{background:rgba(255,255,255,.18);color:#fff;backdrop-filter:blur(6px)}

/* Voce menu "Blog" attiva quando si è in /blog ----------------------------- */
.nav-links a.active{color:var(--orange);position:relative}
.nav-links a.active::after{content:'';position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--orange);border-radius:2px}
