/* =========================================================
   Studio387 - NINIUM redizajn 2026-10: zajednički sloj za widgete iz plugina
   (stranice proizvoda, Magazine, kartice tema/proizvoda, kviz), da prate nove Elementor stranice:
   naslovi u serifnom Fraunces (bez vikanja velikim slovima), pilule umjesto zaobljenih pravougaonika,
   šampanjac akcent na tamnim trakama umjesto roze. Ide posljednji, zato selektori počinju sa body.
   Vrati stari izgled: obriši ovaj fajl (ili ukloni enqueue 's387-ninium-redizajn').
   ========================================================= */
:root{
  --nn-rd-serif:'Fraunces',Georgia,'Times New Roman',serif;
  --nn-rd-ink:#1E1418;
  --nn-rd-bordo:#650031;
  --nn-rd-champ:#E4CFA6;
}

/* ---------- veliki naslovi -> serif ---------- */
body .nn-single-section h2,
body .nn-single-faq h2,
body .nn-single-view h2,
body .nn-single-footer h2,
body .nn-sec .nn-sec__title,
body .nn-mgz-hero .nn-mgz-hero__title,
body .nn-post-hero .nn-post-hero__title,
body .nn-mgz-featured .nn-mgz-featured__title,
body .nn-mgz-banner__title,
body .nn-quiz__title,
body .nn-quiz__mail-title{
  font-family:var(--nn-rd-serif) !important;
  font-weight:400 !important;
  text-transform:none !important;
  letter-spacing:-.015em !important;
  line-height:1.08 !important;
}
body .nn-single-section h2,
body .nn-single-faq h2,
body .nn-sec .nn-sec__title{font-size:clamp(32px,3.6vw,48px) !important;}
body .nn-single-footer h2{font-size:clamp(30px,3.4vw,46px) !important;}
body .nn-single-view h2{font-size:clamp(28px,3vw,40px) !important;line-height:1.2 !important;}
body .nn-mgz-hero .nn-mgz-hero__title{font-size:clamp(46px,6vw,80px) !important;line-height:1 !important;}
body .nn-post-hero .nn-post-hero__title{font-size:clamp(34px,4.6vw,60px) !important;}
body .nn-mgz-featured .nn-mgz-featured__title{font-size:clamp(26px,2.6vw,36px) !important;}
body .nn-quiz__title{font-size:clamp(28px,3.6vw,44px) !important;}

/* naziv proizvoda (podaci su VELIKIM slovima) - serif, ostaje kao u podacima */
body .nn-single-hero h1,
body.single-ninium_product .nn-single-hero--c h1,
body .nn-quiz__name,
body .nn-pcard__name,
body .nn-topic .nn-topic__name{
  font-family:var(--nn-rd-serif) !important;
  font-weight:500 !important;
  letter-spacing:-.01em !important;
}
body .nn-topic .nn-topic__name{text-transform:none !important;font-size:28px !important;}
body .nn-pcard__name{font-size:30px !important;}

/* manji naslovi kartica: Archivo, mirnije */
body .nn-sec-card .nn-sec-card__title,
body .nn-mgz-card .nn-mgz-card__title,
body .nn-post-side__title,
body .nn-single-card h3{
  font-weight:600 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
}
body .nn-sec-card .nn-sec-card__number{font-family:var(--nn-rd-serif);font-style:italic;font-weight:400;color:var(--nn-rd-bordo);}

/* naglašeni dio naslova u <span style="color:#650031"> -> kurziv, kao na Elementor stranicama */
body .nn-sec .nn-sec__title span[style*="650031"],
body .nn-mgz-hero__title span[style*="650031"],
body .nn-single-section h2 span[style*="650031"]{font-style:italic;}

/* ---------- dugmad -> pilule ---------- */
body .nn-single-button,
body .nn-mgz-button,
body .nn-quiz__cta,
body .nn-sec-cta,
body .nn-btn,
body .nn-cta,
body .nn-btn-outline,
body .nn-btn-white{border-radius:999px !important;}

