/**
 * Widget: hero-content|homepage
 */

/* -----------------------------------------------------------------------
   Sezione principale (sfondo primario)
----------------------------------------------------------------------- */
.hero-content-homepage {
    background-color: var(--website-primary);
    position: relative;
    overflow: hidden;
    padding: var(--website-padding-top-bottom) 0;
}



/* -----------------------------------------------------------------------
   Container: centra il box bianco
----------------------------------------------------------------------- */
.hero-content-homepage > .container {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
}

/* -----------------------------------------------------------------------
   Box bianco centrale
----------------------------------------------------------------------- */
.hero-content-homepage .homepage-box {
    background: #ffffff;
    border-radius: 12px;
    padding: 42px;
    max-width: var(--website-box-max-width);
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 32px;
}


/* -----------------------------------------------------------------------
   Titolo h1
----------------------------------------------------------------------- */

/* Testo in evidenza nel titolo */
.hero-content-homepage .homepage-title-emphasis {
    color: var(--website-accent);
    font-style: italic;
    font-weight: 500;
}

/* -----------------------------------------------------------------------
   Corpo del contenuto della pagina
----------------------------------------------------------------------- */
.hero-content-homepage .homepage-content {
    font-weight: 500;
    line-height: 24px;
    color: var(--website-secondary);
    margin: 0;
}

.hero-content-homepage .homepage-content p {
    margin: 0;
}

.hero-content-homepage .homepage-content p + p {
    margin-top: 16px;
}

/* -----------------------------------------------------------------------
   Immagine in evidenza del post (thumbnail) — in fondo al box
----------------------------------------------------------------------- */
.hero-content-homepage .homepage-thumbnail {
    display: block;
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 12px;
}


/* -----------------------------------------------------------------------
   Responsive
----------------------------------------------------------------------- */

@media (max-width: 830px) {
    .hero-content-homepage {
        padding: var(--website-padding-top-bottom-mini) 0;
    }

    .hero-content-homepage .homepage-box {
        padding: 24px 20px;
        gap: 24px;
        border-radius: 8px;
        margin-left: 1rem;
        margin-right: 1rem;
    }

    .hero-content-homepage .homepage-title {
        font-size: 28px;
    }

    .hero-content-homepage .homepage-thumbnail {
        height: 180px;
    }

}