/* ==========================================================================
   NEVIS v3 - pozadinski vizuali (10/2026)
   T1 .v3-grain   papirna tekstura na body (inline SVG šum, ~0.5KB, tile)
   T2 .v3-glow    kobalt sjaj na tamnim sekcijama (CSS radial, statično)
      .v3-grid    1px mreža 80px, maskirana (tamne sekcije: papir; .v3-grid--ink: tinta na svijetlom heroju)
   T3 .v3-bg      apstraktna slika (streaks-*.webp/avif, lazy) pod kobalt slojem 85% u plavim trakama
   Bez animacija, parallaxa, backdrop-filtera i background-attachment: fixed.
   Kontrast (najsvjetliji piksel slike pod slojem 85%): bijelo 5.9:1, #DCE2FF 4.6:1.
   ========================================================================== */

/* ---------- T1 papirni šum ---------- */
body.v3-grain {
  background-color: var(--paper);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.09'/%3E%3C/svg%3E");
  background-size: 180px 180px;
  background-blend-mode: multiply;
}

/* ---------- T2 tamne sekcije: kobalt sjaj + mreža ---------- */
.v3-glow,
.v3-grid { position: relative; isolation: isolate; }
.v3-glow {
  background-image: radial-gradient(62% 78% at 88% -8%, rgba(30, 61, 255, .24) 0%, rgba(30, 61, 255, .08) 45%, rgba(30, 61, 255, 0) 72%);
  background-repeat: no-repeat;
}
.v3-glow--soft {
  background-image: radial-gradient(48% 70% at 92% -10%, rgba(30, 61, 255, .14) 0%, rgba(30, 61, 255, 0) 70%);
}
.v3-grid::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    linear-gradient(to right, rgba(243, 243, 239, .05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(243, 243, 239, .05) 1px, transparent 1px);
  background-size: 80px 80px;
  background-position: -1px -1px;
  -webkit-mask-image: radial-gradient(70% 85% at 85% 0%, #000 0%, rgba(0, 0, 0, .35) 45%, transparent 75%);
          mask-image: radial-gradient(70% 85% at 85% 0%, #000 0%, rgba(0, 0, 0, .35) 45%, transparent 75%);
}
.v3-grid--soft::before { opacity: .6; }

/* hero (svijetlo): blijeda mreža tintom u desnoj polovini, iza mockupa */
.v3-grid--ink::before {
  left: auto;
  width: 54%;
  background-image:
    linear-gradient(to right, rgba(12, 12, 13, .045) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(12, 12, 13, .045) 1px, transparent 1px);
  -webkit-mask-image: radial-gradient(60% 62% at 55% 48%, #000 0%, rgba(0, 0, 0, .4) 55%, transparent 82%);
          mask-image: radial-gradient(60% 62% at 55% 48%, #000 0%, rgba(0, 0, 0, .4) 55%, transparent 82%);
}
@media (max-width: 900px) {
  .v3-grid--ink::before { display: none; }
}

/* ---------- T3 plave trake: slika pod kobalt slojem ---------- */
.v3-bg { position: relative; isolation: isolate; overflow: hidden; }
.v3-bg__media,
.v3-bg__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: 60% 50%;
}
.v3-bg__media { z-index: -2; pointer-events: none; }
.v3-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: rgba(30, 61, 255, .85);
}
@media (max-width: 599px) {
  /* mobitel: bez slike, samo CSS sjaj (najsvjetlija tačka 5.9:1 za bijelo) */
  .v3-bg__media { display: none; }
  .v3-bg::before {
    background:
      radial-gradient(90% 55% at 100% 0%, rgba(126, 146, 250, .16) 0%, rgba(126, 146, 250, 0) 70%),
      radial-gradient(80% 50% at 0% 100%, rgba(8, 20, 120, .20) 0%, rgba(8, 20, 120, 0) 70%);
  }
}

/* ---------- pristupačnost ---------- */
@media (prefers-contrast: more) {
  body.v3-grain { background-image: none; }
  .v3-glow, .v3-glow--soft { background-image: none; }
  .v3-grid::before { display: none; }
  .v3-bg__media { display: none; }
  .v3-bg::before { background: none; }
}
@media print {
  body.v3-grain { background-image: none; }
  .v3-bg__media, .v3-grid::before { display: none; }
}