/* ---------- tamne trake: šampanjac umjesto roze ---------- */
body .nn-single-view .nn-single-eyebrow,
body .nn-single-view--dark .nn-single-eyebrow,
body .nn-single-view__author,
body .nn-post-side--product .nn-post-side__label{color:var(--nn-rd-champ) !important;}
body .nn-single-view p,
body .nn-single-view--dark p,
body .nn-mgz-banner__text,
body .nn-post-side--product p,
body .nn-quiz__mail{color:#E9DFE2 !important;}

/* ---------- početna: krug proizvoda s Nininim fotkama (2026-10-19) ----------
   Sve stavke oko Soula su iste zaobljene kartice 3:2. Fotka popunjava karticu,
   packshot (proizvod još bez fotke) stoji na svijetloj podlozi. */
body .nn-orbit-photos .nn-products--orbit .nn-prod-slot:not(.nn-prod-slot--center) .nn-prod-media{
  height:auto !important;aspect-ratio:3/2;border-radius:18px;overflow:hidden;background:#F6F4F3;
  box-shadow:0 18px 34px -18px rgba(33,16,24,.35);
}
body .nn-orbit-photos .nn-products--orbit .nn-prod-slot:not(.nn-prod-slot--center) .nn-prod-media::after{display:none;}
body .nn-orbit-photos .nn-products--orbit .nn-prod-slot:not(.nn-prod-slot--center) .nn-prod-media img{
  width:100% !important;height:100% !important;object-fit:cover;object-position:50% 50%;padding:0;
}
body .nn-orbit-photos .nn-products--orbit .nn-prod-slot:not(.nn-prod-slot--center) .nn-prod-media img[src*="packshot"]{object-fit:contain;padding:12px 16px;}
body .nn-orbit-photos.nn-products--lift .nn-prod-slot:not(.nn-prod-slot--center) .nn-prod-card:hover .nn-prod-media img,
body .nn-orbit-photos .nn-products--orbit.nn-products--lift .nn-prod-slot:not(.nn-prod-slot--center) .nn-prod-card:hover .nn-prod-media img{transform:scale(1.04);}
@media (max-width:1024px){
  body .nn-orbit-photos .nn-products--orbit .nn-prod-slot:not(.nn-prod-slot--center) .nn-prod-media{aspect-ratio:1/1;}
}

/* ---------- stranica proizvoda: Ninina fotografija u sredini "Ključnih sastojaka" (2026-10-19) ---------- */
body.single-ninium_product .nn-single-ing:has(.nn-single-ing__image--photo){grid-template-columns:1fr 560px 1fr;gap:36px;}
/* cijela fotografija, bez rezanja (prirodni omjer 3:2) */
body.single-ninium_product .nn-single-ing__image--photo img{
  max-width:none !important;width:100%;aspect-ratio:auto;height:auto;object-fit:contain;
  border-radius:20px;filter:none !important;box-shadow:0 26px 50px -24px rgba(33,16,24,.45);
}
@media (min-width:1025px) and (max-width:1280px){
  body.single-ninium_product .nn-single-ing:has(.nn-single-ing__image--photo){grid-template-columns:1fr 440px 1fr;gap:28px;}
}
@media (max-width:1024px){
  body.single-ninium_product .nn-single-ing:has(.nn-single-ing__image--photo){grid-template-columns:1fr;}
  body.single-ninium_product .nn-single-ing__image--photo img{max-width:520px !important;}
}

/* ---------- Font Awesome ikone u widgetima iz plugina (2026-10-19) - boja i veličina kao prije ---------- */
body .nn-topic__icon svg,body .nn-sec-card__icon svg,body .nn-video-play svg,body .nn-post-share__copy svg{fill:currentColor;stroke:none;}
body .nn-topic__icon svg{width:20px !important;height:20px !important;}
body .nn-video-play svg{width:18px;height:18px;margin-left:3px;}
body .nn-post-share__copy svg{width:15px;height:15px;}
body .nn-topic__icon i,body .nn-sec-card__icon i{font-size:20px;line-height:1;}

/* Font Awesome strelice uz tekst (s387_ninium_arrow, kviz JS) - 2026-10-27 umjesto znakova strelica */
.nn-fa-arr{display:inline-flex;align-items:center;vertical-align:-.1em;margin-left:.5em;line-height:1;}
.nn-fa-arr--left{margin-left:0;margin-right:.5em;}
.nn-fa-arr svg{width:.9em;height:.9em;fill:currentColor;}
.nn-fa-arr i{font-size:.9em;}
.nn-mgz-pagination svg,.page-numbers svg{width:.9em;height:.9em;fill:currentColor;vertical-align:-.1em;}

/* ---------- Animacija naslova hero-a kao na početnoj (2026-10-27: "ovu lijepu animaciju dodaj i na ostale stranice") ----------
   Riječi izranjaju jedna za drugom, bordo marker se razvuče ispod naglašenog dijela, ostatak hero-a se pojavi za njima.
   Markup: s387_ninium_anim_words() (widgeti) i nin-hero-anim.php (Elementor naslovi: klase nn-ha na naslovu, nn-hf na ostalim elementima). */
.nn-ha{animation:none !important;}
.nn-ha .nn-w{display:inline-block;overflow:hidden;vertical-align:top;padding:.16em .14em .34em 0;margin:-.16em -.14em -.34em 0;} /* donji prostor za g, j, p (inače se odsijeku) */
.nn-ha .nn-w > span{display:inline-block;animation:nn-ha-word 1s cubic-bezier(.16,.84,.24,1) both;animation-delay:calc(var(--i,0) * 95ms + 200ms);}
.nn-ha .nn-acc{animation:nn-ha-mark .9s cubic-bezier(.65,0,.35,1) var(--md,1s) both;}
.nn-hf{animation:nn-ha-fade .8s ease both;}
.nn-hf.nn-hf--2{animation-delay:.9s;}
.nn-hf.nn-hf--3{animation-delay:1.05s;}
.nn-hf.nn-hf--4{animation-delay:1.2s;}
/* hero-i iz widgeta: Magazine, pojedinačni tekst, proizvod */
body .nn-mgz-hero .nn-mgz-eyebrow,body .nn-post-hero__crumbs,body.single-ninium_product .nn-single-hero__copy > .nn-single-eyebrow{animation:nn-ha-fade .8s ease both;}
body .nn-mgz-hero .nn-mgz-hero__intro,body .nn-post-hero .nn-post-hero__lead,body.single-ninium_product .nn-single-hero__copy > h2{animation:nn-ha-fade .9s ease .9s both;}
body .nn-mgz-hero .nn-mgz-author,body .nn-post-hero__meta,body.single-ninium_product .nn-single-hero__copy > p{animation:nn-ha-fade .9s ease 1.05s both;}
body.single-ninium_product .nn-single-hero__copy > .nn-single-badges,body.single-ninium_product .nn-single-hero__copy > .nn-single-actions{animation:nn-ha-fade .9s ease 1.2s both;}
@keyframes nn-ha-word{from{transform:translateY(140%);}to{transform:none;}}
@keyframes nn-ha-mark{from{background-size:0% 72%;}to{background-size:100% 72%;}}
@keyframes nn-ha-fade{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){
  .nn-ha .nn-w > span,.nn-ha .nn-acc,.nn-hf,body .nn-mgz-hero .nn-mgz-eyebrow,body .nn-post-hero__crumbs,body .nn-mgz-hero .nn-mgz-hero__intro,body .nn-post-hero .nn-post-hero__lead,
  body .nn-mgz-hero .nn-mgz-author,body .nn-post-hero__meta,body.single-ninium_product .nn-single-hero__copy > *{animation:none !important;}
}

/* ---------- Naslovi bez jedne riječi u zadnjem redu (2026-10-27: "ovo listi da ne bude samo u redu") ----------
   pretty = preglednik prelomi ranije tako da u zadnjem redu ostanu bar dvije riječi; ne mijenja ništa drugo */
body .elementor-heading-title,body h1,body h2,body h3,body blockquote{text-wrap:pretty;}
