/* ═══════════════════════════════════════════════════════════════════════
   NOA v2 — "normaalne maailma nr1" (Sora/Runway koolkond).
   DISTSIPLIIN: 2 värvi (navy + kuld), hiiglaslik kindel tüpograafia,
   ruum on luksus, liikumine ainult seal, kus kasutaja käsi on.
   Auhinna-uuringu järeldus: müra puudumine ON premium-signaal.
   ═══════════════════════════════════════════════════════════════════════ */

.nv2{--taust:#0f0d0f;--taust2:#151315;--pind:#201e20;
  --kuld:#c8a04a;--kuld2:#e8cf7a;--kiri:#f2e9d6;--kiri2:#aeb9cf;
  --joon:rgba(232,207,122,.22);
  background:var(--taust);color:var(--kiri2);overflow:clip;position:relative}

/* Filmitera — vaevumärgatav, staatiline */
.nv2::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:60;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E")}

.nv2-wrap{max-width:1280px;margin-inline:auto;padding-inline:clamp(20px,4vw,48px)}
.nv2-kicker{font-family:ui-monospace,Menlo,monospace;font-size:12px;
  letter-spacing:.32em;color:var(--kuld);text-transform:uppercase;margin:0 0 18px}
.nv2-kuld{color:transparent;background:linear-gradient(115deg,var(--kuld) 20%,var(--kuld2) 60%,var(--kuld));
  -webkit-background-clip:text;background-clip:text}

.nv2-h1{font-family:Fraunces,Georgia,serif;font-weight:300;
  font-variation-settings:"opsz" 144;
  font-size:clamp(4rem,9.5vw,9.5rem);line-height:.96;letter-spacing:-.025em;
  color:var(--kiri);margin:0 0 26px;text-wrap:balance}
.nv2-h1-veike{font-size:clamp(3rem,6.5vw,6rem)}
.nv2-h2{font-family:Fraunces,Georgia,serif;font-weight:300;
  font-variation-settings:"opsz" 144;
  font-size:clamp(2.2rem,4.4vw,4rem);line-height:1.04;letter-spacing:-.02em;
  color:var(--kiri);margin:0 0 20px;text-wrap:balance}
.nv2-sub{font-size:clamp(1.05rem,1.35vw,1.3rem);line-height:1.65;max-width:46ch;margin:0}

/* ── HERO ─────────────────────────────────────────────────────────── */
.nv2-hero{position:relative;min-height:92svh;display:flex;align-items:center;
  padding-block:110px 70px}
.nv2-kiir{position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(90% 70% at 78% 105%, rgba(200,160,74,.13), transparent 62%),
    linear-gradient(206deg, rgba(232,207,122,.14) 0%, rgba(232,207,122,.05) 22%, transparent 45%)}
.nv2-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);
  gap:clamp(32px,5vw,72px);align-items:center;width:100%}

.nv2-prompt{display:flex;gap:10px;margin:38px 0 26px;max-width:640px;
  padding:8px;border-radius:18px;background:rgba(32, 30, 32,.72);
  border:1px solid var(--joon);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 24px 60px -30px rgba(0,0,0,.8)}
.nv2-prompt input{flex:1;min-width:0;background:transparent;border:0;outline:0;
  color:var(--kiri);font-size:1.05rem;padding:14px 16px}
.nv2-prompt input::placeholder{color:rgba(174,185,207,.55)}
.nv2-prompt button{display:inline-flex;align-items:center;gap:9px;flex:none;
  padding:14px 26px;border:0;border-radius:12px;cursor:pointer;
  font-size:1.05rem;font-weight:600;color:#151315;
  background:linear-gradient(120deg,var(--kuld),var(--kuld2) 60%,#d9b85c);
  box-shadow:0 14px 38px -14px rgba(200,160,74,.55);
  transition:transform .16s ease,box-shadow .16s ease}
.nv2-prompt button:hover{transform:translateY(-1px);
  box-shadow:0 20px 48px -14px rgba(200,160,74,.7)}
.nv2-prompt button svg{width:11px;height:14px}
.nv2-prompt:focus-within{border-color:rgba(232,207,122,.5)}

.nv2-usaldus{font-family:ui-monospace,Menlo,monospace;font-size:11.5px;
  letter-spacing:.18em;color:rgba(174,185,207,.6);margin:0}

.nv2-maskott{position:relative;margin:0;justify-self:center;
  width:min(360px,26vw)}
.nv2-maskott img{position:relative;z-index:2;width:100%;height:auto;
  filter:drop-shadow(0 30px 60px rgba(0,0,0,.55))}
.nv2-maskott-vari{position:absolute;left:14%;right:14%;bottom:-6px;height:30px;
  border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.55),transparent 70%)}

/* ── REEL: väljundi sein ─────────────────────────────────────────── */
.nv2-reel{padding-block:110px 30px;text-align:center}
.nv2-reel .nv2-kicker{margin-bottom:14px}
.nv2-sein{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
  padding:56px 10px 10px;max-width:1720px;margin-inline:auto}
.nv2-tile{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;
  border-radius:10px;border:1px solid rgba(232,207,122,.14)}
.nv2-tile img{width:100%;height:100%;object-fit:cover;display:block;
  transform:scale(1.02);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.nv2-tile:hover img{transform:scale(1.09)}
.nv2-tile::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(4,7,14,.82));
  opacity:.9;transition:opacity .3s ease}
.nv2-tile-silt{position:absolute;left:16px;right:16px;bottom:13px;z-index:2;
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  color:var(--kiri);font-weight:600;font-size:1.02rem;text-align:left}
.nv2-tile-silt em{font-family:ui-monospace,Menlo,monospace;font-style:normal;
  font-size:10.5px;letter-spacing:.14em;color:var(--kuld2);opacity:.85}

/* ── SAMMUD ──────────────────────────────────────────────────────── */
.nv2-sammud{padding-block:130px}
.nv2-sammud-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,64px)}
.nv2-samm span{display:block;font-family:Fraunces,Georgia,serif;font-weight:300;
  font-size:3.4rem;line-height:1;color:transparent;
  background:linear-gradient(115deg,var(--kuld),var(--kuld2));
  -webkit-background-clip:text;background-clip:text;margin-bottom:16px}
.nv2-samm h3{font-family:Fraunces,Georgia,serif;font-weight:400;font-size:1.7rem;
  color:var(--kiri);margin:0 0 10px}
.nv2-samm p{margin:0;line-height:1.6}

/* ── TOODE → VIDEO ───────────────────────────────────────────────── */
.nv2-toode{padding-block:40px 130px}
.nv2-toode-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);
  align-items:center}
.nv2-toode-pilt{border-radius:16px;overflow:hidden;border:1px solid var(--joon);
  box-shadow:0 40px 90px -40px rgba(0,0,0,.8)}
.nv2-toode-pilt img{display:block;width:100%;height:auto}
.nv2-nupp,.nv2-nupp-teine{display:inline-block;margin-top:30px;padding:17px 38px;
  border-radius:14px;font-size:1.08rem;font-weight:600;text-decoration:none;
  transition:transform .16s ease,box-shadow .16s ease}
.nv2-nupp{color:#151315;background:linear-gradient(120deg,var(--kuld),var(--kuld2) 60%,#d9b85c);
  box-shadow:0 18px 50px -18px rgba(200,160,74,.55)}
