/* Feature Layout: Bento Grid */
.aum-fbg {
    --fbg-cols: 4;
    --fbg-rowh: 190px;
    --fbg-gap: 16px;
    display: grid;
    grid-template-columns: repeat(var(--fbg-cols), minmax(0, 1fr));
    grid-auto-rows: var(--fbg-rowh);
    grid-auto-flow: dense;
    gap: var(--fbg-gap);
    width: 100%;
}

.aum-fbg-cell {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 18px;
    background-color: var(--card-bg);
    color: var(--text-on-bg);
    text-decoration: none;
    min-width: 0;
    transition: transform 0.28s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.28s ease;
}

/* size spans */
.aum-fbg-cell--sm    { grid-column: span 1; grid-row: span 1; }
.aum-fbg-cell--wide  { grid-column: span 2; grid-row: span 1; }
.aum-fbg-cell--tall  { grid-column: span 1; grid-row: span 2; }
.aum-fbg-cell--large { grid-column: span 2; grid-row: span 2; }

.aum-fbg-scrim {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.35);
    z-index: 1;
}

.aum-fbg-inner {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 22px;
}
.aum-fbg-cell--vstart  .aum-fbg-inner { justify-content: flex-start; }
.aum-fbg-cell--vcenter .aum-fbg-inner { justify-content: center; }
.aum-fbg-cell--vend    .aum-fbg-inner { justify-content: flex-end; }

.aum-fbg-icon {
    display: inline-flex;
    align-items: center;
    line-height: 1;
    color: var(--primary);
    margin-bottom: 12px;
}
.aum-fbg-icon svg { width: 28px; height: 28px; }

.aum-fbg-eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 6px;
}

.aum-fbg-title {
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.25;
    color: var(--text-on-bg);
}
.aum-fbg-cell--large .aum-fbg-title { font-size: 1.6rem; }
.aum-fbg-cell--wide  .aum-fbg-title { font-size: 1.3rem; }

.aum-fbg-desc {
    margin-top: 8px;
    font-size: 0.92rem;
    line-height: 1.55;
    color: var(--text-muted);
}

/* cells that carry an image / their own text color: keep text readable */
.aum-fbg-cell--has-img,
.aum-fbg-cell--has-img .aum-fbg-title,
.aum-fbg-cell--has-img .aum-fbg-desc { color: #fff; }

@media (max-width: 1024px) {
    .aum-fbg { --fbg-cols: 2; }
    .aum-fbg-cell--wide,
    .aum-fbg-cell--large { grid-column: span 2; }
    .aum-fbg-cell--large { grid-row: span 2; }
    .aum-fbg-cell--tall  { grid-row: span 2; }
}

@media (max-width: 600px) {
    .aum-fbg--stack { --fbg-cols: 1; }
    .aum-fbg--stack .aum-fbg-cell--sm,
    .aum-fbg--stack .aum-fbg-cell--wide,
    .aum-fbg--stack .aum-fbg-cell--tall,
    .aum-fbg--stack .aum-fbg-cell--large { grid-column: span 1; grid-row: span 1; }
}
