/* ==========================================================================
   MATHIA — jedinstveni tipografski i stilski sloj (učitava se POSLEDNJI).
   Cilj: svaka strana istog, prefinjenog izgleda — jedan naslovni font
   (Spectral), jedan tekstualni (Inter), pravi (lining) brojevi svuda,
   i sitne poliranja. Ne dira KaTeX (matematika ostaje u svom fontu).
   Idempotentno: uključuje se preko <link href="mathia-type.css"> pred </head>.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400;1,500;1,600&family=Inter:wght@400;500;600;700;800&display=swap');

/* — pravi brojevi svuda (rešava „1" koje je izgledalo kao rimsko „I") — */
:root{ --mathia-serif:'Spectral',Georgia,'Times New Roman',serif;
       --mathia-sans:'Inter',system-ui,-apple-system,'Segoe UI',Arial,sans-serif; }
html{ -webkit-text-size-adjust:100%; }
body{ font-variant-numeric: lining-nums proportional-nums; }

/* — telo teksta: jedinstven sans (ne dira KaTeX ni ikonske fontove) — */
body, p, li, dd, dt, blockquote, figcaption, label, input, textarea, select,
button, .subtitle, .lead, .tnum, .bx-h, .kind, .brandline, .foot, .foot2{
  font-family: var(--mathia-sans) !important;
}

/* — naslovi i „pečati": jedinstven serif (Spectral), sa lining brojevima — */
h1, h2, h3, h4, .cover h1, .topic h2, .seal, .quote, .display,
[class*="title"], [class*="Title"], [class*="hero"] [class*="head"]{
  font-family: var(--mathia-serif) !important;
  font-variant-numeric: lining-nums;
  letter-spacing:-.003em;
  line-height:1.28;            /* 1.16 je bilo preusko — naslovi su se lepili */
}
/* Tekst treba da diše: Spectral/Inter na gustom rasporedu deluju zbijeno */
body, p, li{ letter-spacing:0; line-height:1.65; }
p{ margin-block: .85em; }
li{ margin-block: .35em; }
h1,h2,h3,h4{ margin-block-start: 1.4em; margin-block-end: .5em; }

/* — KaTeX: NE DIRAJ font-family. —————————————————————————————
   Ranije je ovde stajalo `.katex, .katex * { font-family: ... !important }`
   kao tobožnja zaštita. To je zapravo LOMILO matematiku: KaTeX koristi
   KaTeX_Size1–Size4 za velike znake (∫, ∑, zagrade), pa ih je taj !important
   gazio u KaTeX_Main — integral bi dobio pogrešnu veličinu i granice bi mu
   pobegle. KaTeX sam zna svoje fontove; naša globalna pravila ga ionako ne
   pogađaju jer katex.css postavlja font-family direktno na svoje spanove.
   Ovde ostaje samo ono što je bezbedno i potrebno. */
.katex, .katex *{ font-variant-numeric: normal !important; }   /* lining-nums sa body ne sme u formule */
.katex-display{ margin: 1.1em 0; }                              /* formula u bloku diše */
.katex-display > .katex{ white-space: normal; }                 /* duge formule smeju da se prelome */

/* — jezički prekidač: isti, čist izgled na svakoj strani — */
select.lang, .lang{
  font-family: var(--mathia-sans) !important;
  font-weight:700; letter-spacing:.01em;
}

