/* Binodon Online — additions for NEW elements only (announcement bar, preview bar, custom pages, offers).
   css/style.css is the original design and is intentionally left as it was (only section colours became overridable variables). */

/* Server grid: a lone last card is centred only when the count is 7 (original rule) or 1 more than a multiple of 3 */
.server-grid[data-n]:not([data-n="7"]) .server-card:nth-child(7){grid-column:auto}
@media (min-width:981px){
  .server-grid.solo-last .server-card:last-child{grid-column:2}
}

.announce-bar{background:var(--orange);color:#111827;text-align:center;font-weight:700;font-size:14px;padding:9px 16px;line-height:1.4}
.announce-bar a{color:inherit;text-decoration:underline}
.preview-bar{background:#facc15;color:#1f2937;text-align:center;font-weight:700;font-size:14px;padding:8px 12px;position:sticky;top:0;z-index:1100}

/* Custom pages */
.page-block{margin-bottom:34px}
.page-block:last-child{margin-bottom:0}
.page-text{color:var(--text);font-size:17px;line-height:1.75;max-width:820px;margin:0 auto}
.page-text.is-center{text-align:center}
.page-image{margin:0 auto;max-width:860px;text-align:center}
.page-image img{margin:0 auto;border-radius:var(--radius);max-height:520px;width:auto;max-width:100%;object-fit:contain;border:1px solid var(--line)}
.page-image figcaption{color:var(--muted);font-size:14px;margin-top:10px}
.page-actions{text-align:center}
.page-block .special-note{max-width:820px;margin-left:auto;margin-right:auto}
.page-block .features-grid .feature-card .card-img{width:100%;height:auto;max-height:200px;object-fit:cover;border-radius:12px;margin-bottom:16px}
.page-block .features-grid .feature-card .card-btn{margin-top:16px}

/* Offers */
.offers-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:20px}
.offer-card{position:relative;text-align:center;flex:1 1 300px;max-width:380px}
.offer-card[hidden],.offers-grid[hidden],.offers-empty[hidden]{display:none}
.offer-card .card-img{width:100%;height:auto;max-height:220px;object-fit:cover;border-radius:12px;margin-bottom:16px}
.offer-badge{position:absolute;top:14px;right:14px;background:var(--orange);color:#111827;font-weight:800;font-size:13px;padding:5px 12px;border-radius:999px;font-family:'Sora',Arial,sans-serif}
.offer-countdown{margin-top:14px;color:var(--orange-soft);font-weight:800;font-family:'Sora',Arial,sans-serif;font-size:15px;font-variant-numeric:tabular-nums}
.offer-card .card-btn{margin-top:16px}
.offers-empty{text-align:center;color:var(--muted);font-size:18px;padding:30px 0}
