/* Kontaktná karta „Zavolajte mi späť“ + mobilná lišta. Zdroj: _nastroje/vizitka-karta/karta.css (rozdaj.sh kopíruje do oboch webov).
   Téma sa berie z tokenov každej značky (.znacka-63 / .znacka-53). */

.nk{
  --nk-pad:clamp(20px,2.2vw,28px);
  position:relative; isolation:isolate; overflow:hidden;
  display:flex; flex-direction:column; gap:18px;
  padding:var(--nk-pad);
  border:1px solid var(--nk-line);
  border-radius:var(--nk-r);
  background:var(--nk-panel);
  color:var(--nk-text);
  font-family:var(--nk-body);
  margin-top:var(--nk-gap-top,20px);
  scroll-margin-top:110px; /* skok na #zavolajte bez JS: karta nezostane pod pevnou hlavičkou */
}
.nk::before{ /* jemná zlatá žiara v rohu — rovnaký jazyk ako pôvodná karta */
  content:""; position:absolute; inset:-30% -25% auto auto; width:340px; height:340px; z-index:-1; pointer-events:none;
  background:radial-gradient(closest-side,var(--nk-glow),transparent 70%);
}
.nk::after{ /* tenká zlatá linka hore */
  content:""; position:absolute; left:var(--nk-pad); right:var(--nk-pad); top:0; height:1px;
  background:linear-gradient(90deg,transparent,var(--nk-gold) 50%,transparent); opacity:.55;
}

/* hlavička */
.nk__stav{display:flex; align-items:center; gap:10px; font-family:var(--nk-mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--nk-gold)}
.nk__stav i{width:7px; height:7px; border-radius:50%; background:var(--nk-gold); box-shadow:0 0 0 4px var(--nk-gold-soft); flex:none}
.nk__nadpis{margin:0; font-family:var(--nk-head); font-weight:400; font-size:clamp(28px,2.6vw,34px); line-height:1.08; letter-spacing:-.01em; color:var(--nk-text)}
.nk__nadpis em{font-style:italic; color:var(--nk-gold)}
.nk__podnadpis{margin:-6px 0 0; font-size:14.5px; line-height:1.55; color:var(--nk-muted); max-width:38ch}

/* formulár */
.nk__form{display:grid; gap:12px}
.nk__form[hidden]{display:none}
.nk__pole{display:grid; gap:6px}
.nk__pole > span{font-family:var(--nk-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--nk-muted)}
.nk__vstup{
  display:flex; align-items:center; min-height:50px;
  border:1px solid var(--nk-line); border-radius:var(--nk-r-field);
  background:var(--nk-field); transition:border-color .18s, box-shadow .18s, background .18s;
}
.nk__vstup:focus-within{border-color:var(--nk-gold); box-shadow:0 0 0 3px var(--nk-gold-soft); background:var(--nk-field-focus)}
.nk__vstup input{
  all:unset; box-sizing:border-box; flex:1; min-width:0; height:48px; padding:0 14px;
  font:500 16px/1 var(--nk-body); color:var(--nk-text); /* 16px = iPhone nezoomuje */
}
.nk__vstup input::placeholder{color:var(--nk-muted); opacity:.55; font-weight:400; text-transform:none; letter-spacing:0; font-family:var(--nk-body)}
.nk .nk__vstup input{text-transform:none; letter-spacing:0}
.nk__predvolba{padding:0 0 0 14px; font:500 16px/1 var(--nk-body); color:var(--nk-muted); display:flex; align-items:center; gap:8px}
.nk__predvolba::after{content:""; width:1px; height:20px; background:var(--nk-line)}
.nk__pole[data-chyba] .nk__vstup{border-color:var(--nk-chyba)}
.nk__chyba{font-size:12.5px; color:var(--nk-chyba); min-height:0}

