/* hub.css — hub-urile de compozitori (/verdi/, /ludwig-minkus/) și indexul /compozitori/ (D5, 21.10.2026).
   Pagini SSR fără aplicație React (doar antetul/subsolul din chrome.js); grila de citire vine din stagiune.css (.pg-grila). */
/* stagiune.js pune .st-static (coloană de 760 px) pe #root la paginile SSR; hub-ul are grila lui */
.st-static:has(> .wrap.cmp){max-width:none;padding:0;font:inherit}
.cmp{padding-top:28px;padding-bottom:72px}
.cmp-fir{font:400 13.5px/1.4 var(--sans);color:var(--ink-3);margin-bottom:22px}
.cmp-fir a{color:var(--ink-2)}
.cmp-fir a:hover{color:var(--mov-ink)}
.cmp-eticheta{margin:0 0 8px;font:600 13px/1.3 var(--sans);color:var(--mov-ink);letter-spacing:.01em}
.cmp h1{margin:0;font:700 clamp(34px,5vw,54px)/1.05 var(--sans);letter-spacing:-.03em;color:var(--ink)}
.cmp-desc{margin:12px 0 0;font:500 19px/1.45 var(--sans);color:var(--ink-2)}
.cmp-fraza{margin:14px 0 0;max-width:var(--col-citit,720px);font:400 17px/1.6 var(--sans);color:var(--ink)}
.cmp-fraza a{color:var(--mov-ink);text-decoration:underline;text-underline-offset:3px}
.cmp-cifre{margin:18px 0 0;font:400 15px/1.5 var(--sans);color:var(--ink-2)}
.cmp-cifre b{color:var(--ink);font-weight:700}

.cmp-hero{display:grid;grid-template-columns:220px minmax(0,1fr);gap:34px;align-items:end;padding-bottom:30px;margin-bottom:34px;border-bottom:1px solid var(--line)}
.cmp-hero:not(:has(.cmp-portret)){grid-template-columns:minmax(0,1fr)}
.cmp-portret{margin:0}
.cmp-portret img{display:block;width:220px;height:275px;object-fit:cover;object-position:50% 22%;border-radius:18px;background:var(--bg-3)}
.cmp-portret figcaption{margin-top:8px;font:400 11.5px/1.35 var(--sans);color:var(--ink-3)}
.cmp-portret figcaption a{color:inherit;text-decoration:underline}

.cmp-sec{margin:0 0 40px}
.cmp-sec h2{margin:0 0 14px;font:700 24px/1.2 var(--sans);letter-spacing:-.02em;color:var(--ink)}
.cmp .cmp-opere,.cmp .cmp-lista,.cmp .cmp-artisti,.cmp .cmp-carduri{list-style:none;margin:0;padding:0}
.cmp .cmp-opere li,.cmp .cmp-lista li,.cmp .cmp-artisti li,.cmp .cmp-carduri li{margin:0;padding-left:0}
.cmp-opere li,.cmp-lista li{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 16px;padding:12px 0;border-bottom:1px solid var(--line-2,var(--line))}
.cmp-opere a,.cmp-lista a{font:600 17px/1.35 var(--sans);color:var(--ink)}
.cmp-opere a:hover,.cmp-lista a:hover,.cmp-artisti a:hover{color:var(--mov-ink)}
.cmp-meta{font:400 14px/1.4 var(--sans);color:var(--ink-3)}
.cmp-artisti li{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--line-2,var(--line))}
.cmp-artisti a{font:500 15px/1.35 var(--sans);color:var(--ink)}
.cmp-bio h2{margin-bottom:12px}
.cmp-bio p{margin:0 0 14px}
.cmp-bio small,.cmp-bio p:last-child{font-size:13px;color:var(--ink-3)}
.cmp-bio a{color:var(--mov-ink)}

.cmp-index-cap{max-width:var(--col-citit,720px);margin-bottom:34px}
.cmp-carduri{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.cmp-card a{display:grid;grid-template-columns:84px minmax(0,1fr);gap:16px;align-items:center;padding:14px;border-radius:18px;background:var(--card);box-shadow:0 0 0 .5px var(--line);transition:transform .25s,box-shadow .25s;height:100%}
.cmp-card a:hover{transform:translateY(-3px);box-shadow:0 0 0 .5px var(--line),0 12px 32px rgba(0,0,0,.10)}
.cmp-card-poza{display:grid;place-items:center;width:84px;height:105px;border-radius:12px;overflow:hidden;background:var(--bg-3)}
.cmp-card-poza img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.cmp-initiala{font:700 34px/1 var(--sans);color:var(--ink-3)}
.cmp-card-txt{display:flex;flex-direction:column;gap:4px;min-width:0}
.cmp-card-txt b{font:600 18px/1.25 var(--sans);color:var(--ink)}
.cmp-card a:hover b{color:var(--mov-ink)}
.cmp-urm{font:500 13px/1.35 var(--sans);color:var(--mov-ink)}

@media (max-width:720px){
  .cmp{padding-top:18px}
  .cmp-hero{grid-template-columns:110px minmax(0,1fr);gap:18px;align-items:start}
  .cmp-portret img{width:110px;height:138px;border-radius:12px}
  .cmp-portret figcaption{font-size:10.5px}
  .cmp-desc{font-size:16.5px}
  .cmp-carduri{grid-template-columns:minmax(0,1fr)}
  .cmp-opere li,.cmp-lista li{flex-direction:column}
}
