/**
 * Widget: course|hero-content-category
 * Stessa grafica di hero-content|general: due colonne uguali (testo su box
 * #D9E0E7 | immagine), sfondo #EEF1F1. Dati dal termine product_cat.
 */

.course-hero-content-category.chcc {
    position: relative;
    padding: var(--website-padding-top-bottom) 0;
}

.course-hero-content-category .chcc-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
    gap: 24px;
}

.course-hero-content-category .chcc-col {
    min-width: 0;
}

/* Colonna testo: box arrotondato */
.course-hero-content-category .chcc-text {
    background: var(--icotea-jolly);
    border-radius: 22px;
    padding: 48px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;   /* allineamento verticale in alto */
    gap: 24px;
}

.course-hero-content-category .chcc-title {
    margin: 0;
    color: var(--icotea-brand-blue);
    font-family: var(--icotea-font-heading);
    font-size: 3rem;
    line-height: 1.25;
    font-weight: 700;
}

/* Testata: quando c'è l'icona hero, titolo a sinistra e icona a destra */
.course-hero-content-category .chcc-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.course-hero-content-category .chcc-head-icon {
    flex: 0 0 auto;
    width: auto;
    height: 72px;
    max-width: 30%;
    object-fit: contain;
}

.course-hero-content-category .chcc-content {
    color: var(--icotea-dark-blue);
    font-family: var(--icotea-font-body);
    font-size: 1.125rem;
    line-height: 1.25;
}

.course-hero-content-category .chcc-content :last-child {
    margin-bottom: 0;
}

/* Colonna immagine */
.course-hero-content-category .chcc-media {
    border-radius: 16px;
    overflow: hidden;
}

.course-hero-content-category .chcc-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* -----------------------------------------------------------------------
   Responsive
----------------------------------------------------------------------- */
@media (max-width: 991px) {
    .course-hero-content-category .chcc-title { font-size: 2.25rem; }
    .course-hero-content-category .chcc-text { padding: 32px; }
}

@media (max-width: 767px) {
    .course-hero-content-category.chcc {
        padding: var(--website-padding-top-bottom-mini) 0;
    }
    .course-hero-content-category .chcc-grid { grid-template-columns: 1fr; }
    .course-hero-content-category .chcc-media { min-height: 240px; }
    .course-hero-content-category .chcc-title { font-size: 2rem; }
}

/* Card dal block-html associato alla categoria (2 per riga, scacchiera jolly/bianco) */
.course-hero-content-category .chcc-blocks {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-top: 24px;
    align-items: stretch;
}
.course-hero-content-category .chcc-blocks .chcc-block-card:nth-child(even) {
    background: #fff;
}
#primary.bkgWhite .course-hero-content-category .chcc-blocks .chcc-block-card:nth-child(even) {
    background: var(--icotea-body-bg);
}

.course-hero-content-category .chcc-blocks--single {
    grid-template-columns: 1fr;
}
.course-hero-content-category .chcc-blocks--single .chcc-block-card {
    background: #fff;
}
#primary.bkgWhite .course-hero-content-category .chcc-blocks--single .chcc-block-card {
    background: var(--icotea-body-bg);
}


/* Titolo card aggiuntive: più piccolo del principale */
.course-hero-content-category .chcc-block-card .chcc-title {
    font-size: 1.75rem;
    line-height: 1.2;
}

@media (max-width: 767px) {
    .course-hero-content-category .chcc-blocks { grid-template-columns: 1fr; }
}