/* =========================================================================
   legal.css — zajednički izgled pravnih stranica
   (kolacici.html, privatnost.html, uslovi.html)
   Jedno pravilo za tri stranice — vidi note.css za isti razlog.
   ========================================================================= */

.lg{max-width:920px;margin:0 auto;padding:clamp(120px,17vh,190px) clamp(20px,4.4vw,64px) clamp(60px,9vh,110px)}
.lg-eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.lg-eyebrow i{display:block;width:clamp(24px,3vw,44px);height:1px;background:var(--gold,#C9A227)}
.lg-eyebrow span{font-size:10px;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:rgba(250,251,252,.56)}
.lg h1{font-family:Jost,sans-serif;font-weight:200;font-size:clamp(34px,5.6vw,68px);line-height:1.02;letter-spacing:-.03em;margin:0}
.lg-upd{margin-top:14px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(250,251,252,.45)}
.lg-lede{margin-top:20px;font-size:clamp(14px,1.2vw,16px);line-height:1.68;color:rgba(250,251,252,.78)}

.lg h2{font-family:Jost,sans-serif;font-weight:300;font-size:clamp(21px,2.3vw,29px);letter-spacing:-.015em;
  margin:clamp(38px,5vh,58px) 0 0;padding-top:clamp(24px,3vh,32px);border-top:1px solid rgba(250,251,252,.12)}
.lg h3{font-family:Barlow,sans-serif;font-weight:600;font-size:15px;margin:26px 0 0;color:var(--gold,#C9A227)}
.lg p{margin:14px 0 0;font-size:14.5px;line-height:1.7;color:rgba(250,251,252,.78)}
.lg ul{margin:14px 0 0;padding-left:20px}
.lg li{margin:8px 0;font-size:14.5px;line-height:1.65;color:rgba(250,251,252,.78)}
.lg li b,.lg p b{color:#FAFBFC;font-weight:600}
.lg a{color:var(--gold,#C9A227);text-decoration:underline;text-underline-offset:2px}

/* tabela kolačića */
.lg-tw{margin-top:18px;overflow-x:auto;border:1px solid rgba(250,251,252,.13);border-radius:12px}
.lg-t{width:100%;border-collapse:collapse;min-width:560px}
.lg-t th,.lg-t td{padding:11px 14px;text-align:left;font-size:13px;line-height:1.5;
  border-top:1px solid rgba(250,251,252,.1);vertical-align:top}
.lg-t th{background:rgba(250,251,252,.05);font-weight:600;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(250,251,252,.6);border-top:0}
.lg-t td{color:rgba(250,251,252,.76)}
.lg-t td:first-child{font-family:ui-monospace,Menlo,Consolas,monospace;color:#FAFBFC;white-space:nowrap}

/* okvir s pozivom na radnju / napomenom */
.lg-box{margin-top:22px;padding:17px 20px;border-radius:12px;
  border:1px solid rgba(201,162,39,.42);background:rgba(201,162,39,.08)}
.lg-box p{margin:0;color:rgba(250,251,252,.85)}
.lg-box p + p{margin-top:10px}
.lg-btn{display:inline-flex;align-items:center;gap:9px;margin-top:14px;padding:12px 22px;border-radius:999px;
  border:0;background:var(--gold,#C9A227);color:#0B1F33;cursor:pointer;
  font:inherit;font-size:11.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
  transition:background .2s ease,transform .14s cubic-bezier(.34,1.56,.64,1)}
@media(hover:hover){.lg-btn:hover{background:#E0B72E}}
.lg-btn:active{transform:scale(.97)}
@media(pointer:coarse){.lg-btn{min-height:46px}}

.lg-meta{margin-top:26px;padding:16px 19px;border-radius:12px;
  border:1px solid rgba(250,251,252,.13);background:rgba(250,251,252,.035)}
.lg-meta p{margin:5px 0 0;font-size:13.5px}
.lg-meta p:first-child{margin-top:0}

/* ================= TABLICA KOLAČIĆA NA TELEFONU =================
   S pet kolona tablica ima min-width:560px, pa se na telefonu pomiče u
   stranu — a stupac „Svrha" nosi cijele rečenice, tako da korisnik čita
   dvije riječi pa vuče udesno. Umjesto toga svaki red postaje kartica:
   naziv kolone dolazi iz `data-l` na <td> (vidi kolacici.html).

   <thead> se skriva jer bi bez svojih ćelija ostao kao jedan zalijepljen
   red. Semantika ostaje ispravna: tablica je i dalje tablica, samo se
   drukčije prikazuje. */
@media(max-width:720px){
  .lg-tw{overflow-x:visible;border:0;border-radius:0}
  .lg-t{min-width:0;width:100%;display:block}
  .lg-t thead{
    /* Ne `display:none` — čitači ekrana tada gube zaglavlja. */
    position:absolute;width:1px;height:1px;overflow:hidden;
    clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;
  }
  .lg-t tbody,.lg-t tr,.lg-t td{display:block;width:auto}
  .lg-t tr{
    margin-bottom:12px;padding:4px 0;
    border:1px solid rgba(250,251,252,.13);border-radius:12px;
    background:rgba(250,251,252,.03);
    overflow:hidden;
  }
  .lg-t tr:last-child{margin-bottom:0}
  .lg-t td{
    border:0;border-top:1px solid rgba(250,251,252,.07);
    padding:9px 14px;
    display:grid;grid-template-columns:8.5em 1fr;gap:12px;align-items:baseline;
  }
  .lg-t tr td:first-child{border-top:0}
  .lg-t td::before{
    content:attr(data-l);
    font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
    color:rgba(250,251,252,.5);
  }
  /* Naziv kolačića je monospace i ne smije se lomiti nasred riječi, ali
     `_ga_1PH6FBTRXJ` mora smjeti prijeći u novi red ako zafali mjesta. */
  .lg-t td:first-child{white-space:normal;overflow-wrap:anywhere}
}