/* Advertising banners: horizontal slider, vertical sliding column, slide-up bar, top strip */
.bn { position: relative; overflow: hidden; border-radius: var(--radius, 14px); background: #fff; box-shadow: 0 6px 24px rgba(0,0,0,.10); }
.bn img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bn a { display: block; height: 100%; }
.bn-tag { position: absolute; top: 8px; inset-inline-start: 8px; z-index: 3; background: rgba(0,0,0,.55); color: #fff; font-size: .72rem; padding: 1px 9px; border-radius: 999px; }
.bn-viewport { overflow: hidden; width: 100%; height: 100%; }
.bn-slide { flex: 0 0 100%; min-width: 0; }
.bn-dots { position: absolute; bottom: 8px; inset-inline: 0; display: flex; justify-content: center; gap: 8px; z-index: 3; }
.bn-dot { width: 12px; height: 12px; border-radius: 50%; border: 2px solid #fff; background: rgba(0,0,0,.35); padding: 0; cursor: pointer; }
.bn-dot.on { background: var(--gold, #C6A15B); }
/* horizontal slider / strip: tracks move sideways */
.bn-slider .bn-track, .bn-strip .bn-track { display: flex; transition: transform .6s ease; }
html[dir=rtl] .bn-slider .bn-track, html[dir=rtl] .bn-strip .bn-track { flex-direction: row; direction: ltr; }   /* JS drives translateX in physical pixels */
.bn-slider { aspect-ratio: 3 / 1; max-width: 1120px; margin: 22px auto 0; }
.bn-strip { aspect-ratio: auto; border-radius: 0; box-shadow: none; max-height: 90px; }
.bn-strip .bn-slide { max-height: 90px; } .bn-strip img { object-fit: contain; max-height: 90px; background: #fff; }
.bn-strip .bn-dots { display: none; }
/* vertical: tracks move up */
.bn-vertical { width: 100%; max-width: 300px; aspect-ratio: 1 / 2; margin-inline: auto; }
.bn-vertical .bn-track { display: flex; flex-direction: column; height: 100%; transition: transform .7s ease; }
.bn-vertical .bn-slide { flex: 0 0 100%; height: 100%; }
.bn-vertical .bn-dots { flex-direction: column; inset-inline: auto; inset-inline-end: 8px; top: 0; bottom: 0; align-items: center; justify-content: center; }
/* slide-up from bottom */
.bn-slideup { position: fixed; inset-inline: 0; bottom: 0; margin: 0 auto 12px; width: min(728px, calc(100% - 24px)); z-index: 80; transform: translateY(140%); transition: transform .6s cubic-bezier(.2,.8,.2,1); aspect-ratio: auto; }
.bn-slideup.show { transform: translateY(0); }
.bn-slideup .bn-slide { max-height: 130px; } .bn-slideup img { object-fit: contain; max-height: 130px; background: #fff; }
.bn-close { position: absolute; top: 4px; inset-inline-end: 6px; z-index: 4; width: 34px; height: 34px; border-radius: 50%; border: 0; background: rgba(0,0,0,.65); color: #fff; font-size: 1.3rem; cursor: pointer; line-height: 1; }
@media (max-width: 1100px) { .bn-slideup { bottom: 84px; } }   /* clear the phone tab bar */
/* announcement bar */
.announce { text-align: center; padding: 10px 16px; font-weight: 700; color: #fff; }
.announce a { color: #fff; text-decoration: underline; }
/* home layout with vertical banner column */
.home-split { display: grid; grid-template-columns: 1fr 300px; gap: 24px; align-items: start; }
@media (max-width: 960px) { .home-split { grid-template-columns: 1fr; } .bn-vertical { max-width: 320px; margin-top: 18px; } }
.maint { min-height: 70vh; display: grid; place-items: center; text-align: center; padding: 30px; } .maint h1 { font-size: 2rem; }
