/* =============================================================================
   MONVIQ · STRANA: LEGAL (Impressum · Datenschutzerklärung · Cookie-Richtlinie)
   Jedan šablon, tri dokumenta. Komponenta id 58 (monviq-legal).
   Sve vrednosti preko var(--mv-*) iz /public/css/tokens.css. Prefiks: .mv-lg-*
   Namerno najtiša strana sajta — jedini pokret je scroll-spy na sticky TOC-u.
   ========================================================================== */

/* glatko skrolovanje SAMO na legal stranama (anchor iz TOC-a) */
html:has(.mv-lg-body){scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html:has(.mv-lg-body){scroll-behavior:auto}}

/* -----------------------------------------------------------------------------
   1. DOCUMENT HEADER — uzak tamni band umesto hero-a
   -------------------------------------------------------------------------- */
.mv-lg-hd{padding:calc(var(--mv-header-h) + clamp(26px,3.2vw,44px)) 0 clamp(26px,3vw,40px);
  border-bottom:1px solid var(--mv-line-gold);background:var(--mv-canvas)}
.mv-lg-hd__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.62fr);
  gap:var(--mv-sp-6) var(--mv-gap-col);align-items:end;margin-top:var(--mv-sp-e3)}
.mv-lg-hd__t{font-size:var(--mv-fs-h2-xs);line-height:var(--mv-lh-h3);max-width:20ch}
p.mv-lg-hd__lead{margin-top:var(--mv-sp-4);max-width:var(--mv-measure-lead);
  font-size:var(--mv-fs-body-sm);line-height:var(--mv-lh-prose);color:var(--mv-on-dark-mut)}

/* meta blok — Last updated · jezik */
.mv-lg-meta{border-left:1px solid var(--mv-line-gold);padding-left:var(--mv-sp-e2)}
.mv-lg-meta__it{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--mv-sp-2) var(--mv-sp-4);
  padding:var(--mv-sp-2) 0}
.mv-lg-meta__it+.mv-lg-meta__it{border-top:1px solid var(--mv-line-dark)}
.mv-lg-meta__k{flex:0 0 auto;min-width:9ch;font-size:var(--mv-fs-micro);font-weight:var(--mv-fw-semi);
  letter-spacing:var(--mv-ls-micro);text-transform:uppercase;color:var(--mv-on-dark-faint)}
.mv-lg-meta__v{font-size:var(--mv-fs-body-xs);letter-spacing:.06em;color:var(--mv-on-dark)}
.mv-lg-meta__v b{font-weight:var(--mv-fw-semi);color:var(--mv-accent)}
.mv-lg-meta__v i{font-style:normal;margin:0 6px;color:var(--mv-on-dark-faint)}
.mv-lg-meta__v s{text-decoration:none;color:var(--mv-on-dark-faint)}
p.mv-lg-meta__note{margin-top:var(--mv-sp-3);font-size:var(--mv-fs-small);line-height:var(--mv-lh-body);
  color:var(--mv-on-dark-soft);max-width:44ch}

/* prekidač između tri dokumenta */
.mv-lg-switch{display:flex;flex-wrap:wrap;gap:var(--mv-sp-2) var(--mv-sp-6);
  margin-top:clamp(24px,3vw,40px);padding-top:var(--mv-sp-4);
  border-top:1px solid var(--mv-line-dark)}
.mv-lg-switch__a{position:relative;display:inline-block;padding:6px 0;font-size:var(--mv-fs-nav);
  font-weight:var(--mv-fw-medium);letter-spacing:var(--mv-ls-btn);text-transform:uppercase;
  color:var(--mv-on-dark-mut);transition:color var(--mv-dur-base)}
.mv-lg-switch__a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;
  background:var(--mv-accent);transition:right var(--mv-dur-nav) var(--mv-ease)}