/* — sitna poliranja koja podižu utisak (bezbedna, globalna) — */
*{ text-rendering: optimizeLegibility; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
::selection{ background:#E7D2A2; color:#432C37; }
html{ scroll-behavior:smooth; }
a{ text-underline-offset:2px; }
button, .btn, [role="button"]{ letter-spacing:.005em; }
img{ image-rendering:auto; }

/* — fokus prsten (pristupačnost + doima se dovršeno) — */
a:focus-visible, button:focus-visible, select:focus-visible,
input:focus-visible, [tabindex]:focus-visible{
  outline:2px solid #C6A05C; outline-offset:2px; border-radius:6px;
}

/* — tanka, elegantna traka za skrol (webkit) — */
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-thumb{ background:#E7D2A2; border-radius:999px; border:3px solid transparent; background-clip:content-box; }
::-webkit-scrollbar-thumb:hover{ background:#C6A05C; background-clip:content-box; }

/* — suptilni, bezbedni prelazi (ne menjaju raspored) — */
a, button, .btn, select, [role="button"], .tile, .card{
  transition: transform .16s cubic-bezier(.2,.7,.2,1), box-shadow .22s ease,
              background-color .2s ease, color .2s ease, border-color .2s ease, filter .2s ease;
}
button:hover, .btn:hover, [role="button"]:hover{ filter:brightness(1.03) saturate(1.02); }
button:active, .btn:active, [role="button"]:active{ transform: translateY(1px); }
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ transition:none !important; animation:none !important; scroll-behavior:auto !important; }
}

/* ==========================================================================
   PREMIUM HARMONIZE v2 (uravnoteženo) — „nalog" osećaj na CELOM sajtu.
   Aditivno i bezbedno: samo hover-život, zlatni akcenti i sjaj dugmadi.
   Ne menja raspored, ne dodaje overflow na kartice (badge-top viri van njih),
   ne menja boju dugmadi. Reduced-motion je već ugašen globalno gore.
   ========================================================================== */

/* — kartice: nežan lift + topla zlatna ivica + tanka zlatna nit na vrhu (hover) — */
.card,.tile,.quote,.step,.tier,.plan,.product,.matcard,.pcard,.tcard{
  transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s ease,border-color .3s ease;
}
.card:hover,.tile:hover,.quote:hover,.step:hover,.tier:hover,.plan:hover,.product:hover,.matcard:hover,.pcard:hover,.tcard:hover{
  transform:translateY(-4px);
  box-shadow:0 22px 44px -28px rgba(67,44,55,.40), inset 0 2px 0 rgba(198,160,92,.85);
  border-color:#E7D2A2;
}

/* — zlatna dugmad: lagani lift na hover; postojeći sjaj (::after) na stranama
   koje ga imaju NE diramo — samo ujednačimo osećaj dizanja — */
.btn-gold{transition:transform .2s ease,box-shadow .22s ease,filter .2s ease}
.btn-gold:hover{transform:translateY(-2px)}

/* — čipovi/pilule: dosledan mek zlatni hover — */
.schips span,.chip,.pill,.schip{transition:border-color .2s ease,background-color .2s ease}
.schips span:hover,.chip:hover,.schip:hover{border-color:#E7D2A2;background:#FBF3E2}

/* ——— LUKSUZ v3: prozračno, elegantno, savršeno na svim uređajima ——— */
img{max-width:100%}
hr{border:none;height:1px;background:linear-gradient(90deg,transparent,rgba(198,160,92,.45),transparent);margin:2.2rem 0}
blockquote{font-family:var(--mathia-serif);font-style:italic;color:#5C3B49;border-left:2px solid #C6A05C;padding-left:1.1rem;margin:1.4rem 0}
h1,h2{letter-spacing:-.004em}

/* ==========================================================================
   LUKSUZNI HEADER — CEO SAJT (sve strane dele klase .nav/.brand/.bmark/.link).
   Konzervativno: NE smanjuje, samo podiže na „skupo". Ne dira hamburger meni.
   ========================================================================== */
header{border-bottom:1px solid rgba(198,160,92,.32)!important;background:rgba(251,246,238,.9)!important;
  -webkit-backdrop-filter:blur(12px)!important;backdrop-filter:blur(12px)!important;overflow:visible!important;
  box-shadow:0 10px 30px -24px rgba(120,70,80,.55)!important}
.nav{min-height:84px!important}
/* — LOGO KAO PEČAT: velik i dominantan, viri preko donje linije headera — */
.brand{gap:19px!important;align-items:center!important;position:relative!important}
.bav{width:82px!important;height:82px!important;border-radius:50%!important;object-fit:cover!important;
  border:3px solid #C6A05C!important;position:relative!important;z-index:6!important;transform:translateY(16px)!important;
  box-shadow:0 16px 32px -10px rgba(60,30,45,.55),0 0 0 7px rgba(231,210,162,.16),inset 0 0 0 1px rgba(255,255,255,.2)!important}
.brand .bmark,.bmark{font-size:1.78rem!important;letter-spacing:.08em!important}
.bsub{font-size:.68rem!important;letter-spacing:.36em!important;margin-top:4px!important}
/* — MENI: otmen, prozračan; zlatni „◆" separatori uklonjeni radi čistoće — */
.nav-r{gap:34px!important}
.nav-r a.link,.nav-r .link{font-family:var(--mathia-sans)!important;font-size:.95rem!important;
  font-weight:500!important;letter-spacing:.03em!important;text-transform:none!important;color:#4A2F3B!important}
.nav-r a.link::before{content:none!important}
.nav-r a.link:hover,.nav-r .link:hover{color:#9C7838!important}
.nav-r a.link::after,.nav-r .link::after{left:50%!important;right:auto!important;transform:translateX(-50%)!important;
  bottom:-6px!important;height:1.5px!important;width:0!important;
  background:linear-gradient(90deg,#C6A05C,#E7D2A2)!important;border-radius:2px!important;transition:width .28s ease!important}
.nav-r a.link:hover::after,.nav-r .link:hover::after{width:100%!important;right:auto!important}
/* pečat i header — mera na telefonu (da ne bude prevelik / da ne viri previše) */
@media(max-width:600px){
  .nav{min-height:66px!important}
  .bav{width:60px!important;height:60px!important;border-width:2.5px!important;transform:translateY(11px)!important}
  .brand .bmark,.bmark{font-size:1.34rem!important}
  .bsub{font-size:.6rem!important;letter-spacing:.3em!important}
  .brand{gap:13px!important}
}

/* ——— FUTER usklađen na celom sajtu: sitniji, elegantniji potpis ——— */
.footsig,footer .footsig{font-size:1.5rem!important;letter-spacing:.02em!important;color:#E7D2A2!important}
footer .fseal,.f-seal{font-size:1.35rem!important}
