/* FILE: /v2/include/css/05-hero.css
   COSA FA:
   Gestione hero comune /v2.
   Include copertina, logo centrale e testo welcome.
   Lo sfondo dinamico della hero viene gestito inline dalle pagine con $heroBgStyle.
*/

.hero{
    background-size:cover;
    background-position:center;
    border-radius:var(--cm-radius-lg);
    min-height:220px;
    box-shadow:var(--cm-shadow-lg);
    position:relative;
    overflow:hidden;
}

.hero .inner{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    text-align:center;
    padding:24px;
}

.hero .center-brand{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:12px;
}

.hero .logo-lg{
    width:120px;
    height:120px;
    border-radius:50%;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
    background:var(--cm-hero-logo-bg);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    border:2px solid var(--cm-hero-logo-border);
    box-shadow:0 12px 35px rgba(0,0,0,.20);
}

.hero .logo-lg img{
    max-width:100%;
    max-height:100%;
    object-fit:contain;
    display:block;
}

.hero .logo-lg .material-icons{
    font-size:54px;
    color:var(--cm-primary);
}

.hero .welcome{
    font-size:1.05rem;
    opacity:.95;
}