.mv-lg-switch a:hover .mv-lg-switch__a,.mv-lg-switch__a:hover{color:var(--mv-white)}
.mv-lg-switch a:hover .mv-lg-switch__a::after,.mv-lg-switch__a:hover::after{right:0}
.mv-lg-switch__a.is-cur{color:var(--mv-accent);cursor:default}
.mv-lg-switch__a.is-cur::after{right:0}

/* -----------------------------------------------------------------------------
   2. TELO — sticky TOC (25%) + tekst (66ch)
   -------------------------------------------------------------------------- */
.mv-lg-body{padding:clamp(56px,7vw,96px) 0 clamp(64px,8vw,110px)}
.mv-lg-grid{display:grid;grid-template-columns:minmax(0,.28fr) minmax(0,.72fr);
  gap:var(--mv-gap-col);align-items:start}

/* --- TOC --- */
.mv-lg-toc{position:sticky;top:calc(var(--mv-header-h-solid) + var(--mv-sp-5));
  align-self:start;max-height:calc(100vh - var(--mv-header-h-solid) - var(--mv-sp-8));
  overflow-y:auto;overscroll-behavior:contain}
.mv-lg-toc__k{font-size:var(--mv-fs-micro-xs);font-weight:var(--mv-fw-semi);
  letter-spacing:var(--mv-ls-h4);text-transform:uppercase;color:var(--mv-on-light-mut);
  padding-bottom:var(--mv-sp-3);border-bottom:1px solid var(--mv-line-light)}
.mv-lg-toc__l{position:relative;list-style:none;margin:0;padding:0 0 0 var(--mv-sp-4)}
.mv-lg-toc__l::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;
  background:var(--mv-line-light)}
/* zlatni segment koji klizi uz aktivnu stavku — jedini WOW na strani */
.mv-lg-toc__rail{position:relative;z-index:1}
.mv-lg-toc__rail i{position:absolute;left:0;top:0;width:2px;height:0;background:var(--mv-accent-deep);
  transform:translateY(0);
  transition:transform var(--mv-dur-base) var(--mv-ease),height var(--mv-dur-base) var(--mv-ease)}
.mv-lg-toc__l li{margin:0}
.mv-lg-toc__l a{display:flex;gap:var(--mv-sp-3);align-items:baseline;padding:9px 0;
  font-size:var(--mv-fs-body-xs);line-height:1.45;color:var(--mv-on-light-mut);
  transition:color var(--mv-dur-base)}
.mv-lg-toc__l a:hover{color:var(--mv-on-light)}
.mv-lg-toc__l a.is-cur{color:var(--mv-on-light)}
.mv-lg-toc__n{flex:0 0 auto;font-size:var(--mv-fs-micro);font-weight:var(--mv-fw-semi);
  letter-spacing:var(--mv-ls-micro);color:rgba(18,22,31,.35);transition:color var(--mv-dur-base)}
.mv-lg-toc__l a.is-cur .mv-lg-toc__n{color:var(--mv-accent-deep)}
.mv-lg-toc__t{display:block}
.mv-lg-toc__l a:focus-visible{outline:var(--mv-focus-w) solid var(--mv-accent-deep);
  outline-offset:var(--mv-focus-offset)}

/* --- dokument --- */
.mv-lg-doc{max-width:var(--mv-measure);min-width:0}
.mv-lg-sec{scroll-margin-top:calc(var(--mv-header-h-solid) + var(--mv-sp-6));
  padding:clamp(32px,3.6vw,48px) 0;border-top:1px solid var(--mv-line-light)}
.mv-lg-sec:first-child{padding-top:0;border-top:0}
.mv-lg-h2{display:flex;gap:var(--mv-sp-4);align-items:baseline;
  font-size:var(--mv-fs-title-md);line-height:var(--mv-lh-title);letter-spacing:var(--mv-ls-tight)}
/* naslov → prvi blok: veći vazduh nego između pasusa */
.mv-lg-h2+.mv-lg-p,.mv-lg-h2+.mv-lg-ul,.mv-lg-h2+.mv-lg-dl,.mv-lg-h2+.mv-lg-tw{
  margin-top:var(--mv-sp-e4)}
