/* RBB Half Showcase — full-width product block laid out in two side-by-side panes. */
.rbb-half-showcase {
    width: 100%;
    box-sizing: border-box;
    margin: 16px 0 24px;
    padding: 0 8px;
}
.rbb-half-showcase h3 {
    font-weight: 700;
    margin: 0 0 14px;
}
.rbb-half-showcase.rbb-align-left   h3 { text-align: left; }
.rbb-half-showcase.rbb-align-center h3 { text-align: center; }
.rbb-half-showcase.rbb-align-right  h3 { text-align: right; }

.rbb-half-showcase .rbb-tiles {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -10px;
}
.rbb-half-showcase .rbb-tile {
    padding: 0 10px 20px;
    box-sizing: border-box;
    width: 100%;
}
.rbb-half-showcase.rbb-cols-1 .rbb-tile { width: 100%; }
.rbb-half-showcase.rbb-cols-2 .rbb-tile { width: 50%; }
.rbb-half-showcase.rbb-cols-3 .rbb-tile { width: 33.3333%; }
.rbb-half-showcase.rbb-cols-4 .rbb-tile { width: 25%; }

/* Pane styling — each tile reads as its own panel. */
.rbb-half-showcase .rbb-tile-inner {
    text-align: center;
    padding: 18px 14px 18px;
    background: #fff;
    border: 1px solid #e6e6e6;
    border-radius: 6px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    height: 100%;
    box-sizing: border-box;
    transition: box-shadow 200ms ease, transform 200ms ease;
}
.rbb-half-showcase .rbb-tile-inner:hover {
    box-shadow: 0 6px 18px rgba(0,0,0,0.14);
    transform: translateY(-2px);
}
.rbb-half-showcase .rbb-tile img {
    max-width: 100%;
    height: auto;
    display: inline-block;
}
.rbb-half-showcase .rbb-tile-name {
    display: block;
    margin: 12px 0 4px;
    color: #0a2548;
    font-weight: 700;
    font-size: 15px;
    line-height: 1.25;
    text-decoration: none;
}
.rbb-half-showcase .rbb-tile-name:hover { text-decoration: underline; }
.rbb-half-showcase .rbb-tile-price {
    font-size: 15px;
    color: #1a8531;
    font-weight: 700;
    margin: 6px 0 10px;
}
.rbb-half-showcase .rbb-tile-price .rbb-was {
    color: #999;
    text-decoration: line-through;
    font-weight: 400;
    margin-right: 6px;
}
.rbb-half-showcase .rbb-tile-btn {
    display: inline-block;
    padding: 8px 18px;
    background: #a82626;
    color: #fff !important;
    border: 0;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}
.rbb-half-showcase .rbb-tile-btn:hover { background: #8a1e1e; }

/* Mobile: any multi-column layout stacks so tiles stay readable. */
@media (max-width: 767px) {
    .rbb-half-showcase.rbb-cols-2 .rbb-tile,
    .rbb-half-showcase.rbb-cols-3 .rbb-tile,
    .rbb-half-showcase.rbb-cols-4 .rbb-tile { width: 100%; }
}