@charset "UTF-8";
/* Home page (index.html / rs/index.html) - page-specific layout, ported from Balkan Charlotte.dc.html's own <style> block, plus real CSS for hero-slider states the design canvas previously drove with inline style strings. Shared chrome (lang toggle, filter chips) lives in components.css. */

body { margin: 0; }
a { color: var(--color-accent-700); text-decoration: none; }
a:hover { color: var(--color-accent-900); text-decoration: underline; }
#cta-email::placeholder { color: var(--color-accent-400); }

.page-grid { display: grid; grid-template-columns: 1fr; justify-content: center; }
.ad-rail { display: none; }
.ad-leaderboard { display: block; }
.cta-band { grid-template-columns: 1fr; }
@media (min-width: 1100px) { .cta-band { grid-template-columns: 1fr auto; } }
.foot-nav a { white-space: nowrap; }
@media (min-width: 860px) {
  .page-grid { grid-template-columns: 100px minmax(0, 1180px) 100px; column-gap: 20px; }
  .ad-rail { display: flex; }
  .ad-leaderboard { display: none; }
}
@media (min-width: 1200px) {
  .page-grid { grid-template-columns: 130px minmax(0, 1180px) 130px; column-gap: 28px; }
}
@media (min-width: 1560px) {
  .page-grid { grid-template-columns: 160px minmax(0, 1180px) 160px; column-gap: 32px; }
}

@media (max-width: 760px) {
  .nav-bar { flex-wrap: wrap; gap: 12px !important; padding: 12px 18px !important; }
  .main-nav { order: 3; width: 100%; margin-left: 0 !important; gap: 20px !important; overflow-x: auto; padding-bottom: 2px; font-size: 14px !important; }
  .main-nav a { white-space: nowrap; }
  .nav-bar > a.btn { display: none; }
  .nav-bar > div:not(.main-nav) button,
  .nav-bar > div:not(.main-nav) a.lang-btn { font-size: 11px !important; padding: 6px 9px !important; }
  .site-footer { flex-direction: column; gap: 24px !important; }
  .site-footer > div { margin-left: 0 !important; }
  .m-pad { padding-left: 18px !important; padding-right: 18px !important; }
  .m-h1 { font-size: 34px !important; line-height: 1.05 !important; }
  .m-h2 { font-size: 28px !important; }
  .m-band { padding: 32px 20px !important; }
}

@media (max-width: 760px) {
  .hero-split { grid-template-columns: 1fr !important; }
  .hero-split > div:last-child { border-left: 0 !important; border-top: 1px solid var(--color-divider); min-height: 240px; }
  .hero-split > div:first-child { padding: 28px 20px !important; }
  .card-grid { grid-template-columns: 1fr !important; }
  .hero-slider { height: 340px !important; }
  .slider-overlay { flex-wrap: wrap; gap: 12px !important; }
  .slider-plate { max-width: none !important; width: 100%; padding: 14px 16px !important; }
  .slider-line { font-size: 19px !important; }
  .slider-controls { margin-left: 0 !important; }
  .slider-controls button.btn { display: none; }
  .cta-band input { min-width: 0 !important; width: 100%; }
  .cta-band > div:last-child { flex-wrap: wrap; }
}

/* - hero slider - */
.hero-slide { position: absolute; inset: 0; display: none; }
.hero-slide.is-active { display: block; }
.slider-dot {
  width: 9px; height: 9px; padding: 0; border: 1px solid var(--color-accent-700);
  cursor: pointer; border-radius: 0; background: var(--color-bg);
}
.slider-dot.active { background: var(--color-accent-700); }
.slider-nav-btn:hover { background: var(--color-accent-100); }

.event-card-title a:hover { color: var(--color-accent-700); }