.mv-lg-h2__n{flex:0 0 auto;font-family:var(--mv-font-body);font-size:var(--mv-fs-micro);
  font-weight:var(--mv-fw-semi);letter-spacing:var(--mv-ls-micro);color:var(--mv-accent-deep)}
.mv-lg-h3{margin-top:var(--mv-sp-5);font-size:var(--mv-fs-title-sm);color:var(--mv-on-light)}

p.mv-lg-p{margin-top:var(--mv-sp-5);font-size:var(--mv-fs-prose);line-height:var(--mv-lh-prose);
  color:var(--mv-on-light-mut)}
.mv-lg-link{display:inline-flex;align-items:center;gap:var(--mv-sp-2);color:var(--mv-accent-deep);
  font-weight:var(--mv-fw-semi);border-bottom:1px solid rgba(138,107,24,.35);padding-bottom:1px;
  transition:border-color var(--mv-dur-base),color var(--mv-dur-base)}
.mv-lg-link:hover{color:var(--mv-on-light);border-bottom-color:var(--mv-on-light)}
.mv-lg-link .mv-ar{transition:transform var(--mv-dur-base) var(--mv-ease)}
.mv-lg-link:hover .mv-ar{transform:translateX(4px)}
.mv-lg-link:focus-visible{outline:var(--mv-focus-w) solid var(--mv-accent-deep);
  outline-offset:var(--mv-focus-offset)}

/* lista */
.mv-lg-ul{list-style:none;margin:var(--mv-sp-5) 0 0;padding:0;display:grid;gap:var(--mv-sp-3)}
.mv-lg-ul li{position:relative;padding-left:var(--mv-sp-5);font-size:var(--mv-fs-prose);
  line-height:var(--mv-lh-prose);color:var(--mv-on-light-mut)}
.mv-lg-ul li::before{content:"";position:absolute;left:0;top:.72em;width:10px;height:1px;
  background:var(--mv-accent-deep)}

/* definicijska lista (podaci firme / kontroler) */
.mv-lg-dl{display:grid;grid-template-columns:minmax(11ch,auto) minmax(0,1fr);
  gap:var(--mv-sp-3) var(--mv-sp-6);margin:var(--mv-sp-5) 0 0;
  padding-top:var(--mv-sp-4);border-top:1px solid var(--mv-line-light)}
.mv-lg-dl dt{font-size:var(--mv-fs-micro);font-weight:var(--mv-fw-semi);
  letter-spacing:var(--mv-ls-micro);text-transform:uppercase;color:var(--mv-on-light-mut);
  padding-top:.25em}
.mv-lg-dl dd{margin:0;font-size:var(--mv-fs-body-sm);line-height:var(--mv-lh-body);
  color:var(--mv-on-light)}

/* tabela */
.mv-lg-tw{margin-top:var(--mv-sp-5);overflow-x:auto;-webkit-overflow-scrolling:touch;
  border-top:1px solid var(--mv-line-light);
  /* nagoveštaj horizontalnog skrola (čisti CSS: pokrivači „local" + senke „scroll") */
  background:
    linear-gradient(90deg,var(--mv-canvas-light) 40%,rgba(243,242,238,0)) left/34px 100% no-repeat local,
    linear-gradient(270deg,var(--mv-canvas-light) 40%,rgba(243,242,238,0)) right/34px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%,rgba(18,22,31,.14),transparent) left/12px 100% no-repeat,
    radial-gradient(farthest-side at 100% 50%,rgba(18,22,31,.14),transparent) right/12px 100% no-repeat}
.mv-lg-tw:focus-visible{outline:var(--mv-focus-w) solid var(--mv-accent-deep);outline-offset:2px}
.mv-lg-tb{width:100%;min-width:560px;border-collapse:collapse;text-align:left}
.mv-lg-tb th{padding:var(--mv-sp-3) var(--mv-sp-4) var(--mv-sp-3) 0;
  font-family:var(--mv-font-body);font-size:var(--mv-fs-micro);font-weight:var(--mv-fw-semi);
  letter-spacing:var(--mv-ls-micro);text-transform:uppercase;color:var(--mv-on-light-mut);
  border-bottom:1px solid var(--mv-line-light);vertical-align:bottom}
