/* Digitalna Zimnica — lead-magnet.css: /prva-staklenka (izgled prema v5-redizajnu, 5. 11. 2026.) */

/* ── hero: lijevo tekst, desno staklenka + obrazac ── */
.hero{margin-top:20px;padding:clamp(40px,6vw,84px) clamp(24px,5vw,72px)}
.hero-in{display:flex;flex-wrap:wrap;align-items:center;gap:40px 56px}
.hero-copy{flex:999 1 440px;min-width:0}
.hero h1{margin:24px 0 0;font-size:clamp(2.2rem,5vw,4.2rem)}
.hero .lead{margin:24px 0 0;max-width:560px}
.hero-form{flex:1 1 380px;min-width:0;position:relative;text-align:center}
.hero-form:before{content:"";position:absolute;left:50%;top:-10px;width:300px;height:300px;margin-left:-150px;border-radius:50%;
  background:radial-gradient(circle,rgba(242,178,76,.4),rgba(242,178,76,0) 65%);pointer-events:none}
.bigjar{position:relative;width:110px;margin:0 auto -18px;filter:drop-shadow(0 20px 30px rgba(0,0,0,.35));z-index:1}
.bigjar .jar-num{font-size:10px}
.bigjar .lvl{transform:scaleY(0);animation:dz-fill 1.1s .35s cubic-bezier(.4,0,.2,1) forwards}
@keyframes dz-fill{to{transform:scaleY(1)}}
@media (prefers-reduced-motion:reduce){.bigjar .lvl{animation:none;transform:none}}

/* obrazac — staklena kartica */
.form-card{position:relative;max-width:520px;margin:0 auto;text-align:left;padding:30px 26px 24px;border-radius:26px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(20px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 30px 60px rgba(0,0,0,.25)}
.form-card label{display:block;font-weight:800;font-size:.95rem;margin-bottom:10px;color:#fff}
.form-card input{width:100%;min-height:56px;padding:0 20px;border-radius:999px;border:1px solid rgba(255,255,255,.3);
  background:var(--card);font-family:inherit;font-size:1rem;color:var(--ink)}
.form-card input:focus-visible{outline:3px solid var(--honey);outline-offset:2px}
.form-card .btn{margin-top:14px;padding:0 18px;letter-spacing:.02em}
.form-card small{display:block;margin-top:14px;font-size:.84rem;color:var(--on-dark-2);line-height:1.5;text-align:center}
.form-err{margin:0 0 12px;color:#FFD2C7;font-weight:800}
.form-card--sent p{display:flex;gap:12px;align-items:flex-start;margin:0;color:#fff;font-weight:800}
.form-card--sent .i{color:var(--honey);margin-top:2px}

/* ── 3 koraka ── */
.steps{display:grid;gap:22px;margin-top:56px;counter-reset:st}
@media(min-width:840px){.steps{grid-template-columns:repeat(3,1fr);gap:18px}}
.step{position:relative;padding:34px 28px 28px;border-radius:26px;background:var(--card);border:1px solid var(--card-line);box-shadow:var(--sh3)}
.step:before{counter-increment:st;content:counter(st);position:absolute;top:-18px;left:26px;width:44px;height:44px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;background:var(--honey);color:var(--d1);
  font-family:var(--font-serif);font-weight:700;font-size:1.2rem;box-shadow:0 8px 20px rgba(242,178,76,.35)}
.step h3{margin:8px 0 8px;color:var(--d1)}
.step p{margin:0;color:var(--ink3);font-size:.97rem}

/* ── semafor ── */
.lights{display:grid;gap:16px;margin-top:48px}
@media(min-width:760px){.lights{grid-template-columns:repeat(3,1fr)}}
.light{padding:26px;border-radius:22px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.light b{display:flex;align-items:center;gap:10px;font-family:var(--font-serif);font-weight:700;font-size:1.5rem;margin-bottom:8px;color:#fff}
.light .dot{width:14px;height:14px;border-radius:50%;flex:none}
.light--g .dot{background:var(--g);box-shadow:0 0 0 5px rgba(76,140,91,.3)}
.light--y .dot{background:var(--honey);box-shadow:0 0 0 5px rgba(242,178,76,.3)}
.light--r .dot{background:var(--w);box-shadow:0 0 0 5px rgba(196,85,58,.3)}
.light p{margin:0;font-size:.97rem;color:var(--on-dark-text)}

/* ── iskrenost + autor ── */
.honest{margin-top:40px}
.author{display:flex;gap:16px;align-items:center;justify-content:center;margin-top:30px;text-align:left}
.avatar{flex:none;width:60px;height:60px;border-radius:18px;background:var(--d1);color:var(--honey);
  display:flex;align-items:center;justify-content:center;font-family:var(--font-serif);font-weight:700;font-size:1.4rem}
.author b{display:block;color:var(--d1);font-weight:900}
.author span{font-size:.9rem;color:var(--ink-soft)}

/* ── završni CTA ── */
.final .form-card{margin-top:34px}
.sign{text-align:center;font-family:var(--font-serif);font-style:italic;font-weight:600;font-size:1.35rem;margin:34px 0 0;color:var(--honey-l)}

@media(max-width:760px){
  .hero{margin-top:12px;padding:40px 22px 34px}
  .form-card{padding:26px 18px 20px}
}