/* Stats Layout: Assurance Grid
   A shared 2-row × 2-col grid so the left panel divider and the right body
   divider fall on the same gridline (row1 = top stat + trust points,
   row2 = bottom stat + guarantee). */
.aum-sag {
    width: 100%;
    box-sizing: border-box;
}

.aum-sag-grid {
    --aum-sag-divider: var(--border);
    --aum-sag-divider-w: 1px;
    --aum-sag-body-bg: var(--card-bg);
    --aum-sag-panel-divider: rgba(255, 255, 255, 0.18);
    --aum-sag-panelw: 34%;
    max-width: var(--container-width, 1280px);
    margin: 0 auto;
    display: grid;
    grid-template-columns: var(--aum-sag-panelw) 1fr;
    grid-template-areas:
        "s1 points"
        "s2 guar";
    box-sizing: border-box;
}

/* Column order / guarantee-off / single-stat variants */
.aum-sag--panel-right .aum-sag-grid {
    grid-template-columns: 1fr var(--aum-sag-panelw);
    grid-template-areas:
        "points s1"
        "guar   s2";
}
.aum-sag--no-guar .aum-sag-grid {
    grid-template-areas:
        "s1 points"
        "s2 points";
}
.aum-sag--no-guar.aum-sag--panel-right .aum-sag-grid {
    grid-template-areas:
        "points s1"
        "points s2";
}
.aum-sag--one-stat .aum-sag-grid {
    grid-template-areas:
        "s1 points"
        "s1 guar";
}
.aum-sag--one-stat.aum-sag--panel-right .aum-sag-grid {
    grid-template-areas:
        "points s1"
        "guar   s1";
}
.aum-sag--one-stat.aum-sag--no-guar .aum-sag-grid {
    grid-template-areas: "s1 points";
}
.aum-sag--one-stat.aum-sag--no-guar.aum-sag--panel-right .aum-sag-grid {
    grid-template-areas: "points s1";
}

/* ---- Stat cells (the highlight panel) ---- */
.aum-sag-stat {
    background-color: var(--primary);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 44px;
    box-sizing: border-box;
    min-width: 0;
}
.aum-sag-stat--top    { grid-area: s1; }
.aum-sag-stat--bottom { grid-area: s2; }
/* vertical divider between panel and body */
.aum-sag--panel-left  .aum-sag-stat { border-right: var(--aum-sag-divider-w, 1px) solid var(--aum-sag-divider, var(--border)); }
.aum-sag--panel-right .aum-sag-stat { border-left:  var(--aum-sag-divider-w, 1px) solid var(--aum-sag-divider, var(--border)); }
/* horizontal divider inside the panel (aligns with the body row divider) */
.aum-sag-stat--bottom { border-top: var(--aum-sag-divider-w, 1px) solid var(--aum-sag-panel-divider, rgba(255, 255, 255, 0.18)); }

.aum-sag-stat-number {
    color: #fff;
    font-size: clamp(2rem, 3.6vw, 3.25rem);
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -0.01em;
}
.aum-sag-stat-label {
    margin-top: 10px;
    color: rgba(255, 255, 255, 0.75);
    font-size: 1rem;
    line-height: 1.4;
}

/* ---- Trust points (top-right cell, itself a sub-grid of point cells) ---- */
.aum-sag-points {
    grid-area: points;
    background: var(--aum-sag-body-bg, var(--card-bg));
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    /* row divider on the body side — same gridline as the panel divider */
    border-bottom: var(--aum-sag-divider-w, 1px) solid var(--aum-sag-divider, var(--border));
}
.aum-sag--no-guar .aum-sag-points { border-bottom: none; }

.aum-sag-point {
    box-sizing: border-box;
    padding: 28px;
    background: var(--aum-sag-body-bg, var(--card-bg));
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    /* internal hairlines between point cells (right + bottom on wrap) */
    box-shadow:
        inset calc(var(--aum-sag-divider-w, 1px) * -1) 0 0 0 var(--aum-sag-divider, var(--border)),
        inset 0 calc(var(--aum-sag-divider-w, 1px) * -1) 0 0 var(--aum-sag-divider, var(--border));
}
.aum-sag-point-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    color: var(--primary);
    font-size: 16px;
    line-height: 1;
}
.aum-sag-point-icon.has-ring {
    width: 38px;
    height: 38px;
    border: 2px solid var(--primary);
    border-radius: 50%;
}
.aum-sag-point-icon svg { width: 1em; height: 1em; display: block; }
.aum-sag-point-text {
    margin: 0;
    color: var(--text-on-bg);
    font-size: 0.95rem;
    line-height: 1.45;
}

/* ---- Guarantee (bottom-right cell) ---- */
.aum-sag-guarantee {
    grid-area: guar;
    background: var(--aum-sag-body-bg, var(--card-bg));
    display: flex;
    align-items: center;
    gap: 32px;
    padding: 32px;
    box-sizing: border-box;
}
.aum-sag-guarantee-text {
    flex: 1 1 auto;
    color: var(--text-on-bg);
    font-size: 1.15rem;
    line-height: 1.5;
}
.aum-sag-guarantee-text p { margin: 0 0 0.5em; }
.aum-sag-guarantee-text :last-child { margin-bottom: 0; }
.aum-sag-badge {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}
.aum-sag-badge img {
    display: block;
    max-width: 84px;
    height: auto;
}

/* ---- Responsive: stack to a single column ---- */
@media (max-width: 900px) {
    .aum-sag-grid,
    .aum-sag--panel-right .aum-sag-grid,
    .aum-sag--no-guar .aum-sag-grid,
    .aum-sag--no-guar.aum-sag--panel-right .aum-sag-grid,
    .aum-sag--one-stat .aum-sag-grid,
    .aum-sag--one-stat.aum-sag--panel-right .aum-sag-grid,
    .aum-sag--one-stat.aum-sag--no-guar .aum-sag-grid,
    .aum-sag--one-stat.aum-sag--no-guar.aum-sag--panel-right .aum-sag-grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "s1"
            "s2"
            "points"
            "guar";
    }
    .aum-sag-stat {
        border-right: none !important;
        border-left: none !important;
    }
    .aum-sag-stat--bottom {
        border-top: var(--aum-sag-divider-w, 1px) solid var(--aum-sag-panel-divider, rgba(255, 255, 255, 0.18));
    }
    .aum-sag-points { border-top: var(--aum-sag-divider-w, 1px) solid var(--aum-sag-divider, var(--border)); }
    .aum-sag-guarantee { flex-direction: column; align-items: flex-start; }
}
