/* ============================================================
   MOBILE — terms pages (/koristenje, /privatnost, /svojina, /looia) (≤ 768px)
   Nav, mobile menu, footer, CTA and font sizes come from shared.css
   ============================================================ */
@media (max-width: 768px) {
  body { overflow-x: hidden; }
  :root { --gutter: 26px; }
  .container { padding-left: 26px; padding-right: 26px; }
  /* NAV: comes from shared.css. Light hero, so the burger bars stay dark */
  .site-header .nav__burger span { background: #111111; }
  body.nav-open .site-header .nav__burger span { background: #ffffff; }

  /* ── HERO ── */
  .hero--terms { height: auto; min-height: 0; }
  .hero--terms .hero__content {
    position: relative;
    top: auto; left: auto; transform: none;
    width: 100%;
    padding: 190px 26px 50px;
    display: block;
    text-align: left;
  }
  .hero--terms .hero__heading { text-align: left; margin: 0; }
  .hero--terms .hero__sub { max-width: 100%; margin: 20px 0 0; text-align: left; }
  .hero--terms .br-d { display: none; }

  /* ── TERMS TEXT ── */
  .section-terms { padding: 10px 0 40px; }
  .terms-block { padding: 28px 0; }
  .terms-block__title { margin-bottom: 12px; }

  /* ── GLOSSARY ── */
  .gloss-nav { margin-bottom: 36px; }
  .gloss-cat { padding: 36px 0 12px; }
  .gloss-cat__title { margin-bottom: 32px; font-size: 30px; }
  .gloss-term__name h3 { font-size: 19px; }
  .gloss-term { grid-template-columns: 1fr; gap: 8px; padding: 20px 0; }

  /* ── COLLAPSIBLE QUESTIONS ── */
  .terms-faq .faq-item__q { padding: 20px 0; }
}