.nk__suhlas{display:grid; grid-template-columns:20px 1fr; gap:10px; align-items:start; font-size:12.5px; line-height:1.5; color:var(--nk-muted); cursor:pointer; margin-top:2px}
.nk__suhlas input{appearance:none; width:20px; height:20px; margin:0; border:1px solid var(--nk-line-strong); border-radius:var(--nk-r-check); background:var(--nk-field); display:grid; place-items:center; cursor:pointer; transition:.15s}
.nk__suhlas input:checked{background:var(--nk-gold); border-color:var(--nk-gold)}
.nk__suhlas input:checked::after{content:""; width:10px; height:5px; border:2px solid var(--nk-ink); border-top:0; border-right:0; transform:translateY(-1px) rotate(-45deg)}
.nk__suhlas input:focus-visible{outline:2px solid var(--nk-gold); outline-offset:2px}
.nk__suhlas[data-chyba] input{border-color:var(--nk-chyba)}
.nk__suhlas a{color:var(--nk-text); text-decoration:underline; text-underline-offset:3px; text-decoration-color:var(--nk-line-strong)}

.nk__cta{
  all:unset; box-sizing:border-box; cursor:pointer; position:relative; overflow:hidden;
  display:flex; align-items:center; justify-content:center; gap:10px; min-height:56px; padding:0 22px;
  border-radius:var(--nk-r-btn); background:linear-gradient(180deg,var(--nk-gold-2),var(--nk-gold));
  color:var(--nk-ink); font:600 16.5px/1 var(--nk-body); letter-spacing:.005em;
  box-shadow:0 10px 30px -12px var(--nk-gold-glow), inset 0 1px 0 rgba(255,255,255,.35);
  transition:transform .18s, box-shadow .18s, filter .18s;
}
.nk__cta:hover{transform:translateY(-1px); box-shadow:0 16px 40px -14px var(--nk-gold-glow), inset 0 1px 0 rgba(255,255,255,.35)}
.nk__cta:active{transform:translateY(0); filter:brightness(.97)}
.nk__cta:focus-visible{outline:2px solid var(--nk-gold-2); outline-offset:3px}
.nk__cta .sip{transition:transform .2s}
.nk__cta:hover .sip{transform:translateX(3px)}
.nk__cta[aria-busy="true"]{pointer-events:none; filter:saturate(.6)}
.nk__mikro{margin:-2px 0 0; text-align:center; font-size:12.5px; color:var(--nk-muted)}
.nk__mikro b{color:var(--nk-text); font-weight:500}

/* potvrdenie */
.nk__ok{display:grid; gap:10px; padding:22px 18px; text-align:center; border:1px solid var(--nk-gold-tich); border-radius:var(--nk-r-field); background:var(--nk-gold-soft)}
.nk__ok[hidden]{display:none}
.nk__ok .znak{width:46px; height:46px; margin:0 auto; border-radius:50%; display:grid; place-items:center; background:var(--nk-gold); color:var(--nk-ink); font-size:22px}
.nk__ok b{font-family:var(--nk-head); font-weight:400; font-size:24px; color:var(--nk-text)}
.nk__ok p{margin:0; font-size:14px; color:var(--nk-muted); line-height:1.5}

/* siete — ikonky namiesto drobného textu */
.nk__siete{display:flex; align-items:center; gap:10px; padding-top:16px; border-top:1px solid var(--nk-line)}
.nk__siete > span{font-family:var(--nk-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--nk-muted); margin-right:auto}
/* .nk a.nk__ikona: vyššia váha než globálne a[href^="mailto:"]{display:inline-block} na 1053 (presne tá chyba, čo rozbila riadok E-mail) */
.nk a.nk__ikona{
  width:42px; height:42px; display:grid; place-items:center; flex:none;
  border:1px solid var(--nk-line); border-radius:var(--nk-r-icon); color:var(--nk-text); background:var(--nk-field);
  transition:border-color .18s, color .18s, transform .18s, background .18s;
}
.nk a.nk__ikona:hover{border-color:var(--nk-gold); color:var(--nk-gold); transform:translateY(-2px)}
.nk__ikona:focus-visible{outline:2px solid var(--nk-gold); outline-offset:2px}
.nk__ikona svg{width:19px; height:19px}