.nv2-nupp:hover{transform:translateY(-2px);color:#151315}
.nv2-nupp-teine{color:var(--kuld2);border:1px solid rgba(232,207,122,.4)}
.nv2-nupp-teine:hover{border-color:rgba(232,207,122,.85);color:var(--kuld2)}

/* ── FINAAL ──────────────────────────────────────────────────────── */
.nv2-lopp{padding-block:150px 140px;text-align:center;position:relative;
  background:
    radial-gradient(70% 60% at 50% 100%, rgba(200,160,74,.10), transparent 60%),
    var(--taust)}
.nv2-lopp-maskott{width:120px;height:auto;margin-bottom:26px;
  filter:drop-shadow(0 18px 40px rgba(0,0,0,.5))}
.nv2-alla{margin:16px 0 0;font-size:.92rem;color:rgba(174,185,207,.55)}

/* ── REVEAL: JS lisab klassi .nv2-reveal ALLES siis kui IO töötab —
   ilma JS-ita pole klassi ja kõik on nähtav (opacity-lõks välistatud) ── */
.nv2-reveal{transform:translateY(22px);opacity:.001;
  transition:transform .7s cubic-bezier(.16,.84,.44,1),opacity .7s ease}
.nv2-reveal.on{transform:none;opacity:1}
@media (prefers-reduced-motion:reduce){.nv2-reveal{transform:none;opacity:1;transition:none}}

/* ── MOBIIL ──────────────────────────────────────────────────────── */
@media (max-width:1023px){
  .nv2-hero-grid{grid-template-columns:1fr;align-items:start}
  .nv2-maskott{position:absolute;right:4vw;bottom:2vh;width:min(200px,34vw);opacity:.5;z-index:0}
  .nv2-hero-tekst{position:relative;z-index:1}
  .nv2-sein{grid-template-columns:repeat(2,1fr)}
  .nv2-sammud-grid{grid-template-columns:1fr;gap:36px}
  .nv2-toode-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .nv2-sein{grid-template-columns:1fr}
  .nv2-prompt{flex-direction:column}
  .nv2-prompt button{justify-content:center}
}

/* Teema img-reeglid suruvad maskoti pisikeseks (sama lõks kolmandat korda) —
   mõõt raudselt kinni, tõestatud !important-muster. */
.nv2-maskott{width:min(360px,26vw) !important}
.nv2-maskott img{width:100% !important;height:auto !important;max-width:none !important}
.nv2-lopp-maskott{width:120px !important;height:auto !important}

/* ── "TÜHI" PARANDUS: toode ESIMESSE vaatesse ─────────────────────────
   Mõõdetud: hero 92svh jättis alumise kolmandiku paljaks pimeduseks ja
   kaadrid algasid alles teisel ekraanil. Sora-reegel: väljund täidab
   esimese ekraani. Hero kahaneb, reel tõuseb esimesse vaatesse. */
.nv2-hero{min-height:72svh !important;padding-block:96px 24px !important}
.nv2-reel{padding-block:24px 30px !important}
.nv2-sein{padding-top:28px !important}
/* Kiir nähtavamaks — praegu kadus ta ekraanil ära */
.nv2-kiir{background:
  radial-gradient(90% 70% at 78% 105%, rgba(200,160,74,.16), transparent 62%),
  linear-gradient(206deg, rgba(232,207,122,.20) 0%, rgba(232,207,122,.07) 24%, transparent 48%) !important}

/* ═══ TIHE SEIN + ELU (Arno: "tühi" => Higgsfield-tihedus) ═══════════
   Liikumine on AINULT transform (GPU-komposiit) — mõõdetud reeglid kehtivad.
   Ken Burns paneb staatilise JPG "mängima" — aju loeb seda videona. */

.nv2-kiibid{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.nv2-kiibid span{padding:7px 14px;border-radius:999px;font-size:.85rem;
  color:var(--kiri2);border:1px solid rgba(232,207,122,.2);
  background:rgba(32, 30, 32,.5);transition:border-color .15s ease,color .15s ease;cursor:default}
.nv2-kiibid span:hover{border-color:rgba(232,207,122,.6);color:var(--kuld2)}

/* 8 kaarti, 4 veergu, kaks rida — SEIN, mitte riba */
.nv2-sein-tihe{grid-template-columns:repeat(4,1fr);gap:10px}
.nv2-sein-tihe .nv2-tile{aspect-ratio:16/10}
.nv2-sein-tihe .nv2-tile:nth-child(4n+2){aspect-ratio:16/12}
.nv2-sein-tihe .nv2-tile:nth-child(4n+3){aspect-ratio:16/9}
.nv2-sein-tihe .nv2-tile img{width:100%;height:100%;object-fit:cover}
/* eri kadreeringud samast pildist = eri kaadrid */
.nv2-kb-k5 img{object-position:20% 30%}
.nv2-kb-k6 img{object-position:75% 60%}
.nv2-kb-k7 img{object-position:40% 80%}
.nv2-kb-k8 img{object-position:65% 20%}

/* KEN BURNS: aeglane pan+zoom, igal oma suund/kestus — "video" tunne.
   Ainult transform; reduced-motion lülitab välja. */
@keyframes nv2kb-a{from{transform:scale(1.04) translate(0,0)}to{transform:scale(1.12) translate(-2.2%,-1.6%)}}
@keyframes nv2kb-b{from{transform:scale(1.05) translate(-1.8%,0)}to{transform:scale(1.13) translate(1.6%,-2%)}}
@keyframes nv2kb-c{from{transform:scale(1.04) translate(1.5%,-1.5%)}to{transform:scale(1.11) translate(-1.5%,1.5%)}}
@keyframes nv2kb-d{from{transform:scale(1.06) translate(0,1.8%)}to{transform:scale(1.12) translate(2%,-1.4%)}}
.nv2-kb-k1 img,.nv2-kb-k5 img{animation:nv2kb-a 26s ease-in-out infinite alternate}
.nv2-kb-k2 img,.nv2-kb-k6 img{animation:nv2kb-b 31s ease-in-out infinite alternate}
.nv2-kb-k3 img,.nv2-kb-k7 img{animation:nv2kb-c 28s ease-in-out infinite alternate}
.nv2-kb-k4 img,.nv2-kb-k8 img{animation:nv2kb-d 34s ease-in-out infinite alternate}
.nv2-tile:hover img{animation-play-state:paused;transform:scale(1.09)}

/* REC-punkt — "see on video" mikrosignaal */
.nv2-tile-punane{position:absolute;top:12px;left:12px;z-index:2;width:9px;height:9px;
  border-radius:50%;background:#e05c4a;box-shadow:0 0 0 0 rgba(224,92,74,.5);
  animation:nv2rec 2.4s ease-out infinite}
@keyframes nv2rec{0%{box-shadow:0 0 0 0 rgba(224,92,74,.45)}70%{box-shadow:0 0 0 8px rgba(224,92,74,0)}100%{box-shadow:0 0 0 0 rgba(224,92,74,0)}}

/* JOOKSURIDA — pidev õrn liikumine ütleb "leht elab" */
.nv2-marquee{overflow:hidden;margin-top:34px;padding-block:18px;
  border-block:1px solid rgba(232,207,122,.14);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.nv2-marquee-riba{display:inline-flex;align-items:center;gap:34px;white-space:nowrap;
  animation:nv2mq 46s linear infinite;will-change:transform}
.nv2-marquee-riba span{font-family:ui-monospace,Menlo,monospace;font-size:12.5px;
  letter-spacing:.22em;text-transform:uppercase;color:rgba(232,207,122,.75)}
.nv2-marquee-riba i{width:5px;height:5px;border-radius:50%;background:rgba(232,207,122,.45)}
@keyframes nv2mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

@media (prefers-reduced-motion:reduce){
  .nv2-tile img,.nv2-marquee-riba,.nv2-tile-punane{animation:none !important}}
@media (max-width:1023px){.nv2-sein-tihe{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.nv2-sein-tihe{grid-template-columns:1fr}}

/* Finaali maskott KESKELE — img on inline ja triivis text-align'i veidruste
   tõttu vasakule; block+auto margin on üheselt keskel */
.nv2-lopp-maskott{display:block !important;margin:0 auto 26px !important}

/* ═══ HERO TAUSTA-SEIN + KKK ═══════════════════════════════════════════
   Higgsfield-põhimõte: toode täidab KOGU esimese ekraani. Kaadrid on tuhmid
   (tekst jääb kuningas), liiguvad Ken Burnsiga; loor hoiab kontrasti. */
.nv2-hero{overflow:hidden}
.nv2-hero-sein{position:absolute;inset:0;display:grid;
  grid-template-columns:repeat(4,1fr);gap:2px;z-index:0}
.nv2-hs{position:relative;overflow:hidden}
.nv2-hs img{width:100%;height:100%;object-fit:cover;display:block;opacity:.5}
.nv2-hero-loor{position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,rgba(15, 13, 15,.97) 0%,rgba(15, 13, 15,.88) 34%,rgba(15, 13, 15,.55) 62%,rgba(15, 13, 15,.72) 100%),
             linear-gradient(180deg,rgba(15, 13, 15,.85),transparent 30%,transparent 70%,rgba(15, 13, 15,.95))}
.nv2-hero .nv2-wrap{position:relative;z-index:2}
.nv2-kiir{z-index:1 !important}
@media (max-width:1023px){.nv2-hero-sein{grid-template-columns:repeat(2,1fr)}}

/* KKK — puhas akordion, sama keel */
.nv2-kkk{padding-block:20px 120px}
.nv2-kkk-loend{max-width:820px;margin-top:34px}
.nv2-kkk-rida{border-bottom:1px solid rgba(232,207,122,.16)}
.nv2-kkk-rida summary{display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:20px 4px;cursor:pointer;list-style:none;
  font-family:Fraunces,Georgia,serif;font-size:1.25rem;color:#f2e9d6}
.nv2-kkk-rida summary::-webkit-details-marker{display:none}
.nv2-kkk-rida summary span{color:#c8a04a;font-size:1.4rem;line-height:1;
  transition:transform .25s ease}
.nv2-kkk-rida[open] summary span{transform:rotate(45deg)}
.nv2-kkk-rida p{margin:0;padding:0 4px 22px;max-width:64ch;line-height:1.65;
  color:rgba(174,185,207,.85)}

/* ═══ JÕUDLUS: MÕÕDETUD 25 FPS -> parandus ══════════════════════════
   Põhjus: 12 Ken Burns pilti animeerusid KORRAGA, ka ekraanilt väljas.
   scale() suurel pildil = pidev re-raster. Kaks ravimit:
   1) hero taustasein on STAATILINE — ta on niikuinii loori all, liikumist
      ei näe, aga maksab täie hinna;
   2) seina kaadrid liiguvad AINULT vaates (JS lisab .nv2-liigub). */
.nv2-hero-sein .nv2-hs img{animation:none !important;transform:scale(1.06)}
.nv2-sein .nv2-tile img{animation-play-state:paused}
.nv2-sein .nv2-tile.nv2-liigub img{animation-play-state:running;will-change:transform}
.nv2-tile-punane{animation-play-state:paused}
.nv2-tile.nv2-liigub .nv2-tile-punane{animation-play-state:running}
.nv2-marquee-riba{animation-play-state:paused}
.nv2-marquee.nv2-liigub .nv2-marquee-riba{animation-play-state:running}

/* ═══ HINNAD — kolm kaarti, keskmine kuldses raamis ═══════════════════
   JÕUDLUS: null backdrop-filterit; liigub ainult transform + box-shadow.
   NÄHTAVUS: kaardid on täies opaakuses kohe — mitte ükski piksel siin
   ei sõltu JS-ist (reveal-animatsioon oleks tühja lehe risk). */
.nv2-ankur{display:block;height:0;overflow:hidden;scroll-margin-top:96px}
.nv2-hind{padding-block:110px 100px;position:relative;scroll-margin-top:96px}
.nv2-hind::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(70% 55% at 50% 0%, rgba(200,160,74,.10), transparent 65%)}
.nv2-hind .nv2-wrap{position:relative}
.nv2-hind .nv2-sub{margin-bottom:52px}

.nv2-hind-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;
  align-items:stretch}

.nv2-hind-kaart{position:relative;display:flex;flex-direction:column;
  padding:38px 32px 32px;border-radius:22px;
  background:linear-gradient(180deg,rgba(32, 30, 32,.85),rgba(21, 19, 21,.85));
  border:1px solid var(--joon);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 30px 70px -46px rgba(0,0,0,.9);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.nv2-hind-kaart:hover{transform:translateY(-4px);
  border-color:rgba(232,207,122,.45);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07), 0 40px 90px -46px rgba(0,0,0,.95)}

/* Keskmine (is_featured) — kuldne raam ja kerge tõste, et valik oleks juhitud */
.nv2-hind-esile{border-color:rgba(232,207,122,.55);
  background:linear-gradient(180deg,rgba(42, 40, 42,.95),rgba(25, 23, 25,.95));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),
             0 0 0 1px rgba(232,207,122,.18),
             0 44px 90px -44px rgba(200,160,74,.35)}
@media (min-width:961px){
  .nv2-hind-esile{transform:translateY(-14px)}
  .nv2-hind-esile:hover{transform:translateY(-18px)}}

.nv2-hind-lipp{position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  padding:6px 16px;border-radius:999px;white-space:nowrap;
  font-family:ui-monospace,Menlo,monospace;font-size:10.5px;font-weight:700;
  letter-spacing:.22em;text-transform:uppercase;color:#151315;
  background:linear-gradient(120deg,var(--kuld),var(--kuld2) 60%,#d9b85c);
  box-shadow:0 12px 28px -12px rgba(200,160,74,.7)}

.nv2-hind-nimi{margin:0 0 18px;font-family:ui-monospace,Menlo,monospace;
  font-size:12px;font-weight:500;letter-spacing:.3em;text-transform:uppercase;
  color:var(--kuld)}

.nv2-hind-number{margin:0 0 16px;display:flex;align-items:baseline;gap:10px;
  flex-wrap:wrap}
.nv2-hind-summa{font-family:Fraunces,Georgia,serif;font-weight:300;
  font-variation-settings:"opsz" 144;
  font-size:clamp(3.2rem,4.6vw,4.4rem);line-height:.92;letter-spacing:-.03em;
  color:var(--kiri)}
.nv2-hind-summa em{font-style:normal;font-size:.42em;letter-spacing:-.01em;
  color:rgba(242,233,214,.75)}
.nv2-hind-yhik{font-family:ui-monospace,Menlo,monospace;font-size:12.5px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--kiri2)}

.nv2-hind-kellele{margin:0 0 26px;font-size:1rem;line-height:1.6;
  color:rgba(174,185,207,.9);min-height:3.2em}

.nv2-hind-loend{list-style:none;margin:0 0 30px;padding:26px 0 0;
  display:flex;flex-direction:column;gap:13px;
  border-top:1px solid rgba(232,207,122,.14)}
.nv2-hind-loend li{display:flex;align-items:flex-start;gap:11px;
  font-size:.98rem;line-height:1.45;color:rgba(242,233,214,.88)}
.nv2-hind-loend svg{width:19px;height:19px;flex:none;margin-top:1px;
  color:var(--kuld2)}

.nv2-hind-nupp{margin-top:auto;display:block;text-align:center;
  padding:15px 22px;border-radius:13px;text-decoration:none;
  font-size:1.02rem;font-weight:600;color:var(--kiri);
  border:1px solid rgba(232,207,122,.4);background:rgba(232,207,122,.07);
  transition:transform .16s ease,background .16s ease,border-color .16s ease}
.nv2-hind-nupp:hover{transform:translateY(-1px);
  background:rgba(232,207,122,.15);border-color:rgba(232,207,122,.7)}
.nv2-hind-nupp-esile{color:#151315;border-color:transparent;
  background:linear-gradient(120deg,var(--kuld),var(--kuld2) 60%,#d9b85c);
  box-shadow:0 16px 40px -16px rgba(200,160,74,.6)}
.nv2-hind-nupp-esile:hover{
  background:linear-gradient(120deg,var(--kuld2),#f0dd97 60%,var(--kuld2));
  box-shadow:0 22px 50px -16px rgba(200,160,74,.75)}

/* AUS RIDA: Stripe pole ühendatud — ära luba ostu, mida pole */
.nv2-hind-mark{margin:12px 0 0;text-align:center;
  font-family:ui-monospace,Menlo,monospace;font-size:10.5px;
  letter-spacing:.2em;text-transform:uppercase;color:rgba(174,185,207,.55)}

.nv2-hind-jalus{margin:44px auto 0;max-width:62ch;text-align:center;
  font-size:.95rem;line-height:1.65;color:rgba(174,185,207,.72)}

@media (max-width:960px){
  .nv2-hind{padding-block:80px 70px}
  .nv2-hind-grid{grid-template-columns:1fr;gap:34px;max-width:520px;margin-inline:auto}
  .nv2-hind-kaart{padding:34px 26px 28px}
  .nv2-hind-kellele{min-height:0}}

@media (prefers-reduced-motion:reduce){
  .nv2-hind-kaart,.nv2-hind-nupp{transition:none}
  .nv2-hind-kaart:hover{transform:none}}

/* ═══ PÄRIS VIDEO (ffmpeg Ken Burns) asendab CSS-animatsiooni ═════════
   Renderdatud liikumine = brauser ei arvuta iga kaadrit ümber; sama
   visuaal, murdosa jõudlusest. CSS Ken Burns videotel VÄLJAS. */
.nv2-vid{width:100%;height:100%;object-fit:cover;display:block;
  animation:none !important}
.nv2-tile .nv2-vid{transition:transform .6s cubic-bezier(.2,.7,.2,1);transform:scale(1.01)}
.nv2-tile:hover .nv2-vid{transform:scale(1.06)}
.nv2-hero-sein .nv2-vid{opacity:.5}


/* ═══ VÕIMEKUSE-KAARDID (asendasid abstraktsed kaadrid) ══════════════
   MIKS: ffmpeg-genereeritud abstraktsed klipid nägid odavad välja (viimane
   katse tuli lilla — täpselt MagicAI värv, mille välja viskasime). Kliendi
   brändi ei tohi kasutada, päris näidiseid pole veel. Aus valik: näita
   VÕIMEKUSI puhtalt, ilma võlts-visuaalita. */
.nv2-voime-vork{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;
  max-width:1400px;margin:44px auto 0;padding-inline:clamp(20px,4vw,48px)}
.nv2-voime{display:block;padding:26px 24px 28px;border-radius:16px;
  text-decoration:none;background:linear-gradient(165deg,#201e20,#181618);
  border:1px solid rgba(232,207,122,.20);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  transition:border-color .2s ease,transform .2s ease}
.nv2-voime:hover{border-color:rgba(232,207,122,.55);transform:translateY(-3px)}
.nv2-voime-ikoon{display:grid;place-items:center;width:44px;height:44px;
  border-radius:12px;margin-bottom:16px;color:#151315;
  background:linear-gradient(120deg,#c8a04a,#e8cf7a)}
.nv2-voime-ikoon svg{width:22px;height:22px}
.nv2-voime h3{font-family:Fraunces,Georgia,serif;font-weight:400;font-size:1.18rem;
  color:#f2e9d6;margin:0 0 8px}
.nv2-voime p{margin:0;font-size:.94rem;line-height:1.55;color:rgba(174,185,207,.8)}
@media (max-width:1023px){.nv2-voime-vork{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.nv2-voime-vork{grid-template-columns:1fr}}

/* Seina alapealkiri: .nv2-sub on max-width 46ch + margin:0, seega
   keskele joondatud sektsioonis tuleb ta ise keskele tõsta. */
.nv2-reel-sub{max-width:64ch;margin-inline:auto}


/* ═══ MOOTOR: mudelid ja seaded ══════════════════════════════════════
   MIKS see sektsioon on: Arno tahtis kogu mootori nähtavale ("kõik mudelid
   koos seadistustega"). Kaart on tahtlikult INFOTIHE — see on lehe ainus
   koht, kus arv ja fakt kaaluvad üles atmosfääri. */
.nv2-mootor{padding-block:110px 40px}
.nv2-m-pea{font-family:Fraunces,Georgia,serif;font-weight:400;
  font-size:1.5rem;color:var(--kuld2);margin:52px 0 18px;
  padding-bottom:10px;border-bottom:1px solid rgba(232,207,122,.16)}
.nv2-m-vork{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.nv2-m-kaart{display:flex;flex-direction:column;padding:22px 22px 18px;
  border-radius:14px;background:linear-gradient(165deg,#201e20,#181618);
  border:1px solid rgba(232,207,122,.20)}
.nv2-m-kaart--tulekul{opacity:.55;border-style:dashed}
.nv2-m-pais{display:flex;align-items:baseline;justify-content:space-between;
  gap:12px;margin-bottom:8px}
.nv2-m-pais h4{font-family:Fraunces,Georgia,serif;font-weight:400;
  font-size:1.16rem;color:#f2e9d6;margin:0}
.nv2-m-olek{flex:none;font-family:ui-monospace,Menlo,monospace;font-size:9.5px;
  letter-spacing:.14em;padding:3px 8px;border-radius:99px;
  color:#151315;background:linear-gradient(120deg,#c8a04a,#e8cf7a)}
.nv2-m-kaart--tulekul .nv2-m-olek{background:none;color:rgba(232,207,122,.75);
  border:1px solid rgba(232,207,122,.4)}
.nv2-m-kirjeldus{margin:0 0 14px;font-size:.9rem;line-height:1.55;
  color:rgba(174,185,207,.82)}
.nv2-m-seaded{list-style:none;margin:0 0 12px;padding:0;
  border-top:1px solid rgba(232,207,122,.12)}
.nv2-m-seaded li{display:flex;justify-content:space-between;gap:10px;
  padding:7px 0;border-bottom:1px solid rgba(232,207,122,.08);font-size:.82rem}
.nv2-m-seaded span{color:rgba(174,185,207,.65)}
.nv2-m-seaded b{font-weight:500;color:#f2e9d6;text-align:right;
  font-family:ui-monospace,Menlo,monospace;font-size:.78rem}
.nv2-m-margid{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.nv2-m-margid span{font-size:.7rem;letter-spacing:.04em;padding:3px 9px;
  border-radius:99px;color:rgba(232,207,122,.85);
  border:1px solid rgba(232,207,122,.25)}
.nv2-m-id{margin-top:auto;font-family:ui-monospace,Menlo,monospace;
  font-size:.66rem;letter-spacing:.04em;color:rgba(174,185,207,.5);
  word-break:break-all}
.nv2-m-jalus{margin:34px 0 0;font-size:.9rem;line-height:1.6;
  color:rgba(174,185,207,.7);max-width:70ch}
@media (max-width:1023px){.nv2-m-vork{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.nv2-m-vork{grid-template-columns:1fr}}


/* ═══ TOODE ISE — päris liides, mitte meeleolupilt ═══════════════════
   MIKS üks SUUR pilt korraga, mitte neli kõrvuti: väiksena ei loe UI-st
   midagi välja ja ekraanipilt muutub lihtsalt tekstuuriks. Suur pilt on
   ainus viis, kuidas liides jääb loetavaks — ja loetavus ONGI see, mis
   tekitab usalduse. */
.nv2-toode-vaade{padding-block:110px 40px}
.nv2-tv-sakid{display:flex;flex-wrap:wrap;gap:8px;margin:38px 0 22px}
.nv2-tv-sakk{padding:10px 22px;border-radius:99px;cursor:pointer;
  font-size:.95rem;font-weight:600;letter-spacing:.01em;
  color:rgba(174,185,207,.85);background:rgba(255,255,255,.03);
  border:1px solid rgba(232,207,122,.18);
  transition:color .2s cubic-bezier(.2,.8,.2,1),border-color .2s cubic-bezier(.2,.8,.2,1),
             background .2s cubic-bezier(.2,.8,.2,1),transform .2s cubic-bezier(.2,.8,.2,1)}
.nv2-tv-sakk:hover{transform:translateY(-2px);border-color:rgba(232,207,122,.45);color:#f2e9d6}
.nv2-tv-sakk[aria-selected="true"]{color:#151315;border-color:transparent;
  background:linear-gradient(120deg,#c8a04a,#f6e6b4);
  box-shadow:0 14px 30px -14px rgba(200,160,74,.8)}

.nv2-tv-lava{position:relative}
.nv2-tv-kaader{margin:0}
.nv2-tv-kaader img{display:block;width:100%;height:auto;border-radius:16px;
  border:1px solid rgba(232,207,122,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),
             0 60px 110px -50px rgba(0,0,0,.95)}
.nv2-tv-kaader figcaption{display:flex;align-items:baseline;gap:12px;
  flex-wrap:wrap;margin-top:18px;font-size:.98rem;line-height:1.6;
  color:rgba(174,185,207,.85);max-width:74ch}
.nv2-tv-silt{flex:none;font-family:ui-monospace,Menlo,monospace;font-size:9.5px;
  letter-spacing:.14em;text-transform:uppercase;padding:4px 10px;border-radius:99px;
  color:#151315;background:linear-gradient(120deg,#c8a04a,#e8cf7a)}
@media (max-width:640px){
  .nv2-tv-sakid{gap:6px}
  .nv2-tv-sakk{padding:8px 16px;font-size:.88rem}
}


/* ═══ HERO TÕESTUS: toode ise ═══════════════════════════════════════
   MIKS perspektiiv (rotateY): otse-eest ekraanipilt loeb "screenshot",
   kergelt pööratud loeb "seade". Vahe on väike ja mõju suur — sama võte,
   mida kasutavad Linear ja Vercel. Nurk on TAHTLIKULT väike (7°): suurem
   muudab teksti loetamatuks ja hakkab välja nägema stock-maketina.

   MIKS ainult transform ja opacity animatsioonis: kõik muu sunnib brauserit
   iga kaadri jaoks uuesti paigutust arvutama. Hero on esimene asi, mida
   nähakse — seal ei tohi FPS kukkuda. */
/* ⚠️ width EI TOHI olla vw-põhine: 52vw oli LAIEM kui hero-ruudustiku
   parem veerg ja pilt jooksis tekstile peale — pealkirja lõpp ja
   promptiväli jäid pildi alla. Ruudustiku veerg otsustab laiuse,
   mitte vaateaken. */
.nv2-hero-toode{position:relative;justify-self:end;width:100%;
  max-width:640px;margin:0;perspective:1400px}
.nv2-ht-raam{display:block;transform:rotateY(-7deg) rotateX(2deg);
  transform-style:preserve-3d;border-radius:14px;overflow:hidden;
  border:1px solid rgba(232,207,122,.28);
  box-shadow:0 4px 0 rgba(255,255,255,.05) inset,
             0 70px 120px -55px rgba(0,0,0,.95),
             0 0 90px -40px rgba(200,160,74,.45);
  animation:nv2-hoiju 9s ease-in-out infinite}
.nv2-ht-raam img{display:block;width:100%;height:auto}

/* Kuldne servavalgus vasakult — sama valgus, mis langeb ka pealkirjale.
   Ilma selleta hõljub pilt ruumis ilma valgusallikata ja loeb kleebisena. */
.nv2-ht-raam::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,rgba(232,207,122,.14),transparent 42%)}

@keyframes nv2-hoiju{
  0%,100%{transform:rotateY(-7deg) rotateX(2deg) translateY(0)}
  50%    {transform:rotateY(-7deg) rotateX(2deg) translateY(-14px)}
}

/* Maskott läks vasakult PAREMALE: vasakul kattis ta promptivälja.
   Nüüd istub ta ekraanipildi alumises paremas nurgas — brändi nägu
   jääb alles, aga ta ei varja ühtegi juhtelementi. */
.nv2-ht-maskott{position:absolute;right:-30px;bottom:-30px;width:150px;
  height:auto;z-index:2;
  filter:drop-shadow(0 26px 44px rgba(0,0,0,.6));
  animation:nv2-hoiju-m 9s ease-in-out infinite}
@keyframes nv2-hoiju-m{
  0%,100%{transform:translateY(0)}
  50%    {transform:translateY(-8px)}
}

@media (max-width:1023px){
  .nv2-hero-toode{width:100%;justify-self:stretch;margin-top:28px;perspective:none}
  .nv2-ht-raam{transform:none;animation:none}
  .nv2-ht-maskott{left:auto;right:8px;bottom:-14px;width:104px;animation:none}
}
@media (prefers-reduced-motion:reduce){
  .nv2-ht-raam,.nv2-ht-maskott{animation:none}
}


/* ═══ KUULDAV DEMO ══════════════════════════════════════════════════
   Lehe ainus koht, kus külastaja saab toodet KASUTADA ilma kontota.
   Seepärast on need kaardid suuremad ja tihedamad kui muu leht: siin
   tahame klõpsu, mitte lugemist. */
.nv2-haaled{padding-block:100px 40px}
.nv2-h-vork{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:38px}

.nv2-h-kaart{position:relative;display:flex;align-items:center;gap:14px;
  padding:16px 18px;border-radius:14px;cursor:pointer;text-align:left;
  background:linear-gradient(165deg,#201e20,#181618);
  border:1px solid rgba(232,207,122,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  transition:transform .2s cubic-bezier(.2,.8,.2,1),
             border-color .2s cubic-bezier(.2,.8,.2,1),
             box-shadow .2s cubic-bezier(.2,.8,.2,1)}
.nv2-h-kaart:hover{transform:translateY(-3px);border-color:rgba(232,207,122,.5);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 20px 38px -24px rgba(0,0,0,.95)}
.nv2-h-kaart.mangib{border-color:var(--kuld2);
  background:linear-gradient(165deg,rgba(232,207,122,.15),rgba(200,160,74,.04));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 0 1px rgba(232,207,122,.3),
             0 22px 44px -26px rgba(200,160,74,.6)}

.nv2-h-mangi{flex:none;display:grid;place-items:center;width:42px;height:42px;
  border-radius:50%;color:#151315;
  background:linear-gradient(120deg,var(--kuld),var(--kuld2));
  box-shadow:0 10px 22px -10px rgba(200,160,74,.85)}
.nv2-h-mangi svg{width:18px;height:18px}
.nv2-h-paus{display:none}
.nv2-h-kaart.mangib .nv2-h-play{display:none}
.nv2-h-kaart.mangib .nv2-h-paus{display:block}

.nv2-h-info{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.nv2-h-nimi{font-family:Fraunces,Georgia,serif;font-weight:400;font-size:1.12rem;
  color:var(--kiri);display:flex;align-items:baseline;gap:6px}
.nv2-h-nimi em{font-family:ui-monospace,Menlo,monospace;font-style:normal;
  font-size:9px;letter-spacing:.12em;padding:2px 6px;border-radius:99px;
  color:#151315;background:linear-gradient(120deg,var(--kuld),var(--kuld2))}
.nv2-h-roll{font-size:.8rem;color:var(--kiri2);opacity:.8}

/* Lainekuju: 14 vertikaalset triipu. Seisab paigal, kuni hääl mängib —
   siis animeeruvad. MIKS see olemas on: heli on nähtamatu, ja kaart peab
   NÄITAMA, et midagi juhtub, ka enne kui kõlar heli annab. */
.nv2-h-laine{flex:none;display:flex;align-items:center;gap:2px;height:26px}
.nv2-h-laine i{display:block;width:2px;height:5px;border-radius:2px;
  background:rgba(232,207,122,.35);transition:height .18s ease}
.nv2-h-kaart.mangib .nv2-h-laine i{background:var(--kuld2);
  animation:nv2-laine .85s ease-in-out infinite}
.nv2-h-kaart.mangib .nv2-h-laine i:nth-child(2n){animation-delay:.1s}
.nv2-h-kaart.mangib .nv2-h-laine i:nth-child(3n){animation-delay:.22s}
.nv2-h-kaart.mangib .nv2-h-laine i:nth-child(4n){animation-delay:.34s}
@keyframes nv2-laine{0%,100%{height:5px}50%{height:22px}}

.nv2-h-tekst{min-height:2.6rem;margin:26px 0 0;font-family:Fraunces,Georgia,serif;
  font-size:clamp(1.05rem,1.6vw,1.35rem);line-height:1.5;color:var(--kiri);
  opacity:0;transition:opacity .3s ease;max-width:62ch}
.nv2-h-tekst.on{opacity:1}
.nv2-h-all{margin:22px 0 0;font-size:.85rem;line-height:1.6;
  color:rgba(174,185,207,.6);max-width:70ch}

@media (max-width:1100px){.nv2-h-vork{grid-template-columns:repeat(3,1fr)}}
@media (max-width:860px){.nv2-h-vork{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){
  .nv2-h-vork{grid-template-columns:1fr}
  .nv2-h-laine{display:none}
}
@media (prefers-reduced-motion:reduce){
  .nv2-h-kaart.mangib .nv2-h-laine i{animation:none;height:14px}
}

/* ═══ TIHENDAMINE ═══════════════════════════════════════════════════
   MÕÕDETUD PROBLEEM: leht oli 8805 px pikk ja sisaldas 6 pilti — ~1470 px
   tühja ruumi pildi kohta. Arno on kuus korda öelnud "tühi". Ta ei mõelnud
   ühtegi konkreetset elementi: ta mõtles seda, et sisu vahel on liiga palju
   õhku. Minimalism ei loe premiumina, kui vahed on nii suured, et ekraanil
   on korraga ainult üks asi.

   Vähendame sektsioonide vahesid ~30%. Ükski element ei muutu — muutub
   ainult see, kui palju neist korraga näha on. */
.nv2-reel,.nv2-toode-vaade,.nv2-mootor,.nv2-haaled{padding-block:74px 28px}
.nv2-sammud{padding-block:82px}
.nv2-toode{padding-block:28px 82px}
.nv2-hind{padding-block:82px}
.nv2-kkk{padding-block:74px}
.nv2-lopp{padding-block:96px 88px}


/* ═══ ELAV LAINEVÄLI ════════════════════════════════════════════════
   MIKS canvas ja mitte CSS: CSS saab animeerida ainult seda, mida ta
   ette teab. Siin joonistab brauser 60 korda sekundis PÄRIS helilaine
   sagedusi — kuju sõltub sellest, mida hääl parasjagu ütleb. Seda ei
   saa CSS-iga teha ja seepärast ei näe see välja nagu mall. */
.nv2-laineväli{position:relative;margin-top:30px;min-height:190px;
  border-radius:18px;overflow:hidden;
  background:
    radial-gradient(120% 80% at 50% 120%, rgba(200,160,74,.10), transparent 62%),
    linear-gradient(180deg,rgba(14, 12, 14,.55),rgba(14, 12, 14,.15));
  border:1px solid rgba(232,207,122,.14)}
.nv2-laineväli canvas{display:block;width:100%;height:190px}

/* Tekst istub laineväljal — hääl joonistab tema taha. */
.nv2-laineväli .nv2-h-tekst{position:absolute;left:0;right:0;bottom:20px;
  margin:0;padding:0 clamp(18px,3vw,34px);text-align:center;
  text-shadow:0 2px 24px rgba(14, 12, 14,.95)}

@media (max-width:640px){
  .nv2-laineväli{min-height:150px}
  .nv2-laineväli canvas{height:150px}
}


/* ═══ KULDNE NIIT ═══════════════════════════════════════════════════
   Kolm sammu ei ole enam kolm kasti, vaid üks teekond. Joon joonistab
   end kerimise järgi; maskott sõidab joonel; jaam süttib, kui niit
   sinna jõuab.

   MIKS pathLength="1": nii saab dashoffset olla lihtsalt 0..1 ja JS ei
   pea joone päris pikkust teadma. Üks number vähem, mis võib valeks minna. */
.nv2-niit{position:relative;height:150px;margin-bottom:8px}
.nv2-niit svg{display:block;width:100%;height:150px;overflow:visible}
.nv2-niit path{fill:none;stroke-width:2;stroke-linecap:round;
  vector-effect:non-scaling-stroke}
.nv2-niit-alus{stroke:rgba(232,207,122,.16)}
.nv2-niit-kuld{stroke:url(#nv2-niit-grad);stroke:#e8cf7a;
  filter:drop-shadow(0 0 8px rgba(232,207,122,.75));
  stroke-dasharray:1;stroke-dashoffset:1;
  transition:stroke-dashoffset .12s linear}

.nv2-niit-maskott{position:absolute;top:0;left:0;width:64px;height:auto;
  transform:translate(-50%,-72%);opacity:0;pointer-events:none;
  filter:drop-shadow(0 14px 22px rgba(0,0,0,.6));
  transition:opacity .3s ease}
.nv2-niit.on .nv2-niit-maskott{opacity:1}

/* Jaam süttib alles siis, kui niit temani jõuab. Enne seda on ta tuhm —
   nii on NÄHA, et tegu on järjestusega, mitte kolme paralleelse asjaga. */
.nv2-samm{opacity:.42;transition:opacity .45s ease,transform .45s ease;
  transform:translateY(8px)}
.nv2-samm.jouti{opacity:1;transform:none}
.nv2-samm span{transition:text-shadow .45s ease}
.nv2-samm.jouti span{text-shadow:0 0 26px rgba(232,207,122,.55)}

@media (max-width:1023px){
  .nv2-niit{display:none}      /* kitsal ekraanil pole joonel ruumi elada */
  .nv2-samm{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){
  .nv2-niit-kuld{stroke-dashoffset:0;transition:none}
  .nv2-niit-maskott{display:none}
  .nv2-samm{opacity:1;transform:none}
}


/* ═══ KERIMIS-LIIKUMINE ═════════════════════════════════════════════
   Kaks kohta, mis olid veel liikumatud võred. Muutujad tulevad JS-ist:
   --nv2-keri (0..1) hero jaoks, --nv2-triiv (px) mudelite jaoks.

   MIKS muutujad ja mitte otsene style: nii jääb KOGU liikumise kuju
   CSS-i (kus ta kuulub) ja JS annab ainult ühe numbri. Kui tahad
   liikumist muuta, muudad seda siin — mitte JS-is. */

/* 1) HERO: toode kaldub ja tõuseb kerimise järgi.
      Hõljumis-animatsioon jääb alles — see töötab ka enne kerimist. */
.nv2-hero-toode{--nv2-keri:0}
.nv2-ht-raam{
  transform:
    rotateY(calc(-7deg + var(--nv2-keri) * 5deg))
    rotateX(calc(2deg - var(--nv2-keri) * 4deg))
    translateY(calc(var(--nv2-keri) * -26px))
    scale(calc(1 + var(--nv2-keri) * .03))}

/* 2) MUDELID: read triivivad vastassuundades. */
.nv2-m-vork{--nv2-triiv:0px}
.nv2-m-vork > *{transform:translateX(var(--nv2-triiv));
  transition:transform .18s linear}
.nv2-m-vork.nv2-triiv-vasak > *{transform:translateX(calc(var(--nv2-triiv) * -1))}

@media (max-width:1023px){
  /* Kitsal ekraanil ei ole triivil ruumi ja ta tekitaks ainult
     horisontaalse kerimise — täpselt selle, mida me terve aeg väldime. */
  .nv2-m-vork > *{transform:none !important}
}
@media (prefers-reduced-motion:reduce){
  .nv2-ht-raam{transform:rotateY(-7deg) rotateX(2deg) !important;animation:none}
  .nv2-m-vork > *{transform:none !important}
}


/* ═══ LEHE RÜTM ═════════════════════════════════════════════════════
   Kaheksa ühesugust sektsiooni → viis erinevat iseloomu.
   Ükski sisu ei muutu; muutub see, KUIDAS sektsioonid üksteise järel
   loevad. Kontrast on ainus asi, mis teeb pikast lehest lavastuse. */

/* ── 1) HÄÄL: servast servani, heledam, tsentreeritud ──────────────
   Lehe kõige interaktiivsem koht. Kui ta näeb välja nagu kõik muu,
   ei tule kellelgi pähe seda katsuda. */
.nv2-haaled{
  position:relative;
  margin-block:36px;
  padding-block:88px 72px;
  background:
    radial-gradient(90% 70% at 50% -10%, rgba(200,160,74,.14), transparent 60%),
    linear-gradient(180deg,#1c1a1c 0%,#171517 55%,#121012 100%);
  border-top:1px solid rgba(232,207,122,.16);
  border-bottom:1px solid rgba(232,207,122,.16)}
.nv2-haaled .nv2-kicker,
.nv2-haaled .nv2-h2{text-align:center}
.nv2-haaled .nv2-sub{margin-inline:auto;text-align:center;max-width:56ch}
.nv2-haaled .nv2-h-all{margin-inline:auto;text-align:center}

/* ── 2) TOODE: lehe tumedaim koht — ekraanipilt saab lava ─────────── */
.nv2-toode-vaade{
  background:linear-gradient(180deg,transparent,#04070e 22%,#04070e 78%,transparent);
  padding-block:96px 72px}

/* ── 3) MOOTOR: kitsam ja tehnilisem. See ON andmetabel ja tohib
      välja näha nagu andmed — mitte nagu järjekordne müügiblokk. */
.nv2-mootor .nv2-wrap{max-width:1080px}
.nv2-mootor .nv2-h2{font-size:clamp(1.9rem,3vw,2.7rem)}
.nv2-mootor .nv2-sub{font-size:1rem;max-width:60ch}
.nv2-mootor .nv2-m-kaart{padding:18px 18px 15px;border-radius:12px}
.nv2-mootor .nv2-m-pais h4{font-size:1.02rem}
.nv2-mootor .nv2-m-kirjeldus{font-size:.84rem;margin-bottom:11px}
.nv2-mootor .nv2-m-seaded li{padding:5px 0;font-size:.78rem}

/* ── 4) HINNAD: heledam pind. Otsustamise koht peab olema lehe
      KÕIGE selgem — mitte kõige tumedam. */
.nv2-hind{
  position:relative;
  margin-top:44px;
  padding-block:92px;
  background:
    radial-gradient(80% 60% at 50% 0%, rgba(200,160,74,.10), transparent 62%),
    linear-gradient(180deg,#1e1c1e,#161416 70%,#121012);
  border-top:1px solid rgba(232,207,122,.16)}

/* ── 5) TEEKOND (niit): õhku ümber, et joon saaks hingata ─────────── */
.nv2-sammud{padding-block:96px 88px}

/* ── Sektsiooni-pealkirjade rütm: mitte iga sektsioon ei vaja
      hiiglaslikku pealkirja. Kaks suurt, ülejäänud tagasihoidlikud —
      nii on NÄHA, mis on tähtis. */
.nv2-toode-vaade .nv2-h2,
.nv2-haaled .nv2-h2{font-size:clamp(2.4rem,5vw,4.4rem)}
.nv2-toode .nv2-h2,
.nv2-kkk .nv2-h2{font-size:clamp(1.8rem,3vw,2.6rem)}

@media (max-width:900px){
  .nv2-haaled,.nv2-hind{margin-block:20px;padding-block:64px 56px}
  .nv2-toode-vaade{padding-block:64px 48px}
}


/* Vihje tühjal laineväljal: ilma selleta ei tea keegi, et see ELAB.
   Kaob esimese klõpsu järel (JS lisab .mangis). */
.nv2-laineväli::after{content:attr(data-vihje);position:absolute;
  left:0;right:0;bottom:22px;text-align:center;pointer-events:none;
  font-family:ui-monospace,Menlo,monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:rgba(232,207,122,.55);
  transition:opacity .3s ease}
.nv2-laineväli.mangis::after{opacity:0}


/* ═══════════════════════════════════════════════════════════════════
   UUS JUME — must + valge, kuld ainult aktsendina
   ═══════════════════════════════════════════════════════════════════

   MIKS: tumesinine + kuld igal serval on "premium mall". Päris kino on
   MUST (A24, Nolan, Apple). Must annab kullale sügavuse, mille sinine
   varastab — sinine ja kuld on vastandvärvid ja võitlevad omavahel.

   REEGEL: taust must · kiri valge · KULD = "siin midagi juhtub"
   (nupp, aktiivne valik, elav number). Mitte serv, mitte silt.
   =================================================================== */

.nv2{
  --taust:#08080a;
  --taust2:#0c0c0f;
  --pind:#121215;
  --pind2:#191920;
  --kuld:#d4a545;
  --kuld2:#f0cf7c;
  --kuld3:#fbe9b8;
  --kiri:#ffffff;
  --kiri2:#a6a6ad;
  --kiri3:#68686f;
  /* Servad on VALGE läbipaistvusega, mitte kuldsed. Kuldne serv igal
     kaardil oli see, mis tegi kullast tapeedi. */
  --joon:rgba(255,255,255,.09);
  --joon2:rgba(255,255,255,.16);
  background:var(--taust);
  color:var(--kiri2);
}

/* Filmitera tugevamaks — mustal ta töötab, sinisel ta kadus ära. */
.nv2::after{opacity:.7}

/* ── Sektsioonide taustad mustaks ─────────────────────────────────── */
.nv2-haaled{
  background:
    radial-gradient(90% 70% at 50% -10%, rgba(212,165,69,.10), transparent 62%),
    linear-gradient(180deg,#141418 0%,#0e0e11 55%,#0a0a0c 100%);
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08)}

.nv2-toode-vaade{
  background:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent)}

.nv2-hind{
  background:
    radial-gradient(80% 60% at 50% 0%, rgba(212,165,69,.09), transparent 64%),
    linear-gradient(180deg,#16161b,#101013 70%,#0a0a0c);
  border-top:1px solid rgba(255,255,255,.08)}

.nv2-jalus{background:#000;border-top:1px solid rgba(255,255,255,.08)}

/* ── Kaardid: valge serv, must pind ──────────────────────────────── */
.nv2-m-kaart,.nv2-voime,.nv2-tootekaart,.nv2-h-kaart,.nv2-hind-kaart{
  background:linear-gradient(168deg,var(--pind),var(--taust2));
  border-color:var(--joon)}
.nv2-m-kaart:hover,.nv2-voime:hover,.nv2-h-kaart:hover{
  border-color:var(--joon2)}

/* ── Sektsiooni-sildid: VALGED, mitte kuldsed.
      See üks muudatus võtab lehelt ~8 kuldset elementi ära. ───────── */
.nv2-kicker{color:var(--kiri3)}

/* ── Pealkirjad puhtalt valged. Kuldne gradient-tekst oli ilus, aga
      koos kuldsete servade ja siltidega muutus ta müraks. ────────── */
.nv2-h1,.nv2-h2{color:var(--kiri)}
/* Punkt lause lõpus jääb kuldseks — ÜKS kuldne detail pealkirjas mõjub
   rohkem kui terve kuldne pealkiri. */
.nv2-kuld{color:var(--kuld2);background:none;-webkit-text-fill-color:var(--kuld2)}

/* ── KULD JÄÄB: nupud, aktiivsed valikud, elavad numbrid ─────────── */
.nv2-nupp,.nv2-prompt button,.nv2-tv-sakk[aria-selected="true"],
.nv2-h-mangi,.nv2-hind-esile .nv2-hind-lipp,.nv2-m-olek{
  background:linear-gradient(120deg,var(--kuld),var(--kuld3) 55%,var(--kuld));
  color:#0a0a0c}
.nv2-samm span{color:var(--kuld2);-webkit-text-fill-color:var(--kuld2);background:none}
.nv2-hind-summa{color:var(--kiri)}

/* Tulekul-silt: ainult serv, mitte täidis — nii on kohe näha, mis on
   ELUS (täidetud kuld) ja mis mitte (tühi serv). */
.nv2-m-kaart--tulekul .nv2-m-olek{background:none;color:var(--kiri3);
  border:1px solid rgba(255,255,255,.18)}

/* ── Mudeli-kaardi andmeread: valged jooned ──────────────────────── */
.nv2-m-seaded,.nv2-m-seaded li{border-color:rgba(255,255,255,.07)}
.nv2-m-margid span{color:var(--kiri2);border-color:rgba(255,255,255,.14)}
.nv2-m-pea{color:var(--kiri);border-bottom-color:rgba(255,255,255,.1)}

/* ── Hero tooteraam ─────────────────────────────────────────────── */
.nv2-ht-raam{border-color:rgba(255,255,255,.12);
  box-shadow:0 4px 0 rgba(255,255,255,.04) inset,
             0 80px 130px -55px #000,
             0 0 100px -40px rgba(212,165,69,.35)}

/* ── Kiibid hero's ───────────────────────────────────────────────── */
.nv2-kiibid span{border-color:rgba(255,255,255,.14);color:var(--kiri2)}

/* ── Laineväli ja niit ──────────────────────────────────────────── */
.nv2-laineväli{border-color:rgba(255,255,255,.09);
  background:radial-gradient(120% 80% at 50% 120%, rgba(212,165,69,.09), transparent 64%),
             linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.15))}
.nv2-niit-alus{stroke:rgba(255,255,255,.1)}

/* ── Toote-vaate sakid ──────────────────────────────────────────── */
.nv2-tv-sakk{border-color:rgba(255,255,255,.14);color:var(--kiri2);
  background:rgba(255,255,255,.03)}
.nv2-tv-kaader img{border-color:rgba(255,255,255,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 70px 120px -50px #000}

/* ── Jaluse veerud ──────────────────────────────────────────────── */
.nv2-j-veerg h3{color:var(--kiri3)}


/* ═══ JUUR MUSTAKS ══════════════════════════════════════════════════
   .nv2 sai musta tausta, aga html ja body jäid navy'ks — ja kuna hero
   on LÄBIPAISTEV, paistis nende navy hero'S läbi. Tulemus: lehe ülemine
   kolmandik oli endiselt sinine ja alumine must. Kõige hullem võimalik
   pooltoode.

   MIKS see fail tohib body't puutuda: noa-v2.css laaditakse AINULT
   avalehele. Ükski teine leht seda reeglit ei näe. */
html, body { background:#08080a !important; background-image:none !important; }

/* Ülemine navi: läbipaistev mustal, õhuke valge joon all. */
.site-header, .site-nav-container { background:transparent !important; }
.site-header { border-bottom:1px solid rgba(255,255,255,.07); }


/* ═══════════════════════════════════════════════════════════════════
   PÄRANDFAILI MUUTUJAD ÜMBER — üks plokk, mis parandab 71 reeglit
   ═══════════════════════════════════════════════════════════════════

   JUURPÕHJUS, mis kaheksa disaini-ringi lapiliseks tegi:
   `public/css/noa-landing.css` on 789-realine PÄRANDFAIL vanast lehest,
   laaditud GLOBAALSELT (layout/app.blade.php:83), milles on **71
   `!important` reeglit**, mis kõik sunnivad navy'd. Iga kord, kui ma
   siin midagi mustaks tegin, värvis tema selle tagasi siniseks — ja
   tulemus oli pooleldi must, pooleldi sinine leht. Täpselt see, mis
   loeb "odava paskana".

   MIKS EI KIRJUTA MA 71 REEGLIT ÜLE: sest ta kasutab MUUTUJAID. Kui
   muudan muutujad, muutuvad kõik 71 reeglit korraga ja ma ei pea
   võõrast faili puutuma. Üks plokk, null riski, null dubleerimist.

   ⚠️ noa-v2.css laaditakse PÄRAST noa-landing.css'i (blade rida 10 vs
   app.blade rida 83 — landing-vaade renderdub layout'i sees), seega
   need muutujad võidavad. */
:root{
  --background:240 9% 4%;            /* #08080a — must, mitte navy */
  --foreground:240 5% 68%;
  --heading-foreground:0 0% 100%;

  --noa-navy-0:#08080a;
  --noa-navy-1:#0c0c0f;
  --noa-surface:rgba(18,18,21,.92);
  --noa-gold-0:#d4a545;
  --noa-gold-1:#f0cf7c;
  /* Servad valgeks: kuldne serv IGAL pool oli see, mis tegi kullast
     tapeedi. Kuld tähendab nüüd ainult "siin midagi juhtub". */
  --noa-line:rgba(255,255,255,.16);
  --noa-line-soft:rgba(255,255,255,.08);
}

/* Kaks kohta, kus pärandfail annab otsese värvi ilma muutujata. */
footer{background:#000 !important}


/* ═══ NAVY LOOR VÄLJA ═══════════════════════════════════════════════
   `.nv2-hero-loor` on `linear-gradient(90deg, rgba(15, 13, 15,.97)...)` —
   NAVY kate hero peal. Tema AINUS töö oli peita AI-hallutsineeritud
   võltsveebe (noa-show1..4.jpg), mis on ammu eemaldatud. Loor jäi alles
   ja värvis kogu hero siniseks isegi siis, kui kõik muu oli must.

   ⚠️ Ma arvasin, et eemaldasin ta vaatest — Blade-asendus EI KLAPPINUD
   (teine taane) ja ma ei kontrollinud. Sellepärast oli lehe ülemine
   kolmandik sinine ja alumine must: kaks eri ajastut korraga ekraanil.
   ÕPPETUND: iga string-asenduse järel kontrolli, KAS ta päriselt asendas. */
.nv2-hero-loor{display:none !important}


/* ═══ KASUTUSLOOD ═══════════════════════════════════════════════════
   Neli liikuvat klippi. MIKS nad mängivad ainult siis, kui nad ekraanil
   on: neli korraga dekodeerivat videot kukutavad FPS-i nähtavalt ja
   söövad sülearvuti akut. IntersectionObserver hoiab korraga töös
   ainult need, mida päriselt vaadatakse. */
.nv2-lood{padding-block:84px 60px;
  background:linear-gradient(180deg,transparent,#050506 18%,#050506 82%,transparent)}
.nv2-lood-vork{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:38px}

.nv2-lugu{position:relative;margin:0;border-radius:14px;overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  transition:transform .25s cubic-bezier(.2,.8,.2,1),border-color .25s cubic-bezier(.2,.8,.2,1)}
.nv2-lugu:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.26)}
.nv2-lugu-video{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;
  filter:saturate(.92) contrast(1.04)}

/* Tekst istub klipi peal — eraldi tekstiplokk alla teeks kaardist
   jälle "ruudu pealkirjaga" ja seda me väldime. */
.nv2-lugu figcaption{position:absolute;left:0;right:0;bottom:0;
  display:flex;flex-direction:column;gap:3px;padding:34px 16px 15px;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.86) 58%)}
.nv2-lugu-nimi{font-family:Fraunces,Georgia,serif;font-weight:400;
  font-size:1.08rem;color:#fff}
.nv2-lugu-all{font-size:.82rem;line-height:1.45;color:rgba(255,255,255,.62)}

.nv2-lood-aus{margin:22px 0 0;font-size:.82rem;line-height:1.6;
  color:var(--kiri3);max-width:74ch}

@media (max-width:1023px){.nv2-lood-vork{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.nv2-lood-vork{grid-template-columns:1fr}}


/* ═══ HERO VIDEO ════════════════════════════════════════════════════
   11 kiiret loiget kinoliku varvitootlusega. Ta on ATMOSFAAR, mitte
   naidis — seepara pole tal silti ega raami, ta lihtsalt ON taust.

   MIKS KAKS ULEKATET:
    1) .nv2-hero-vari — tume kalle vasakult, et TEKST jaaks loetavaks.
       Ilma selleta on pealkiri liikuval kaadril loetamatu; sellega on
       vasak pool peaaegu must ja parem pool elab.
    2) .nv2-kiir — olemasolev kuldne valgusvihk, mis seob video ulejaanud
       lehe paletiga.

   MIKS opacity .5 ja mitte 1: taielikult nahtav video voitleb tekstiga
   ja iga kiire loige tombab pilgu ara. Poolel joul on ta liikumine, mis
   toetab, mitte ei varasta. */
.nv2-hero{position:relative;isolation:isolate;overflow:hidden}
/* ⚠️ opacity .5 oli liiga tagasihoidlik — video luges "vaevumarkatava
   tekstuurina", mitte kaadrina. .85 juures on ta PILT, mida vaadatakse,
   ja tekst jaab loetavaks tanu kaldu varjule (allpool). */
.nv2-hero-video{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;z-index:-2;opacity:.85;
  filter:saturate(.95) contrast(1.08)}
/* Vari on KALDU: vasakul peaaegu lapidav (tekst peab lugema), paremal
   peaaegu lahti (kaader peab elama). Uhtlane vari teeks kas teksti
   loetamatuks voi video nahtamatuks — kaldu vari annab molemad. */
.nv2-hero-vari{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(96deg,#08080a 0%,rgba(8,8,10,.96) 28%,rgba(8,8,10,.72) 46%,rgba(8,8,10,.12) 70%,rgba(8,8,10,.30) 100%),
    linear-gradient(180deg,rgba(8,8,10,.82) 0%,transparent 22%,transparent 68%,#08080a 100%)}

/* Mobiilis jaab video alles — varem peideti seal KOIK pildid ja
   esimene ekraan oli lame sinine tekstiplokk. */
@media (max-width:900px){
  .nv2-hero-video{opacity:.55}
  .nv2-hero-vari{background:
    linear-gradient(180deg,rgba(8,8,10,.86) 0%,rgba(8,8,10,.7) 40%,#08080a 92%)}
}
@media (prefers-reduced-motion:reduce){
  .nv2-hero-video{display:none}
}


/* ═══ ROHKEM ELU ════════════════════════════════════════════════════ */

/* 1) TUGEVAM ILMUMINE. Vana: translateY(22px)+opacity — nii peen, et
      silm ei registreerinud. Uus: alt + väiksemalt + udust teravaks.
      Sama kestus, kordades rohkem tunnet. */
.nv2-reveal{transform:translateY(38px) scale(.97);opacity:.001;filter:blur(6px);
  transition:transform .78s cubic-bezier(.16,.84,.44,1),
             opacity .6s ease,
             filter .6s ease}
.nv2-reveal.on{transform:none;opacity:1;filter:none}

/* 2) NUMBRID: monotäht, et lugemise ajal laius ei hüppaks. */
.nv2-arv{font-variant-numeric:tabular-nums}

/* 3) LIIKUV TIKKER — pidev pulss sektsioonide vahel. */
.nv2-tikker{position:relative;overflow:hidden;padding:14px 0;
  border-block:1px solid rgba(255,255,255,.07);
  background:linear-gradient(180deg,rgba(255,255,255,.02),transparent)}
.nv2-tikker-rada{display:flex;width:max-content;
  animation:nv2-libise 38s linear infinite}
.nv2-tikker:hover .nv2-tikker-rada{animation-play-state:paused}
.nv2-tikker-rada span{display:inline-flex;align-items:center;gap:26px;
  padding-inline:13px;white-space:nowrap;
  font-family:ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(255,255,255,.30)}
.nv2-tikker-rada b{color:var(--kuld2);font-weight:400}
.nv2-tikker-rada i{width:4px;height:4px;border-radius:50%;
  background:rgba(240,207,124,.55);flex:none}
@keyframes nv2-libise{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* Servad tuhmiks, et tekst ei lõpeks järsku. */
.nv2-tikker::before,.nv2-tikker::after{content:"";position:absolute;top:0;bottom:0;
  width:140px;z-index:2;pointer-events:none}
.nv2-tikker::before{left:0;background:linear-gradient(90deg,#08080a,transparent)}
.nv2-tikker::after{right:0;background:linear-gradient(270deg,#08080a,transparent)}

/* 4) HINGAV VALGUS tumedates sektsioonides. 18 s tsükkel = teadlikult
      ei märka, aga leht ei tundu surnud, kui sa seda vaatad ja ei keri. */
.nv2-toode-vaade::before,.nv2-lood::before,.nv2-mootor::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(60% 50% at 30% 40%, rgba(212,165,69,.09), transparent 62%);
  animation:nv2-hinga 18s ease-in-out infinite}
.nv2-toode-vaade,.nv2-lood,.nv2-mootor{position:relative}
.nv2-toode-vaade > *,.nv2-lood > *,.nv2-mootor > *{position:relative;z-index:1}
@keyframes nv2-hinga{
  0%,100%{opacity:.5;transform:translate3d(0,0,0) scale(1)}
  50%    {opacity:1;transform:translate3d(6%,-4%,0) scale(1.15)}
}

/* Kaardid tõusevad hoveril jõulisemalt — "power" on ka selles, kui
   selgelt asi vastab puudutusele. */
.nv2-m-kaart:hover,.nv2-lugu:hover,.nv2-h-kaart:hover{
  transform:translateY(-6px)}

@media (prefers-reduced-motion:reduce){
  .nv2-reveal{transform:none;opacity:1;filter:none;transition:none}
  .nv2-tikker-rada,.nv2-toode-vaade::before,.nv2-lood::before,
  .nv2-mootor::before{animation:none}
}


/* ═══ MÖLL: VALGUS JA KALLE ═════════════════════════════════════════
   "tervele lehele too läbimõeldud möll action". Läbimõeldud tähendab:
   liikumine peab tulema sellest, mis lehel JUBA on, mitte uutest
   pöörlevatest kastidest. Kolm asja: klaasi peegeldus, hiire-kalle,
   nupu-pühkimine. Kõik transform/opacity — paigutust ei arvutata ümber. */

/* 1) PEEGELDUS üle tooteraami klaasi. 7 s tsükkel, siis 5 s paus —
      pidev pühkimine muutuks tikitud reklaamiks. */
.nv2-ht-raam{ position:relative; overflow:hidden }
.nv2-ht-raam::after{
  content:""; position:absolute; inset:-40%; pointer-events:none; z-index:3;
  background:linear-gradient(112deg,transparent 38%,rgba(255,255,255,.16) 48%,
                             rgba(255,255,255,.03) 53%,transparent 62%);
  transform:translateX(-130%);
  animation:nv2-peegel 12s cubic-bezier(.3,.1,.2,1) infinite;
}
@keyframes nv2-peegel{
  0%{transform:translateX(-130%)} 58%{transform:translateX(130%)} 100%{transform:translateX(130%)}
}

/* 2) HIIRE-KALLE. JS annab --kx/--ky; CSS teeb töö, nii et raami
      liigutamine ei puuduta paigutust. */
.nv2-hero-toode{ perspective:1400px }
.nv2-ht-raam{
  transform:rotateY(calc(var(--kx,0) * 6deg)) rotateX(calc(var(--ky,0) * -5deg));
  transition:transform .5s cubic-bezier(.2,.8,.2,1);
  transform-style:preserve-3d;
}
.nv2-ht-maskott{
  transform:translate3d(calc(var(--kx,0) * 16px), calc(var(--ky,0) * 12px), 0);
  transition:transform .6s cubic-bezier(.2,.8,.2,1);
}

/* 3) NUPU-PÜHKIMINE. Kuldne nupp on lehe kõige tähtsam element ja ta
      seisis liikumatult. Nüüd jookseb valgus üle, kui hiir peale tuleb. */
.nv2-nupp{ position:relative; overflow:hidden }
.nv2-nupp::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(112deg,transparent 32%,rgba(255,255,255,.55) 50%,transparent 68%);
  transform:translateX(-120%);
  transition:transform .62s cubic-bezier(.2,.7,.3,1);
}
.nv2-nupp:hover::after{ transform:translateX(120%) }

/* 4) TOOTE-SAKID: aktiivse saki all liigub kuldne joon. */
.nv2-tv-kaader{ position:relative }
.nv2-tv-kaader img{
  animation:nv2-hinga-pilt 14s ease-in-out infinite;
}
@keyframes nv2-hinga-pilt{
  0%,100%{ transform:scale(1) translateY(0) }
  50%    { transform:scale(1.014) translateY(-5px) }
}

@media (prefers-reduced-motion:reduce){
  .nv2-ht-raam::after,.nv2-tv-kaader img{ animation:none }
  .nv2-ht-raam,.nv2-ht-maskott{ transform:none }
}


/* ═══════════════════════════════════════════════════════════════════
   SEIN — kolm liikuvat rida servast servani
   ═══════════════════════════════════════════════════════════════════ */

.nv2-sein{ position:relative; padding-block:78px 54px; overflow:hidden;
  background:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent) }
.nv2-sein-pea{ max-width:1180px; margin:0 auto 34px; padding-inline:24px }

.nv2-sein-lava{ display:flex; flex-direction:column; gap:12px }

/* Rada on max-content lai ja libiseb -50% — sisu on kaks korda, seega
   pool rada on täpselt üks tsükkel ja üleminek on nähtamatu. */
.nv2-sein-rida{ overflow:hidden }
.nv2-sein-rada{ display:flex; gap:12px; width:max-content;
  will-change:transform }

/* Eri suund JA eri kiirus: kolm rida ei jõua kunagi sünkrooni. */
.nv2-sein-rida--1 .nv2-sein-rada{ animation:nv2-sein-vasak 68s linear infinite }
.nv2-sein-rida--2 .nv2-sein-rada{ animation:nv2-sein-parem 84s linear infinite }
.nv2-sein-rida--3 .nv2-sein-rada{ animation:nv2-sein-vasak 57s linear infinite }
@keyframes nv2-sein-vasak{ from{transform:translateX(0)}    to{transform:translateX(-50%)} }
@keyframes nv2-sein-parem{ from{transform:translateX(-50%)} to{transform:translateX(0)} }
.nv2-sein-lava:hover .nv2-sein-rada{ animation-play-state:paused }

/* ÜHINE KÕRGUS hoiab rea sirge; ERINEV LAIUS teeb temast seina.
   Laiuse annab plaadi enda kuvasuhe — CSS ei pea seda teadma. */
.nv2-sp{ position:relative; margin:0; flex:none; border-radius:11px;
  overflow:hidden; background:#0e0e11;
  border:1px solid rgba(255,255,255,.07);
  transition:transform .32s cubic-bezier(.16,.84,.44,1),
             border-color .32s ease, filter .32s ease }
.nv2-sp video{ display:block; height:clamp(132px, 17.5vh, 226px); width:auto;
  object-fit:cover; filter:saturate(.94) }

.nv2-sp:hover{ transform:scale(1.055); border-color:rgba(240,207,124,.42);
  filter:brightness(1.12); z-index:2 }

/* Servad tuhmiks — plaat ei tohi lõppeda terava lõikega. */
.nv2-sein-lava{ mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  -webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent) }

.nv2-sein-aus{ max-width:1180px; margin:26px auto 0; padding-inline:24px;
  font-size:.82rem; line-height:1.6; color:var(--kiri3) }

@media (max-width:760px){
  /* Telefonis liigub ainult rada. Kümme samaaegset dekodeerimist sööks
     aku ja kukutaks FPS-i; plakatist ei jää midagi puudu. */
  .nv2-sein-lava{ gap:8px }
  .nv2-sein-rada{ gap:8px }
  .nv2-sp video{ height:118px }
  .nv2-sein-rida--3{ display:none }
}

@media (prefers-reduced-motion:reduce){
  .nv2-sein-rada{ animation:none }
  .nv2-sein-rida{ overflow-x:auto }
}


/* ═══ SEINA PAIGUTUS ════════════════════════════════════════════════
   .nv2-sein sai teema-CSS-ist display:flex ja pealkiri surus end
   180 px laiuseks seina kõrvale. block paneb ta jälle seina PEALE. */
.nv2-sein{ display:block !important; background:#000 !important;
  padding-block:74px 52px }
.nv2-sein-pea{ display:block; width:100%; max-width:1180px;
  margin:0 auto 30px !important; padding-inline:24px }
.nv2-sein-pea .nv2-h2{ margin:0 0 12px }
.nv2-sein-pea .nv2-sub{ max-width:62ch }
.nv2-sein-lava{ display:flex !important; flex-direction:column; width:100% }

/* Pehme üleminek naabersektsioonidesse — ilma selleta lõikab must
   ristkülik lehe kaheks. */
.nv2-sein::before,.nv2-sein::after{ content:; position:absolute;
  left:0; right:0; height:70px; pointer-events:none; z-index:1 }
.nv2-sein::before{ top:0; background:linear-gradient(180deg,#08080a,transparent) }
.nv2-sein::after{ bottom:0; background:linear-gradient(0deg,#08080a,transparent) }


/* ═══ KLEEPUV PAIS: valge tekst mustal ══════════════════════════════
   Teema lülitab kleepuvas päises teksti mustaks (ta eeldab VALGET
   tausta). Meie päis on must — nii et must tekst kadus ära. */
.site-header.lqd-is-sticky,
.site-header.lqd-is-sticky *{ color:#fff !important }
.site-header.lqd-is-sticky .site-header-nav{
  background:rgba(8,8,10,.92) !important;
  backdrop-filter:saturate(1.2) blur(14px);
  -webkit-backdrop-filter:saturate(1.2) blur(14px);
  border-bottom:1px solid rgba(255,255,255,.10) !important;
  box-shadow:0 14px 38px rgba(0,0,0,.6) !important }

/* Nupud: teema annab neile kleepudes musta serva ja musta tausta. */
.site-header.lqd-is-sticky a[class*=border-]{
  border-color:rgba(255,255,255,.22) !important }
.site-header.lqd-is-sticky a[class*=border-]:hover{
  background:#fff !important; border-color:#fff !important }
.site-header.lqd-is-sticky a[class*=border-]:hover *,
.site-header.lqd-is-sticky a[class*=border-]:hover{ color:#0a0a0c !important }

/* Kuldne NOA-logo peab jääma kuldseks ka siis, kui reegel ütleb valge. */
.site-header.lqd-is-sticky .site-logo img{ opacity:1 !important }


/* ═══ HERO PROOV — vorm + tulem ═══════════════════════════════════════
   Stiil järgib .nv2-prompt't (sama raam, sama kuld), aga vorm on nüüd
   kaherealine: lause + hääl. Tulem ilmub vormi ALLA, mitte modaalina —
   kasutaja ei tohi kaotada seda, mida ta just kirjutas. */
.nv2-proov{display:grid;gap:8px;margin:34px 0 18px;max-width:680px;
  padding:10px;border-radius:20px;background:rgba(32,30,32,.74);
  border:1px solid var(--joon);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 24px 60px -30px rgba(0,0,0,.8)}
.nv2-proov:focus-within{border-color:rgba(232,207,122,.5)}
.nv2-proov textarea{width:100%;min-height:74px;max-height:160px;resize:vertical;
  background:transparent;border:0;outline:0;color:var(--kiri);
  font:inherit;font-size:1.08rem;line-height:1.45;padding:12px 14px 6px}
.nv2-proov textarea::placeholder{color:rgba(174,185,207,.55)}
.nv2-proov-rida{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.nv2-proov-loendur{font-family:ui-monospace,Menlo,monospace;font-size:11px;
  letter-spacing:.12em;color:rgba(174,185,207,.5);margin-left:14px;margin-right:auto}
.nv2-proov-loendur.taies{color:var(--kuld2)}
.nv2-proov select{appearance:none;-webkit-appearance:none;cursor:pointer;
  background:rgba(255,255,255,.05) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23c8a04a'/%3E%3C/svg%3E") no-repeat right 12px center;
  border:1px solid rgba(255,255,255,.1);border-radius:12px;color:var(--kiri);
  font:inherit;font-size:.95rem;padding:11px 34px 11px 14px;min-width:150px}
.nv2-proov select:focus{outline:0;border-color:rgba(232,207,122,.5)}
.nv2-proov button[type=submit]{display:inline-flex;align-items:center;gap:9px;flex:none;
  padding:13px 24px;border:0;border-radius:12px;cursor:pointer;
  font-size:1.02rem;font-weight:600;color:#151315;
  background:linear-gradient(120deg,var(--kuld),var(--kuld2) 60%,#d9b85c);
  box-shadow:0 14px 38px -14px rgba(200,160,74,.55);
  transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease}
.nv2-proov button[type=submit]:hover{transform:translateY(-1px);
  box-shadow:0 20px 48px -14px rgba(200,160,74,.7)}
.nv2-proov button[type=submit]:disabled{opacity:.6;cursor:progress;transform:none}
.nv2-proov button svg{width:12px;height:14px}
.nv2-proov.toos button[type=submit] svg{animation:nv2-pulss .9s ease-in-out infinite}
@keyframes nv2-pulss{50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.nv2-proov.toos button[type=submit] svg{animation:none}}

.nv2-proov-seis{min-height:1.4em;font-size:.92rem;color:var(--kiri2);margin:0 0 10px 6px}
.nv2-proov-seis.viga{color:#f0a7a7}

/* ── Tulem ── */
.nv2-proov-tulem{max-width:680px;margin:0 0 22px;padding:16px 18px 14px;
  border-radius:18px;border:1px solid rgba(232,207,122,.28);
  background:linear-gradient(180deg,rgba(200,160,74,.09),rgba(200,160,74,.03));
  display:grid;gap:10px}
.nv2-proov-tulem[hidden]{display:none}
.nv2-pt-pea{display:flex;align-items:center;gap:12px}
.nv2-pt-mangi{flex:none;width:44px;height:44px;border-radius:50%;border:0;cursor:pointer;
  background:linear-gradient(120deg,var(--kuld),var(--kuld2));color:#151315;
  display:grid;place-items:center;box-shadow:0 10px 26px -10px rgba(200,160,74,.7)}
.nv2-pt-mangi svg{width:16px;height:16px;transform:translateX(1px)}
.nv2-pt-mangi .paus{display:none;transform:none}
.nv2-proov-tulem.mangib .nv2-pt-mangi .mangi{display:none}
.nv2-proov-tulem.mangib .nv2-pt-mangi .paus{display:block}
.nv2-pt-tekst{font-size:1rem;color:var(--kiri);line-height:1.4;margin:0}
.nv2-pt-kestus{font-family:ui-monospace,Menlo,monospace;font-size:11.5px;
  letter-spacing:.14em;color:var(--kuld);white-space:nowrap;margin-left:auto}
.nv2-pt-sub{min-height:1.6em;font-size:1.05rem;color:var(--kuld2);font-style:italic;margin:0;
  padding-left:56px;transition:opacity .15s}
.nv2-pt-lingid{display:flex;gap:8px;flex-wrap:wrap;padding-left:56px}
.nv2-pt-lingid a{font-size:.86rem;padding:8px 13px;border-radius:10px;text-decoration:none;
  border:1px solid rgba(255,255,255,.12);color:var(--kiri2);transition:border-color .15s,color .15s}
.nv2-pt-lingid a:hover{border-color:rgba(232,207,122,.5);color:var(--kiri)}
.nv2-pt-lingid a.esmane{border-color:transparent;color:#151315;
  background:linear-gradient(120deg,var(--kuld),var(--kuld2))}
.nv2-pt-lingid a[hidden]{display:none}

@media (max-width:760px){
  .nv2-proov{max-width:none}
  .nv2-proov select{min-width:0;flex:1}
  .nv2-proov button[type=submit]{flex:1;justify-content:center}
  .nv2-pt-sub,.nv2-pt-lingid{padding-left:0}
}

/* Kitsal telefonil vajavad häälevalik ja kuulamisnupp oma täislaiust rida. */
@media (max-width:399px){
  .nv2-proov-rida{flex-direction:column;align-items:stretch}
  .nv2-proov select,.nv2-proov button[type=submit]{flex:none;width:100%}
}

/* NOA kinoesilinastus: oma film kannab avalehte, sisu jääb selgelt loetavaks. */
.nc{--taust:#0b0c0c;--taust2:#111312;--pind:#191b19;--kiri:#f4f0e5;--kiri2:#b4b6ad;--kuld:#d3b770;--kuld2:#eddba5;--joon:#ffffff20}
.nc::after{display:none}
.nc .nv2-wrap{max-width:1440px;padding-inline:clamp(22px,5vw,80px)}
.nc .nv2-kicker{font-size:10px;letter-spacing:.22em;color:var(--kuld)}
.nc .nv2-h2{font-size:clamp(36px,4.6vw,68px);line-height:1.07;letter-spacing:-.04em}
.nc em{font-family:Fraunces,Georgia,serif;font-weight:300;color:var(--kuld2)}
.nc-hero{min-height:820px;height:calc(100svh - 10px);max-height:1100px;position:relative;display:flex;align-items:center;isolation:isolate;background:#070a0a}
.nc-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% center;z-index:-3;opacity:.77}
.nc-hero::before{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(6,9,9,.88),rgba(6,9,9,.4) 48%,transparent 80%),linear-gradient(0deg,#0b0c0c,transparent 28%)}
.nc-hero-sisu{width:100%;padding-top:80px;padding-bottom:100px}
.nc-hero h1{font-family:Fraunces,Georgia,serif;font-weight:300;font-size:clamp(64px,7.8vw,116px);line-height:1.02;letter-spacing:-.055em;color:var(--kiri);margin:24px 0 28px;max-width:920px}
.nc-sisse{font-size:17px;line-height:1.75;max-width:480px;color:#d6d8d0}
.nc-tegevused{display:flex;flex-wrap:wrap;gap:12px;margin:32px 0 18px}
.nc-nupp{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-height:54px;padding:15px 24px;border:1px solid #ffffff45;border-radius:4px;background:#13171370;color:var(--kiri);font-size:14px;font-weight:600;text-decoration:none;transition:background .2s,transform .2s}
.nc-nupp:hover{background:#ffffff20;color:#fff;transform:translateY(-2px)}
.nc-nupp-kuld{background:var(--kuld2);border-color:var(--kuld2);color:#12150f}
.nc-nupp-kuld:hover{background:#fff0bf;color:#12150f}
.nc-saada{font-size:12px;line-height:1.7;color:#c3c4b9;margin:22px 0 0;max-width:440px}
.nc-filmiriba{position:absolute;bottom:32px;width:100%;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:.16em;color:#bbbcae}
.nc-filmiriba button{border:1px solid #ffffff35;border-radius:3px;background:transparent;color:inherit;padding:10px 14px;letter-spacing:0;font-size:11px;cursor:pointer}
.nc-manifest{padding-top:100px;padding-bottom:90px}
.nc-pealkirjarida{display:flex;justify-content:space-between;gap:24px;align-items:baseline;margin-bottom:28px}
.nc-number{font-size:10px;letter-spacing:.12em;color:#8c9187}
.nc-kaks{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(30px,7vw,110px)}
.nc-kaks>p{font-size:16px;line-height:1.8;max-width:440px;margin:0;color:var(--kiri2)}
.nc-treiler{display:block;width:100%;aspect-ratio:21/9;background:#030404;object-fit:contain;margin-top:44px;border:1px solid #ffffff1c;border-radius:5px}
.nc-filmialune{display:flex;justify-content:space-between;gap:24px;align-items:baseline;padding-top:18px;color:#a8ada0;font-size:10px;letter-spacing:.1em}
.nc-filmialune p{max-width:560px;font-size:11px;line-height:1.7;letter-spacing:0;margin:0}
.nc-proovi{padding:90px 0;background:#131613;border-block:1px solid #ffffff12;scroll-margin-top:100px}
.nc-proovikaart{background:#1a1e19;border:1px solid #ffffff24;padding:26px;border-radius:8px;box-shadow:0 20px 60px #0003;min-width:0}
.nc-kaardisilt{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px;letter-spacing:.14em;color:#bfc4b4}
.nc-kaardisilt span{font-size:9px;color:#cee1aa;background:#cee1aa15;padding:5px 8px;border-radius:3px}
.nc .nv2-proov{margin:22px 0 8px;background:#10140f;border:1px solid #ffffff20;border-radius:6px;box-shadow:none}
.nc .nv2-proov textarea{font-size:16px;min-height:110px}
.nc .nv2-proov select{background-color:#23291f;border-radius:4px}
.nc .nv2-proov button[type=submit]{background:var(--kuld2);box-shadow:none;border-radius:4px}
.nc .nv2-proov-seis{margin-bottom:0}
.nc .nv2-toode-vaade,.nc .nv2-haaled,.nc .nv2-mootor,.nc .nv2-hind,.nc .nv2-kkk{padding-block:90px;background:transparent;border-bottom:1px solid #ffffff12}
.nc .nv2-sub{font-size:16px;max-width:600px;color:var(--kiri2)}
.nc .nv2-tv-lava{max-width:1000px;margin-inline:auto;border-radius:6px}
.nc .nv2-tv-kaader img{border-radius:4px}
.nc .nv2-tv-sakid{justify-content:flex-start;margin:30px 0}
.nc .nv2-tv-sakk{border-radius:4px}
.nc .nv2-h-vork{grid-template-columns:repeat(4,1fr)}
.nc .nv2-h-kaart{border-radius:5px;background:#171a16;box-shadow:none}
.nc .nv2-m-haal{grid-template-columns:repeat(4,minmax(0,1fr))}
.nc .nv2-m-kaart{border:1px solid #ffffff20;background:#141713;border-radius:5px;box-shadow:none;transform:none!important}
.nc .nv2-m-kaart h4{font-size:18px}
.nc .nv2-m-pais{flex-wrap:wrap}
.nc .nv2-m-olek{font-size:9px}
.nc .nv2-m-id{font-size:10px;overflow-wrap:anywhere}
.nc .nv2-m-pea{margin-top:36px}
.nc .nv2-m-jalus{display:none}
.nc-tulemas{margin-top:36px;border:1px solid #ffffff25;border-radius:5px;padding:0 24px}
.nc-tulemas>summary{cursor:pointer;display:flex;justify-content:space-between;gap:20px;list-style:none;padding:24px 0;color:var(--kiri);font-size:18px}
.nc-tulemas>summary::-webkit-details-marker{display:none}
.nc-tulemas>summary span{font-size:12px;color:var(--kiri2);display:flex;align-items:center;gap:22px}
.nc-tulemas>p{font-size:14px;line-height:1.7}
.nc-tulemas[open]{padding-bottom:24px}
.nc .nv2-hind-kaart{background:#151813;border:1px solid #ffffff24;border-radius:5px;box-shadow:none}
.nc .nv2-hind-esile{border-color:#d3b77088;background:#1c2018}
.nc .nv2-hind-nupp{border-radius:4px}
.nc .nv2-hind-lipp{border-radius:3px;background:var(--kuld2);color:#10140f}
.nc .nv2-hind-summa{font-size:54px}
.nc .nv2-kkk-rida{border-bottom:1px solid #ffffff20}
.nc .nv2-kkk-rida summary{font-size:17px;padding-block:24px}
.nc .nv2-kkk-rida p{font-size:15px;max-width:760px;line-height:1.8}
.nc .nv2-lopp{padding:100px 0;background:#141713}
.nc .nv2-lopp-maskott{display:none}
.nc .nv2-nupp{border-radius:4px;background:var(--kuld2);color:#12150f;box-shadow:none}
.nc :is(a,button,summary,select,textarea):focus-visible{outline:2px solid var(--kuld2);outline-offset:5px}
body:has(.nc) #frontend-local-navbar{background:#0b0e0ded!important;border-bottom:1px solid #ffffff1c!important;color:#edece4!important;backdrop-filter:blur(16px)}
body:has(.nc) .site-logo img{max-height:38px;width:auto}
body:has(.nc) .nv2-jalus{background:#0b0c0c;border-top:1px solid #ffffff18}
@media(max-width:1000px){
 .nc-hero{min-height:740px;max-height:none;height:auto}
 .nc-hero h1{font-size:78px}
 .nc-kaks{gap:32px}
 .nc .nv2-m-haal{grid-template-columns:repeat(2,minmax(0,1fr))}
 .nc .nv2-h-vork{grid-template-columns:repeat(3,minmax(0,1fr))}
 .nc-proovikaart{padding:18px}
}
@media(max-width:640px){
 .nc-hero{min-height:750px}
 .nc-film{object-position:62% center;opacity:.6}
 .nc-hero::before{background:linear-gradient(0deg,#0b0c0c,rgba(6,9,9,.25) 80%)}
 .nc-hero-sisu{padding-top:125px;padding-bottom:140px}
 .nc-hero h1{font-size:clamp(49px,12vw,74px);letter-spacing:-.055em;margin:24px 0}
 .nc-sisse{font-size:15px;max-width:330px}
 .nc-nupp{font-size:12px;gap:14px;padding:14px 17px;min-height:48px}
 .nc-filmiriba{bottom:24px;flex-wrap:wrap;gap:14px;font-size:8px}
 .nc-filmiriba button{margin-left:auto}
 .nc-filmiriba>span:nth-child(2){display:none}
 .nc-manifest{padding-block:58px}
 .nc-number{display:none}
 .nc-kaks{grid-template-columns:1fr;gap:24px}
 .nc-pealkirjarida{margin-bottom:16px}
 .nc-treiler{margin-top:28px;aspect-ratio:16/9}
 .nc-filmialune{flex-wrap:wrap;gap:12px}
 .nc-filmialune p{order:3;flex-basis:100%}
 .nc-proovi{padding-block:54px}
 .nc .nv2-proov-rida{flex-direction:column;align-items:stretch}
 .nc .nv2-proov select,.nc .nv2-proov button[type=submit]{flex:none;width:100%}
 .nc .nv2-toode-vaade,.nc .nv2-haaled,.nc .nv2-mootor,.nc .nv2-hind,.nc .nv2-kkk{padding-block:54px}
 .nc .nv2-m-haal{grid-template-columns:1fr}
 .nc .nv2-h-vork{grid-template-columns:repeat(2,minmax(0,1fr))}
 .nc-tulemas{padding-inline:16px}
 .nc-tulemas>summary{font-size:16px;align-items:center}
 .nc-tulemas>summary span{font-size:10px;gap:8px}
}
@media(prefers-reduced-motion:reduce){.nc *, .nc *::before,.nc *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
body:has(.nc) .mobile-nav-trigger>span>span{background:#edece4!important}
body:has(.nc) .mobile-nav-trigger{background:#ffffff12!important}
.nc-manifest{scroll-margin-top:80px}
.nc .nv2-reveal{opacity:1;transform:none;transition:none}