.mv-lg-tb td{padding:var(--mv-sp-4) var(--mv-sp-4) var(--mv-sp-4) 0;font-size:var(--mv-fs-body-sm);
  line-height:var(--mv-lh-body);color:var(--mv-on-light-mut);
  border-bottom:1px solid var(--mv-line-light);vertical-align:top}
.mv-lg-tb td:first-child{color:var(--mv-on-light);font-weight:var(--mv-fw-medium)}
.mv-lg-tb tr:last-child td{border-bottom:0}

/* -----------------------------------------------------------------------------
   3. CONTACT STRIP — uska traka, drugi svetli nivo
   -------------------------------------------------------------------------- */
.mv-lg-strip{background:var(--mv-surface-light);border-top:1px solid var(--mv-line-light);
  padding:clamp(40px,4.6vw,64px) 0}
.mv-lg-strip__in{display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,.58fr);
  gap:var(--mv-sp-6) var(--mv-gap-col);align-items:start}
.mv-lg-strip__addr{margin-top:var(--mv-sp-4);display:grid;gap:var(--mv-sp-2);
  font-size:var(--mv-fs-body-sm);line-height:var(--mv-lh-body);color:var(--mv-on-light-mut)}
.mv-lg-strip__addr b{font-family:var(--mv-font-display);font-size:var(--mv-fs-title-sm);
  font-weight:var(--mv-fw-bold);letter-spacing:var(--mv-ls-tight);color:var(--mv-on-light)}
.mv-lg-strip__addr a{color:var(--mv-accent-deep);border-bottom:1px solid rgba(138,107,24,.35);
  justify-self:start;transition:border-color var(--mv-dur-base),color var(--mv-dur-base)}
.mv-lg-strip__addr a:hover{color:var(--mv-on-light);border-bottom-color:var(--mv-on-light)}
.mv-lg-strip__p{font-size:var(--mv-fs-body-sm);line-height:var(--mv-lh-prose);
  color:var(--mv-on-light-mut);max-width:52ch}
.mv-lg-strip__cta{margin-top:var(--mv-sp-5)}

/* -----------------------------------------------------------------------------
   4. RESPONSIVE
   -------------------------------------------------------------------------- */
@media(max-width:1000px){
  .mv-lg-hd__in{grid-template-columns:1fr;align-items:start}
  .mv-lg-meta{border-left:0;border-top:1px solid var(--mv-line-dark);padding-left:0;
    padding-top:var(--mv-sp-4)}
  .mv-lg-grid{grid-template-columns:1fr;gap:var(--mv-sp-7)}
  .mv-lg-toc{position:static;max-height:none;overflow:visible;
    padding:var(--mv-sp-5) 0;border-top:1px solid var(--mv-line-light);
    border-bottom:1px solid var(--mv-line-light)}
  .mv-lg-toc__l{columns:2;column-gap:var(--mv-sp-6);padding-left:var(--mv-sp-4)}
  .mv-lg-toc__l li{break-inside:avoid}
  .mv-lg-toc__rail{display:none}
  .mv-lg-doc{max-width:none}
  .mv-lg-strip__in{grid-template-columns:1fr}
}
@media(max-width:760px){
  .mv-lg-hd{padding-top:calc(88px + var(--mv-sp-7))}
  .mv-lg-toc__l{columns:1}
  .mv-lg-h2{gap:var(--mv-sp-3)}
  .mv-lg-dl{grid-template-columns:1fr;gap:var(--mv-sp-1) 0}
  .mv-lg-dl dd{margin-bottom:var(--mv-sp-3)}
  .mv-lg-dl dd:last-child{margin-bottom:0}
}