/* rijeka.party redesign-v2: shared production shell for non-homepage templates. */
@font-face {
  font-family: "RP Syne";
  src: url("/assets/fonts/syne-latin-ext.woff2") format("woff2");
  font-weight: 400 800;
  font-display: swap;
  unicode-range: U+0100-024F, U+1E00-1EFF;
}

@font-face {
  font-family: "RP Syne";
  src: url("/assets/fonts/syne-latin.woff2") format("woff2");
  font-weight: 400 800;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+20AC;
}

@font-face {
  font-family: "RP Jakarta";
  src: url("/assets/fonts/plus-jakarta-sans-latin-ext.woff2") format("woff2");
  font-weight: 400 800;
  font-display: swap;
}

@font-face {
  font-family: "RP Newsreader";
  src: url("/assets/fonts/newsreader-display-bold.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
}

:root {
  --rp-ink: #0c0d0b;
  --rp-panel: #151713;
  --rp-panel-2: #1c1f19;
  --rp-paper: #f3efe4;
  --rp-muted: #9da296;
  --rp-line: rgba(243, 239, 228, .14);
  --rp-acid: #08c4e8;
  --rp-coral: #ff5c7a;
  --rp-cyan: #7ce5ff;
  --rp-violet: #9f82ff;
  --rp-radius: 22px;
  --header-height: 68px;
  --page: min(1440px, calc(100% - 48px));
  --shadow: 0 30px 80px rgba(0, 0, 0, .34);
}

html {
  scroll-padding-top: var(--header-height);
  scrollbar-gutter: auto;
  scrollbar-width: none;
}

/* The legacy stylesheet reserves a 10px custom scrollbar gutter. Restore the
   overlay-style behavior used by the redesigned homepage so every navbar
   receives the same available viewport width. Scrolling remains fully active. */
body { scrollbar-width: none; }
html::-webkit-scrollbar,
body::-webkit-scrollbar { width: 0; height: 0; }

body {
  color: var(--rp-paper);
  background:
    radial-gradient(circle at 82% 0%, rgba(124, 229, 255, .08), transparent 30rem),
    radial-gradient(circle at 12% 35%, rgba(255, 92, 122, .06), transparent 32rem),
    var(--rp-ink);
  font-family: "RP Jakarta", system-ui, sans-serif;
}

.grain-overlay { opacity: .16; }
.bg-glow-wrapper { opacity: .35; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  height: var(--header-height);
  border-bottom: 1px solid var(--rp-line);
  background: rgba(12, 13, 11, .84);
  backdrop-filter: blur(18px) saturate(135%);
}

.nav {
  width: var(--page);
  height: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

.wordmark {
  display: inline-flex;
  align-items: center;
  color: var(--rp-paper);
  font-family: "RP Syne", sans-serif;
  font-size: clamp(1.08rem, 2vw, 1.38rem);
  font-weight: 800;
  letter-spacing: -.06em;
  white-space: nowrap;
}
.wordmark i, .wordmark-party { color: var(--rp-acid); }
.wordmark i { font-style: normal; }
.wordmark::after { display: none; }

.desktop-nav { display: flex; align-items: center; gap: 6px; }
.desktop-nav a,
.nav-language {
  min-height: 44px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  color: #d8d5ca;
  font-size: .8rem;
  font-weight: 700;
}
.desktop-nav a:hover,
.desktop-nav a[aria-current="page"] { color: var(--rp-paper); background: rgba(255, 255, 255, .06); }
.nav-language { border: 1px solid var(--rp-line); background: transparent; }

.nav-cta {
  min-height: 44px;
  padding: 0 18px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border: 0;
  border-radius: 999px;
  color: var(--rp-ink) !important;
  background: var(--rp-acid) !important;
  font-weight: 800 !important;
}

.menu-button {
  width: 46px;
  height: 46px;
  padding: 0;
  display: none;
  place-items: center;
  color: var(--rp-paper);
  border: 1px solid var(--rp-line);
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
}
.menu-button svg { width: 21px; stroke: currentColor; }

.mobile-menu {
  position: fixed;
  inset: var(--header-height) 0 auto;
  z-index: 45;
  padding: 18px 24px 28px;
  display: none;
  border-bottom: 1px solid var(--rp-line);
  background: rgba(12, 13, 11, .97);
  box-shadow: var(--shadow);
}
.mobile-menu[aria-hidden="false"] { display: grid; }
.mobile-menu a {
  padding: 15px 0;
  border-bottom: 1px solid var(--rp-line);
  font-family: "RP Syne", sans-serif;
  font-size: 1.25rem;
  font-weight: 700;
}
.mobile-menu a[aria-current="page"] { color: var(--rp-cyan); }

.btn-primary {
  border: 0;
  border-radius: 999px;
  color: var(--rp-ink);
  background: var(--rp-acid);
  box-shadow: none;
  font-weight: 800;
}
.btn-primary:hover { color: var(--rp-ink); background: #45d5ef; transform: translateY(-1px); }

.main-content { padding-top: 0; }

.main-content > .section,
main > .section {
  width: min(1180px, calc(100% - 48px));
  margin-inline: auto;
  padding: clamp(54px, 7vw, 96px) 0 clamp(80px, 9vw, 130px);
}

.breadcrumbs {
  margin-bottom: clamp(34px, 5vw, 62px);
  color: var(--rp-muted);
  font-size: .7rem;
}
.breadcrumbs a:hover { color: var(--rp-cyan); }
.crumb-sep { color: rgba(243, 239, 228, .28); }

.section-subtitle {
  color: var(--rp-coral);
  font-family: "RP Jakarta", sans-serif;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.section-title {
  max-width: 1050px;
  margin: 12px 0 0;
  color: var(--rp-paper);
  font-family: "RP Jakarta", sans-serif;
  font-size: clamp(2.8rem, 6vw, 6.2rem);
  font-weight: 800;
  letter-spacing: -.045em;
  line-height: 1.08;
  text-wrap: balance;
}

/* Match the homepage hero identity, optically normalized to the former
   Jakarta title footprint. */
h1.section-title {
  font-family: "RP Syne", sans-serif;
  font-size: clamp(1.95rem, 4.15vw, 4.3rem);
}

.club-lead {
  max-width: 880px;
  margin: clamp(24px, 3vw, 38px) 0 0;
  color: #d8d5ca;
  font-size: clamp(1rem, 1.45vw, 1.18rem);
  line-height: 1.7;
}

.club-facts {
  margin-top: clamp(38px, 5vw, 68px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.fact-card {
  min-width: 0;
  min-height: 118px;
  padding: 20px;
  border: 1px solid var(--rp-line);
  border-radius: 18px;
  background: rgba(255, 255, 255, .025);
}
.fact-label { color: var(--rp-cyan); font-size: .62rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.fact-value { margin-top: 22px; color: var(--rp-paper); font-family: "RP Newsreader", Georgia, serif; font-size: 1.3rem; line-height: 1.08; }
.fact-value-combined span { display: block; }
.fact-value-combined span + span {
  margin-top: 7px;
  color: var(--rp-cyan);
  font-family: "RP Jakarta", sans-serif;
  font-size: .78rem;
  font-weight: 800;
}
.audience-generation-card {
  border-color: color-mix(in srgb, var(--rp-cyan) 55%, transparent);
  background: color-mix(in srgb, var(--rp-cyan) 8%, transparent);
}
.audience-generation-card .fact-value { margin-top: 16px; }
.audience-disclaimer {
  margin-top: 10px;
  color: var(--rp-muted);
  font-size: .63rem;
  line-height: 1.35;
}

.club-body {
  max-width: 900px;
  margin-top: clamp(42px, 6vw, 76px);
  color: #d8d5ca;
  font-size: clamp(1rem, 1.25vw, 1.1rem);
  line-height: 1.82;
}
.club-body h2,
.club-body h3 {
  margin-top: 2.2em;
  color: var(--rp-paper);
  font-family: "RP Newsreader", Georgia, serif;
  line-height: 1.06;
}
.club-body strong { color: var(--rp-paper); }
.club-body a,
.club-link { color: var(--rp-cyan); text-underline-offset: 3px; }
.club-body a:hover,
.club-link:hover { color: var(--rp-acid); }

.event-list { padding-left: 1.15rem; }
.event-list li { margin-bottom: .8rem; padding-left: .35rem; }

.club-page-actions {
  margin-top: clamp(42px, 6vw, 72px);
  padding-top: 26px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  border-top: 1px solid var(--rp-line);
}
.club-page-actions .btn-primary,
.club-page-actions .btn-secondary {
  min-height: 50px;
  padding: 0 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: .76rem;
  font-weight: 800;
}
.club-page-actions .btn-secondary {
  color: var(--rp-paper);
  border: 1px solid var(--rp-line);
  background: transparent;
}
.club-page-actions .btn-secondary:hover { border-color: var(--rp-cyan); background: rgba(124, 229, 255, .06); }

.clubs-grid {
  margin-top: clamp(38px, 5vw, 66px);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.club-card {
  min-width: 0;
  min-height: 310px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--rp-line);
  border-radius: var(--rp-radius);
  background: var(--rp-panel);
  box-shadow: none;
  transition: border-color .2s ease, transform .2s ease, background .2s ease;
}
.club-card:hover { border-color: rgba(124, 229, 255, .55); background: var(--rp-panel-2); transform: translateY(-3px); }
.club-header { gap: 16px; }
.club-name {
  color: var(--rp-paper);
  font-family: "RP Newsreader", Georgia, serif;
  font-size: clamp(1.55rem, 2.4vw, 2.15rem);
  line-height: .98;
}
.club-status {
  color: var(--rp-ink);
  border: 0;
  background: var(--rp-acid);
  font-size: .58rem;
  font-weight: 800;
}
.status-dot { background: var(--rp-coral); }
.club-info { color: var(--rp-muted); line-height: 1.6; }
.club-footer { margin-top: auto; padding-top: 22px; border-top: 1px solid var(--rp-line); }
.club-address { color: var(--rp-muted); }
.club-title-wrap { gap: 14px; }
.scene-avatar { border-color: var(--rp-line); }

.events-grid { gap: 14px; }
.event-card {
  border: 1px solid var(--rp-line);
  border-radius: var(--rp-radius);
  background: var(--rp-panel);
  box-shadow: none;
}
.event-title,
.event-title a { color: var(--rp-paper); font-family: "RP Newsreader", Georgia, serif; }
.event-description,
.event-meta { color: var(--rp-muted); }
.event-date-badge { background: var(--rp-acid); }

.playlist-tracks { gap: 8px; }
.playlist-track {
  border: 1px solid var(--rp-line);
  border-radius: 16px;
  background: var(--rp-panel);
}
.playlist-track-title { color: var(--rp-paper); font-family: "RP Newsreader", Georgia, serif; }
.playlist-track-artist,
.playlist-genre,
.playlist-method { color: var(--rp-muted); }
.playlist-youtube { color: var(--rp-ink); background: var(--rp-acid); border-radius: 999px; }
.playlist-featured-set { border: 1px solid var(--rp-line); border-radius: var(--rp-radius); background: var(--rp-panel); }
.playlist-featured-copy h2 { color: var(--rp-paper); font-family: "RP Newsreader", Georgia, serif; }

.map-shell,
.map-card,
#map {
  border-color: var(--rp-line) !important;
  border-radius: var(--rp-radius) !important;
}
.leaflet-container { z-index: 1; }

.site-footer {
  margin-top: 24px;
  padding: 54px 0;
  border-top: 1px solid var(--rp-line);
}
.footer-inner {
  width: var(--page);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 40px;
  align-items: end;
}
.footer-wordmark {
  min-width: 0;
  color: var(--rp-paper);
  font-family: "RP Syne", sans-serif;
  font-size: clamp(2.8rem, 7vw, 7.5rem);
  font-weight: 800;
  letter-spacing: -.085em;
  line-height: .8;
}
.footer-wordmark i { color: var(--rp-coral); font-style: normal; }
.footer-meta {
  display: grid;
  gap: 12px;
  justify-items: end;
  color: var(--rp-muted);
  font-size: .72rem;
}
.footer-meta a:hover { color: var(--rp-paper); }

@media (max-width: 980px) {
  .clubs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1080px) {
  .desktop-nav a:not(.nav-cta),
  .nav-language { display: none; }
  .menu-button { display: grid; }
}

@media (max-width: 760px) {
  .main-content > .section,
  main > .section { width: calc(100% - 28px); }

  :root { --header-height: 60px; --page: calc(100% - 28px); }
  .nav { width: var(--page); }
  .desktop-nav { display: none; }
  .menu-button { width: 42px; height: 42px; display: grid; }

  .main-content > .section,
  main > .section { padding-top: 38px; }
  .breadcrumbs { margin-bottom: 34px; overflow-x: auto; white-space: nowrap; }
  .section-title { font-size: clamp(2.35rem, 12vw, 4.2rem); }
  h1.section-title { font-size: clamp(1.75rem, 8.25vw, 3rem); }
  .club-lead { font-size: .98rem; }
  .club-facts { grid-template-columns: 1fr 1fr; }
  .fact-card { min-height: 106px; padding: 16px; }
  .fact-value { margin-top: 18px; font-size: 1.12rem; }
  .clubs-grid { grid-template-columns: 1fr; }
  .club-card { min-height: 280px; }
  .club-page-actions { display: grid; }
  .club-page-actions > * { width: 100%; }
  .footer-inner { grid-template-columns: minmax(0, 1fr); }
  .footer-wordmark { font-size: min(8vw, 2.7rem); }
  .footer-meta { justify-items: start; }
}

@media (max-width: 420px) {
  .club-facts { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}