/* Ženski ragbi Srbija — globalni reset, pomoćne klase, responsive.
   Bazirano na originalnom dizajnu (Anton/Archivo/Space Grotesk). */

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: #0A0A0B; }
body { -webkit-font-smoothing: antialiased; }

.zr2 { --accent: #B11030; --ink: #0A0A0B; --paper: #F4F1EA; }
.zr2 a { color: inherit; }

::selection { background: var(--accent); color: #fff; }

.lift { transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease; }
.lift:hover { transform: translateY(-4px); }

.zr2 input, .zr2 textarea { font-family: 'Space Grotesk', sans-serif; }
.zr2 input:focus, .zr2 textarea:focus { outline: none; border-color: var(--accent) !important; }

@keyframes mk  { from { transform: translateX(0)      } to { transform: translateX(-50%) } }
@keyframes mk2 { from { transform: translateX(-50%)   } to { transform: translateX(0)     } }

.outline-txt  { -webkit-text-stroke: 2px rgba(255,255,255,0.13); color: transparent; }
.outline-dark { -webkit-text-stroke: 2px rgba(10,10,11,0.14);   color: transparent; }

/* Akordeon (FAQ / Početna) — animirano otvaranje */
.zr-acc-q { cursor: pointer; }
.zr-acc-a { overflow: hidden; max-height: 0; opacity: 0; transition: max-height .28s ease, opacity .2s ease, margin .2s ease; }
.zr-acc.open .zr-acc-a { max-height: 600px; opacity: 1; }
.zr-acc.open .zr-acc-plus { transform: rotate(45deg); }
.zr-acc-plus { transition: transform .2s ease; }

/* Izbor iskustva (Učlanjenje) */
.zr-exp { cursor: pointer; }

/* Galerija */
.zr-gal-item { cursor: zoom-in; }
.zr-gal-item img { transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.zr-gal-item:hover img { transform: scale(1.05); }
.zr-gal-item:hover { border-color: var(--accent) !important; }
.zr-gal-item:hover .zr-gal-ov { background: linear-gradient(180deg, rgba(177,16,48,0.12), rgba(10,10,11,0.30)) !important; }
.zr-lb-nav:hover, #zr-lb-close:hover { color: var(--accent); }
@media (max-width: 560px) {
  #zr-lb .zr-lb-nav { font-size: 34px; }
}

/* ---- Hamburger meni (mobilni) ---- */
.zr-burger {
  display: none;            /* sakriven na desktopu */
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 42px; height: 42px;
  padding: 9px;
  background: transparent;
  border: 1px solid #2a2a2e;
  border-radius: 8px;
  cursor: pointer;
}
.zr-burger span {
  display: block;
  width: 100%; height: 2px;
  background: #F4F1EA;
  border-radius: 2px;
  transition: transform .25s ease, opacity .2s ease;
}

/* ---- Responsive (dizajn je primarno za desktop; ovde lake korekcije za mobilni) ---- */
@media (max-width: 980px) {
  .zr2 .zr-navlinks { gap: 18px; font-size: 12px; }
}
@media (max-width: 860px) {
  .zr2 h1 { font-size: 13vw !important; }
  .zr2 .outline-txt { font-size: 26vw !important; }
  .zr2 [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  .zr2 [style*="max-width: 1320px"],
  .zr2 [style*="max-width:1320px"] { padding-left: 22px !important; padding-right: 22px !important; }

  /* prikaži hamburger, sakrij horizontalne linkove */
  .zr-burger { display: flex; }
  .zr-navbar .zr-navlinks {
    position: absolute;
    top: 100%; left: 0; right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 2px !important;
    background: rgba(10,10,11,0.98);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid #1c1c1f;
    padding: 12px 22px 22px;
    display: none !important;          /* nadjačava inline display:flex */
    box-shadow: 0 24px 40px rgba(0,0,0,0.45);
  }
  .zr-navbar.zr-open .zr-navlinks { display: flex !important; }
  .zr-navbar .zr-navlinks a {
    padding: 13px 4px;
    font-size: 15px;
    border-bottom: 1px solid #18181b;
  }
  .zr-navbar .zr-navlinks > span { padding: 13px 4px; }      /* SR / EN */
  .zr-navbar .zr-navlinks a.lift {
    margin-top: 12px;
    text-align: center;
    border-bottom: 0;
    padding: 15px;
    clip-path: none !important;
    border-radius: 6px;
  }
  /* hamburger -> X kad je otvoren */
  .zr-navbar.zr-open .zr-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .zr-navbar.zr-open .zr-burger span:nth-child(2) { opacity: 0; }
  .zr-navbar.zr-open .zr-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
}