/**
 * ACF Blocks Styles
 * Styles for custom ACF blocks in the Revival theme
 */

/* ============================================
   Content Card Block
   ============================================ */

   .content-card {
    margin: var(--space-l, 3rem) 0 !important; 
    container-type: inline-size;
    container-name: content-card;
}

.content-card__container {
    display: grid;
    gap: var(--space-xs);
    background: var(--bg-white);
    border-radius: var(--radius-l, 12px);
    overflow: hidden;
    padding: 0;
    box-shadow: var(--box-shadow-m);
}

.content-card__image {
    border-radius: 0;
    overflow: hidden;
    background: var(--neutral-dark-trans-90);
    height: 100%;
    width: 100%;
}

.content-card__image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    aspect-ratio: 16 / 9;
    border-radius: 0;
}

.content-card__content {
    padding-inline: var(--space-s);
}


.content-card__heading {
    font-size: var(--text-l);
    margin-block-start: var(--space-xs);
    margin-bottom: var(--space-xs);
    line-height: 1.2;
    font-family: var(--text-font-family);
    font-weight: 650;
    color: var(--text-dark);
}

.content-card__description {
    font-size: var(--text-m, 1.125rem);
    margin-bottom: var(--space-m, 1.5rem);
    line-height: 1.5;
    color: var(--text-dark-muted);
}

.content-card__button {
    margin-block-end: var(--space-m);
}


/* Container Queries - Side by side layout for larger containers */
@container content-card (min-width: 600px) {
    .content-card__container {
        grid-template-columns: .75fr 1.25fr;
        align-items: center;
        gap: var(--space-m, 2rem);
    }
    .content-card__content {
        padding-inline: 0 var(--space-m);
    }
    .content-card__heading {
        margin-block-start: var(--space-m);
    }
}

/* Larger containers - more spacing */
@container content-card (min-width: 800px) {
    .content-card__container {
        gap: var(--space-xl, 3rem);
        padding: var(--space-xl, 3rem);
    }
}