/* NBS — overiteľný údaj ako pečať, nie drobný text */
.nk__nbs{
  all:unset; box-sizing:border-box; cursor:pointer; display:grid; grid-template-columns:auto 1fr auto; gap:12px; align-items:center;
  padding:12px 14px; border:1px dashed var(--nk-line-strong); border-radius:var(--nk-r-field); transition:border-color .18s, background .18s;
}
.nk__nbs:hover{border-color:var(--nk-gold); border-style:solid; background:var(--nk-gold-soft)}
.nk__nbs:focus-visible{outline:2px solid var(--nk-gold); outline-offset:2px}
.nk__nbs .stit{width:34px; height:34px; display:grid; place-items:center; border-radius:50%; color:var(--nk-ok); background:var(--nk-ok-soft)}
.nk__nbs .stit svg{width:18px; height:18px}
.nk__nbs .t{display:grid; gap:2px; font-size:13px; line-height:1.35; color:var(--nk-text)}
.nk__nbs .t small{font-size:11.5px; color:var(--nk-muted)}
.nk__nbs .t b{font-family:var(--nk-mono); font-weight:500; letter-spacing:.04em; color:var(--nk-gold)}
.nk__nbs .ako{font-family:var(--nk-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--nk-gold); white-space:nowrap}

/* toast */
.nk-toast{position:fixed; left:50%; bottom:calc(24px + env(safe-area-inset-bottom)); transform:translate(-50%,20px); opacity:0; z-index:9999;
  padding:12px 18px; border-radius:12px; background:#0d1220; color:#f1f5ff; border:1px solid rgba(255,255,255,.12); font:500 14px/1.4 Inter,system-ui,sans-serif;
  box-shadow:0 20px 50px -20px rgba(0,0,0,.8); transition:.3s; max-width:min(92vw,420px); text-align:center; pointer-events:none}
.nk-toast.je{opacity:1; transform:translate(-50%,0)}

