.oe-crate-callout {
    box-sizing: border-box;
    display: grid;
    grid-template-columns: clamp(118px, 18vw, 200px) minmax(0, 1fr);
    align-items: center;
    gap: clamp(14px, 3vw, 32px);
    width: min(calc(100% - 32px), var(--max, 1180px));
    margin: 28px auto 0;
    padding: clamp(13px, 3vw, 24px);
    overflow: hidden;
    border: 1px solid #ad5d9a;
    border-radius: 20px;
    color: #fbf3e6;
    background: repeating-radial-gradient(circle at 100% 120%, transparent 0 14px, #fa8abc26 15px 16px, transparent 17px 22px),
        linear-gradient(112deg, #25172e 20%, #4b2344 100%);
}
.oe-crate-callout-art {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 10px;
}
.oe-crate-callout-label {
    display: block;
    color: #edfc99;
    font-size: .73rem;
    font-weight: 800;
    letter-spacing: .13em;
}
.oe-crate-callout h2 {
    margin: 4px 0 6px;
    color: #ff9bc1;
    font-size: clamp(2rem, 5vw, 3.6rem);
    font-weight: 850;
    letter-spacing: -.05em;
    line-height: 1;
}
.oe-crate-callout p {
    max-width: 48ch;
    margin: 0;
    color: #fbf3e6;
    line-height: 1.45;
}
.oe-crate-callout-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px 15px;
    margin-top: 13px;
}
.oe-crate-callout-links a {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 44px;
    font-size: .92rem;
    font-weight: 750;
}
.oe-crate-callout-links .oe-crate-callout-primary {
    padding: 8px 16px;
    border-radius: 8px;
    color: #211927;
    background: #edfc99;
}
.oe-crate-callout-links .oe-crate-callout-primary:hover { background: #f6ffca; }
.oe-crate-callout-links .oe-crate-callout-secondary { color: #fbf3e6; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 500px) {
    .oe-crate-callout { grid-template-columns: minmax(0, 1fr); }
    .oe-crate-callout-art { width: min(126px, 100%); }
}