/*===== Hero =====*/
.jv-hero{padding:clamp(44px,6vw,80px) 0 clamp(26px,3.5vw,40px)}

/*===== Kdy a co s sebou =====*/
.jv-kdy{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:clamp(14px,1.8vw,20px);
  margin-top:clamp(24px,3vw,34px);
}
.jv-karta{
  background:var(--ls-karta);
  border:1px solid var(--ls-hranice);
  border-radius:20px;
  box-shadow:var(--ls-stin);
  padding:24px 22px;
}
.jv-karta .ls-eyebrow{margin-bottom:10px}
.jv-karta strong{
  display:block;
  font-family:'Newsreader',Georgia,serif;
  font-weight:600;font-size:26px;line-height:1.15;
  color:var(--ls-vino);
}
.jv-karta p{margin:8px 0 0;font-size:15px;line-height:1.6;color:var(--ls-inkoust-60)}

/*===== Sekce se střídavým pozadím =====*/
.jv-sekce{
  padding:clamp(44px,6vw,80px) 0;
  border-top:1px solid rgba(36,26,28,.07);
  scroll-margin-top:96px;
}
.jv-sekce.jv-plocha{background:var(--ls-plocha)}
.jv-sekce > .wrap > .ls-lede{margin-bottom:0}

/*===== Schéma hlasovacího lístku =====*/
.jv-listek{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:10px;
  margin-top:clamp(24px,3vw,32px);
}
.jv-sloupec{
  background:var(--ls-karta);
  border:1px solid var(--ls-hranice-2);
  border-radius:16px;
  padding:18px 16px 20px;
  text-align:center;
}
.jv-sloupec.jv-nase{
  background:var(--ls-panel);
  border:2px solid var(--ls-list);
  box-shadow:var(--ls-stin);
}

.jv-ramecek{
  display:flex;align-items:center;justify-content:center;
  width:34px;height:34px;margin:0 auto;
  border:2px solid var(--ls-hranice-2);
  border-radius:6px;
  font-size:21px;font-weight:700;line-height:1;
  color:transparent;
}
.jv-nase .jv-ramecek{border-color:var(--ls-vino);color:var(--ls-vino)}

.jv-cislo{
  display:block;margin-top:12px;
  font-family:'Newsreader',Georgia,serif;
  font-weight:600;font-size:22px;line-height:1;
  color:var(--ls-vino-slabe);
}
.jv-nase .jv-cislo{color:var(--ls-vino)}

.jv-nazev{
  display:block;margin-top:8px;
  font-size:14px;line-height:1.4;
  color:var(--ls-inkoust-60);
}
.jv-nase .jv-nazev{color:var(--ls-inkoust);font-weight:700}

.jv-popisek{
  margin:16px 0 0;
  font-size:13px;line-height:1.6;
  color:var(--ls-inkoust-45);
}

/*===== Tři způsoby =====*/
.jv-zpusoby{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:clamp(14px,1.8vw,20px);
  margin-top:clamp(24px,3vw,34px);
  counter-reset:zpusob;
}
.jv-zpusob{
  background:var(--ls-karta);
  border:1px solid var(--ls-hranice);
  border-radius:20px;
  box-shadow:var(--ls-stin);
  padding:26px 24px;
  counter-increment:zpusob;
}
.jv-zpusob::before{
  content:counter(zpusob);
  display:flex;align-items:center;justify-content:center;
  width:34px;height:34px;
  border-radius:999px;
  background:var(--ls-vino);color:var(--ls-na-vine);
  font-weight:700;font-size:15px;
}
.jv-zpusob h3{
  margin:16px 0 0;
  font-family:'Newsreader',Georgia,serif;
  font-weight:600;font-size:21px;line-height:1.2;
  color:var(--ls-vino);
}
.jv-zpusob p{margin:10px 0 0;font-size:15px;line-height:1.65;color:var(--ls-inkoust-60)}

/*===== Na co si dát pozor =====*/
.jv-pozor{list-style:none;display:grid;gap:12px;margin-top:clamp(22px,3vw,30px)}
.jv-pozor li{
  display:flex;gap:12px;align-items:flex-start;
  background:var(--ls-karta);
  border:1px solid var(--ls-hranice);
  border-left:4px solid var(--ls-vino);
  border-radius:14px;
  padding:16px 18px;
  font-size:15px;line-height:1.6;
  color:var(--ls-inkoust-70);
}
.jv-pozor strong{color:var(--ls-vino)}
.jv-zdroj{
  margin:clamp(20px,3vw,26px) 0 0;
  font-size:13px;line-height:1.6;
  color:var(--ls-inkoust-45);
}
.jv-zdroj a{color:var(--ls-vino);font-weight:600}

/*===== Křížek u upozornění =====*/
.jv-krizek{
  flex:none;
  display:flex;align-items:center;justify-content:center;
  width:22px;height:22px;margin-top:2px;
  border-radius:50%;
  background:var(--ls-vino);
  color:var(--ls-na-vine);
  font-size:11px;font-weight:700;line-height:1;
}

/*===== Náš sloupec: křížek se sám zaškrtne =====*/
.jv-nase .jv-ramecek{
  position:relative;
  animation:jvZaskrtnuti 5s ease-in-out infinite;
}
@keyframes jvZaskrtnuti{
  0%, 12%   {color:transparent;      transform:scale(1)}
  17%       {color:var(--ls-vino);   transform:scale(1.22)}
  23%, 88%  {color:var(--ls-vino);   transform:scale(1)}
  96%, 100% {color:transparent;      transform:scale(1)}
}
.jv-nase .jv-ramecek::after{
  content:'';
  position:absolute;
  inset:-7px;
  border:2px solid var(--ls-list);
  border-radius:10px;
  opacity:0;
  animation:jvVlna 5s ease-out infinite;
}
@keyframes jvVlna{
  0%, 12%   {opacity:0;   transform:scale(.75)}
  19%       {opacity:.6;  transform:scale(1)}
  40%, 100% {opacity:0;   transform:scale(1.4)}
}
@media (prefers-reduced-motion:reduce){
  .jv-nase .jv-ramecek{animation:none;color:var(--ls-vino)}
  .jv-nase .jv-ramecek::after{display:none}
}