﻿/*  === ODRÁŽKY – SEZNAMY – FAQ  === */


/*  === Jednoduché odrážky === */

.pk-bullets--dot{
  --pk:#1aa3d9;
  --lh:1.65;          /* line-height */
  --dot:8px;          /* velikost tečky */
  --dot-offset:0px;   /* jemné doladění (např. 1px až 3px), když bude potřeba */
  list-style:none;
  margin:0;
  padding:0;
}


.pk-bullets--dot li{
  display:flex;
  align-items:flex-start; /* kotva na začátek (1. řádek) */
  gap:10px;
  margin:10px 0;
  line-height:var(--lh);
}


.pk-bullets--dot li::before{
  content:"";
  width:var(--dot);
  height:var(--dot);
  border-radius:50%;
  background:var(--pk);
  flex:0 0 var(--dot);


  /* střed tečky přesně do středu 1. řádku */
  margin-top:calc((1em * var(--lh) - var(--dot)) / 2 + var(--dot-offset));
}





/*  === Box s fajfkami === */


.bullets-box{padding:16px 18px;margin:18px 0;background:#fbfdff;border:1px solid #e6f2f8;border-left:4px solid #1aa3d9;border-radius:14px}




/* ZÁKLAD seznam (default = 1 sloupec) */
.bullets-box ul{list-style:none;margin:0;padding:0}
.bullets-box li{position:relative;padding-left:34px;line-height:1.6;margin:10px 0}




/* Kolečko – zarovnání na střed textu (1. řádku) */
.bullets-box li:before{
  content:"";
  position:absolute;
  left:0;
  top:0.8em;
  transform:translateY(-50%);
  width:22px;
  height:22px;
  border-radius:50%;
  background:#e6f6ff;
  border:1px solid #9fd6f0;
}




/* Fajfka – také na stejný vertikální střed */
.bullets-box li:after{
  content:"";
  position:absolute;
  left:7px;
  top:0.8em;
  transform:translateY(-60%) rotate(-45deg);
  width:9px;
  height:5px;
  border-left:3px solid #1aa3d9;
  border-bottom:3px solid #1aa3d9;
}




/* MODIFIKÁTOR: 2 sloupce */
.bullets-box.is-2cols ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px;row-gap:10px}
.bullets-box.is-2cols li{margin:0}
.bullets-box.is-2cols li:nth-child(even)::after{
  left:6px; 
}


@media(max-width:640px){.bullets-box.is-2cols ul{grid-template-columns:1fr}}






/*  === FAQ === */


.faq{padding:16px 18px;margin:18px 0;background:#fbfdff;border:1px solid #e6f2f8;border-left:4px solid #1aa3d9;border-radius:14px}
.faq details+details{border-top:1px solid #e6f2f8}
.faq details{padding:12px 0}
.faq details:first-child{padding-top:0}
.faq details:last-child{padding-bottom:0}




.faq summary{cursor:pointer;font-weight:700;line-height:1.45;list-style:none;position:relative;padding-left:34px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:50%;background:#e6f6ff;border:1px solid #9fd6f0}




/* mínus (open), plus (closed) – bez závislosti na fontu */
.faq summary:after{content:"";position:absolute;left:11px;top:50%;transform:translate(-50%,-50%);width:10px;height:2px;background:#1aa3d9;border-radius:2px}
.faq details:not([open]) summary:after{width:10px;height:10px;background:
  linear-gradient(#1aa3d9,#1aa3d9) center/10px 2px no-repeat,
  linear-gradient(#1aa3d9,#1aa3d9) center/2px 10px no-repeat}




.faq .a{margin:8px 0 0;padding-left:34px;line-height:1.65;color:#334155}




/* === Průvodce krok za krokem (bloky pod sebou) === */




.pk-steps{
  /* BARVY Z PRIMAKOUPELNY */
  --brand:#0ea5e9;      /* primární (tlačítka/odkazy) */
  --brand2:#0b84c6;     /* tmavší hover/akcent */
  --t:#0f172a; --m:#475569; --b:#d7e7f5; --bg:#f7fbff;




  margin:22px 0;
  color:var(--t);
}




.pk-steps__title{
  margin:0 0 14px;
  font:800 1.9rem/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial;
  letter-spacing:-.01em;
}




.pk-steps__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:14px;
  grid-template-columns:1fr; /* VŽDY POD SEBOU */
}




.pk-step{
  position:relative;
  padding:12px 16px 12px;   
  border:1.5px dashed var(--b);
  border-radius:16px;
  background:var(--bg);
}




.pk-step__badge{
  position:absolute;
  left:24px;               /* místo středu -> víc e-shopový layout */
  top:-6px;
  width:40px;
  height:40px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:var(--brand);
  color:#fff;
  font-weight:900;
  border:4px solid #fff;
  box-shadow:0 8px 18px rgba(15,23,42,.12);
}




.pk-step__head{
  margin:0 0 4px;       /* odsazení od badge */
  padding-left:60px;       /* aby text začínal vedle čísla */
  font:900 1.6rem/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial;
  letter-spacing:-.01em;
}




.pk-step__text{
  margin:0;
  padding-left:60px;       /* srovnat s nadpisem */
  color:var(--m);
  line-height:1.5;
}
.pk-step{position:relative}




.pk-step:not(:last-child)::after{
  content:"";
  position:absolute;
  left:44px;              /* zarovnání na střed badge (viz níže) */
  top:34px;               /* začátek linky pod badge */
  bottom:-14px;           /* protáhne se až k dalšímu kroku */
  width:2px;
  background:rgba(14,165,233,.35); /* použije brand dojem */
  border-radius:2px;
}