/* ===== MOBIL: lepkavá lišta + spodná plachta ===== */
.nk-lista{display:none}
@media (max-width:899px){
  .nk-lista{
    display:flex; align-items:center; gap:12px; position:fixed; left:10px; right:10px; z-index:900;
    bottom:calc(10px + env(safe-area-inset-bottom)); padding:8px 8px 8px 10px;
    border:1px solid var(--nk-line); border-radius:var(--nk-r-bar); background:var(--nk-bar-bg);
    backdrop-filter:blur(18px) saturate(1.3); -webkit-backdrop-filter:blur(18px) saturate(1.3);
    box-shadow:0 18px 40px -16px rgba(0,0,0,.85);
    transform:translateY(140%); transition:transform .45s cubic-bezier(.22,1,.36,1);
  }
  .nk-lista.je{transform:none}
  .nk-lista img{width:40px; height:40px; border-radius:50%; object-fit:cover; object-position:center 20%; border:1px solid var(--nk-gold-tich); flex:none; background:var(--nk-photo-bg)}
  .nk-lista .kto{display:grid; gap:1px; min-width:0; flex:1}
  .nk-lista .kto b{font:500 14.5px/1.2 var(--nk-body); color:var(--nk-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
  .nk-lista .kto small{font-size:11.5px; color:var(--nk-muted); white-space:nowrap}
  .nk-lista button{all:unset; cursor:pointer; flex:none; padding:0 16px; height:44px; display:flex; align-items:center; border-radius:var(--nk-r-btn);
    background:linear-gradient(180deg,var(--nk-gold-2),var(--nk-gold)); color:var(--nk-ink); font:600 14.5px/1 var(--nk-body)}
  .nk-lista button:focus-visible{outline:2px solid var(--nk-gold-2); outline-offset:2px}
}
.nk-plachta{position:fixed; inset:0; z-index:1000; display:grid; align-items:end; visibility:hidden}
.nk-plachta.je{visibility:visible}
.nk-plachta__clona{position:absolute; inset:0; background:rgba(2,4,10,.62); opacity:0; transition:opacity .3s}
.nk-plachta.je .nk-plachta__clona{opacity:1}
.nk-plachta__telo{position:relative; max-height:92dvh; overflow:auto; transform:translateY(100%); transition:transform .45s cubic-bezier(.22,1,.36,1);
  padding:10px 4px calc(8px + env(safe-area-inset-bottom))}
.nk-plachta.je .nk-plachta__telo{transform:none}
.nk-plachta__telo::before{content:""; display:block; width:42px; height:4px; border-radius:2px; background:rgba(255,255,255,.28); margin:0 auto 10px}
.nk-plachta .nk{margin:0 6px; border-radius:var(--nk-r-sheet) var(--nk-r-sheet) var(--nk-r) var(--nk-r); background:var(--nk-sheet-bg)}
.nk-plachta .nk__zavriet{all:unset; cursor:pointer; position:absolute; right:14px; top:14px; width:36px; height:36px; display:grid; place-items:center; border-radius:50%; color:var(--nk-muted); border:1px solid var(--nk-line)}

@media (prefers-reduced-motion:reduce){ .nk *, .nk-lista, .nk-plachta *{transition:none!important} }

/* ===== TÉMY ===== */
.znacka-63{
  --nk-gold:var(--gold,#e6b648); --nk-gold-2:var(--gold-bright,#f1cf7c); --nk-ink:#0a0d12;
  --nk-gold-soft:rgba(230,182,72,.10); --nk-gold-tich:rgba(230,182,72,.28); --nk-gold-glow:rgba(230,182,72,.45); --nk-glow:rgba(230,182,72,.10);
  --nk-text:var(--text-bright,#f2f3f5); --nk-muted:var(--muted,#8b93a3); --nk-line:var(--line,#232a3a); --nk-line-strong:var(--line-strong,#2f3850);
  --nk-panel:linear-gradient(180deg,rgba(19,24,41,.92),rgba(10,13,18,.96)); --nk-field:rgba(255,255,255,.025); --nk-field-focus:rgba(230,182,72,.04);
  --nk-head:var(--font-display); --nk-mono:var(--font-mono); --nk-body:var(--font-sans);
  --nk-r:4px; --nk-r-field:2px; --nk-r-btn:2px; --nk-r-icon:2px; --nk-r-check:2px; --nk-r-bar:6px; --nk-r-sheet:14px;
  --nk-ok:#7fd1a3; --nk-ok-soft:rgba(127,209,163,.10); --nk-chyba:#e0705f;
  --nk-bar-bg:rgba(10,13,18,.86); --nk-sheet-bg:#0e131c; --nk-photo-bg:#131829;
}
.znacka-53{
  --nk-gold:var(--zlato,#E2B44E); --nk-gold-2:var(--zlato-2,#F6D07C); --nk-ink:#0B1530;
  --nk-gold-soft:rgba(226,180,78,.10); --nk-gold-tich:rgba(226,180,78,.28); --nk-gold-glow:rgba(226,180,78,.5); --nk-glow:rgba(226,180,78,.12);
  --nk-text:var(--text,#F1F5FF); --nk-muted:var(--tich,#8C9CC6); --nk-line:var(--linka,#1D3260); --nk-line-strong:var(--linka-ovl,#4468B8);
  --nk-panel:linear-gradient(180deg,rgba(19,42,96,.55),rgba(10,26,68,.38)); --nk-field:rgba(3,11,34,.55); --nk-field-focus:rgba(3,11,34,.75);
  --nk-head:var(--f-head); --nk-mono:var(--f-mono); --nk-body:var(--f-body);
  --nk-r:22px; --nk-r-field:12px; --nk-r-btn:999px; --nk-r-icon:12px; --nk-r-check:6px; --nk-r-bar:20px; --nk-r-sheet:26px;
  --nk-ok:#4CC38A; --nk-ok-soft:rgba(76,195,138,.12); --nk-chyba:var(--chyba,#E0705F);
  --nk-bar-bg:rgba(3,11,34,.82); --nk-sheet-bg:#0A1A44; --nk-photo-bg:#071436;
}
.znacka-53 .nk{--nk-gap-top:0}

/* pasca na boty: mimo obrazovky, nie display:none (niektoré boty také polia preskočia) */
.nk__past{position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden}

/* poradie na mobile (karta vs. ostatný obsah profilu) */
@media (max-width:900px){.znacka-63 .nk{order:0}}
@media (max-width:899px){.znacka-53 .nk{order:-1}}
