/* Fazonetka - stranka "Jak vytisknout a slepit PDF strih" - v2
   Novy vzhled ve stylu mobilni homepage (Raleway cerne nadpisy, Roboto text,
   zaobleni 6 px, mezery 6 px mezi bloky a 43 px mezi sekcemi, svetle modra =
   navody/informace, zelena = cast 2 a "hotovo", oranzova jen v detailech ikon).
   HTML stranky zustava beze zmeny, meni se jen tento soubor (nahrazuje v1). */

.fzt-guide {
  --fzt-ink: #000;
  --fzt-text: #1f1f1f;
  --fzt-blue: #2274A5;
  --fzt-blue-soft: #E7F5FD;
  --fzt-blue-card: rgba(164, 219, 232, .45);
  --fzt-green: #3E8E1E;
  --fzt-green-soft: #F0F7E6;
  --fzt-green-card: #DCEBC6;
  --fzt-pink: #FDE6DC;
  --fzt-radius: 6px;
  --fzt-gap: 6px;
  --fzt-sec: 43px;
  font-family: 'Roboto', sans-serif;
  color: var(--fzt-text);
  font-size: 17px;
  line-height: 1.55;
}
.fzt-guide, .fzt-guide *, .fzt-guide *::before, .fzt-guide *::after { box-sizing: border-box; }
.fzt-guide h1, .fzt-guide h2, .fzt-guide h3, .fzt-guide .fzt-section-title,
.fzt-guide .fzt-section-label, .fzt-guide .fzt-divider, .fzt-guide .fzt-step-number {
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  font-variant-numeric: lining-nums;
  font-feature-settings: "lnum" 1;
  color: var(--fzt-ink);
}

/* ---- uvod ---- */
.fzt-guide h1 {
  font-weight: 700;
  font-size: 34px;
  line-height: 1.2;
  text-align: center;
  margin: 10px 0 18px;
}
.fzt-guide .fzt-intro { max-width: 780px; margin: 0 auto; text-align: center; }
.fzt-guide .fzt-intro p { font-size: 17px; line-height: 1.55; margin: 0 0 12px; }
.fzt-guide .fzt-flow-img { display: block; width: 100%; max-width: 1100px; margin: 26px auto var(--fzt-sec); border-radius: var(--fzt-radius); }
.fzt-guide .fzt-flow-img-mobile { display: none; }

/* sirka na pocitaci stejna jako na homepage: bez bocniho odsazeni hlavniho sloupce */
@media (min-width: 768px) {
  body.in-jak-vytisknout-a-slepit-pdf-strih- main#content { padding-left: 0; padding-right: 0; }
}

/* ---- nadpisy casti ---- */
.fzt-guide .fzt-section-label {
  display: table;
  margin: var(--fzt-sec) auto 10px;
  padding: 7px 12px;
  background: var(--fzt-blue);
  color: #fff;
  border-radius: var(--fzt-radius);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.fzt-guide .fzt-divider ~ .fzt-section-label { background: var(--fzt-green); }
.fzt-guide .fzt-section-title {
  text-align: center;
  font-size: 25px;
  font-weight: 700;
  line-height: 1.25;
  margin: 0 0 18px;
}

/* ---- kroky ---- */
.fzt-guide .fzt-step,
.fzt-guide .fzt-step.fzt-blue,
.fzt-guide .fzt-step.fzt-image-emphasis {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: 34px;
  align-items: center;
  margin: 0 0 var(--fzt-gap);
  padding: 26px 30px;
  background: var(--fzt-blue-soft);
  border: 0;
  border-radius: var(--fzt-radius);
  box-shadow: none;
}
.fzt-guide .fzt-divider ~ .fzt-step { background: var(--fzt-green-soft); }
.fzt-guide .fzt-step-text { display: block; }
.fzt-guide .fzt-step-text .fzt-step-copy { display: block; }
.fzt-guide .fzt-step-number,
.fzt-guide .fzt-step-number.fzt-green {
  float: left;
  width: 40px;
  height: 40px;
  margin: 0 12px 10px 0;
  border-radius: 50%;
  background: var(--fzt-blue);
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  line-height: 40px;
  text-align: center;
}
.fzt-guide .fzt-divider ~ .fzt-step .fzt-step-number { background: var(--fzt-green); color: #fff; }
.fzt-guide .fzt-step h2 {
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 40px;
  color: var(--fzt-ink);
  margin: 0 0 10px;
}
.fzt-guide .fzt-step p { margin: 0 0 10px; clear: both; }
.fzt-guide .fzt-step h2 + p { clear: both; }

/* ---- obrazky ---- */
.fzt-guide .fzt-visual-col { text-align: center; position: relative; }
.fzt-guide .fzt-step-img,
.fzt-guide .fzt-step1-img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 400px;
  height: auto;
  margin: 0 auto;
  border-radius: var(--fzt-radius);
  box-shadow: none;
}
.fzt-guide .fzt-step-img-70 { width: auto; }
.fzt-guide .fzt-visual-pair { display: grid; grid-template-columns: 1fr 1fr; gap: var(--fzt-gap); }
.fzt-guide .fzt-visual-pair .fzt-step-img { width: 100% !important; height: 100%; max-height: none; object-fit: cover; }
.fzt-guide .fzt-note {
  margin: 10px 0 0;
  font-family: 'Segoe Print', 'Bradley Hand', 'Caveat', cursive;
  font-size: 19px;
  line-height: 1.2;
  color: #2a6f7c;
  text-align: center;
  transform: none;
}
.fzt-guide .fzt-step1-note { min-height: 0; }

/* sipka na kontrolni ctverecek misto pracovniho textu (krok 2) */
.fzt-guide .fzt-visual-col:has(> .fzt-step-img-note) { width: fit-content; max-width: 100%; justify-self: center; margin: 0 auto; }
.fzt-guide .fzt-visual-col:has(> .fzt-step-img-note) .fzt-step-img { max-width: none; width: auto !important; height: 400px; }
.fzt-guide .fzt-step-img-note {
  position: absolute;
  left: 21%;
  bottom: 6.5%;
  width: 19%;
  aspect-ratio: 3 / 2;
  margin: 0;
  font-size: 0;
  line-height: 0;
  color: transparent;
  transform: rotate(190deg) scaleX(-1);
  pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80' fill='none' stroke='%23F68E5F' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M112 8C80 8 40 14 24 60'/%3E%3Cpath d='M10 44l13 18 18-11'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---- karty formatu A4 / A0 / A4 s prida vky (krok 1) ---- */
.fzt-guide .fzt-info-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--fzt-gap); margin: 12px 0; }
.fzt-guide .fzt-info-card { background: var(--fzt-blue-card); border-radius: var(--fzt-radius); padding: 12px 12px 14px; font-size: 15px; line-height: 1.45; }
.fzt-guide .fzt-info-card h3 { font-family: 'Roboto', sans-serif; font-size: 20px; font-weight: 700; line-height: 1.1; color: var(--fzt-ink); margin: 0 0 6px; }
.fzt-guide .fzt-info-card p { font-size: 15px; line-height: 1.45; margin: 0; }

/* ---- TIP ---- */
.fzt-guide .fzt-tip {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-top: var(--fzt-gap);
  padding: 12px 14px;
  background: var(--fzt-blue-card);
  border: 0;
  border-radius: var(--fzt-radius);
  font-size: 15.5px;
  line-height: 1.45;
}
.fzt-guide .fzt-tip p { margin: 0; }
.fzt-guide .fzt-tip .fzt-icon {
  flex: none;
  width: 30px;
  height: 30px;
  font-size: 0;
  line-height: 0;
  color: transparent;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 21c-2.5-1.7-4-4-4-7a9 9 0 0118 0c0 3-1.5 5.3-4 7v2.5h-10z'/%3E%3Cpath d='M12.5 27.5h7'/%3E%3Cpath d='M16 1.5v2M3.5 6l1.5 1.3M28.5 6L27 7.3' stroke='%23F68E5F' stroke-width='2.6'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---- kontrolni seznam (krok 3, 8) ---- */
.fzt-guide .fzt-checklist { display: grid; gap: var(--fzt-gap); margin: 12px 0; }
.fzt-guide .fzt-ok, .fzt-guide .fzt-no {
  padding: 9px 12px;
  border-radius: var(--fzt-radius);
  background: #fff;
  color: var(--fzt-text);
  font-weight: 500;
}
.fzt-guide .fzt-no { background: var(--fzt-pink); }
.fzt-guide .fzt-ok::first-letter { color: #2E7D32; font-weight: 900; }
.fzt-guide .fzt-no::first-letter { color: #C62828; font-weight: 900; }

/* ---- SEDI / NESEDI (krok 4) ---- */
.fzt-guide .fzt-two-opt { display: grid; grid-template-columns: 1fr 1fr; gap: var(--fzt-gap); margin-top: 12px; }
.fzt-guide .fzt-opt-box { padding: 12px 14px; border-radius: var(--fzt-radius); border: 0; font-size: 15px; line-height: 1.45; }
.fzt-guide .fzt-opt-box b { display: block; margin-bottom: 4px; font-family: 'Raleway', sans-serif; font-size: 16px; font-weight: 700; color: var(--fzt-ink); }
.fzt-guide .fzt-opt-box.fzt-good { background: var(--fzt-green-card); }
.fzt-guide .fzt-opt-box.fzt-bad { background: var(--fzt-pink); }

/* ---- predel mezi castmi ---- */
.fzt-guide .fzt-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: var(--fzt-sec) 0 0;
  padding: 16px 20px;
  background: var(--fzt-green-card);
  border: 0;
  border-radius: var(--fzt-radius);
  color: var(--fzt-ink);
  font-size: 19px;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}
.fzt-guide .fzt-divider::before {
  content: "";
  flex: none;
  width: 22px;
  height: 22px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M7.5 12.5l3 3 6-7' stroke='%232E7D32' stroke-width='3'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---- hotovo ---- */
.fzt-guide .fzt-done-box {
  position: relative;
  margin: var(--fzt-sec) 0 0;
  padding: 22px 26px 22px 100px;
  min-height: 100px;
  background: var(--fzt-green-card);
  border: 0;
  border-radius: var(--fzt-radius);
  color: var(--fzt-text);
  font-size: 17px;
  line-height: 1.55;
}
.fzt-guide .fzt-done-box b {
  display: block;
  margin-bottom: 4px;
  font-family: 'Raleway', sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--fzt-ink);
}
.fzt-guide .fzt-done-box::before {
  content: "";
  position: absolute;
  left: 26px;
  top: 50%;
  width: 56px;
  height: 56px;
  margin-top: -28px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='32' cy='34' r='20'/%3E%3Cpath d='M22 35l7 7 14-15'/%3E%3Cpath d='M8 12l5 4M32 3v7M56 12l-5 4' stroke='%23F68E5F' stroke-width='4'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---- caste otazky ---- */
.fzt-guide .fzt-faq { margin: var(--fzt-sec) 0 0; padding: 26px 30px; background: var(--fzt-blue-soft); border: 0; border-radius: var(--fzt-radius); }
.fzt-guide .fzt-faq-title { font-family: 'Raleway', sans-serif; font-size: 25px; font-weight: 700; color: var(--fzt-ink); text-align: center; margin: 0 0 16px; }
.fzt-guide .fzt-faq-list { display: block; }
.fzt-guide .fzt-faq-item { margin: 0 0 var(--fzt-gap); background: #fff; border: 0; border-radius: var(--fzt-radius); box-shadow: none; }
.fzt-guide .fzt-faq-item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  list-style: none;
  cursor: pointer;
  font-family: 'Raleway', sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--fzt-ink);
}
.fzt-guide .fzt-faq-item summary::-webkit-details-marker { display: none; }
.fzt-guide .fzt-faq-item .fzt-arrow {
  flex: none;
  width: 9px;
  height: 9px;
  margin: -4px 4px 0 0;
  border-right: 2.5px solid var(--fzt-ink);
  border-bottom: 2.5px solid var(--fzt-ink);
  transform: rotate(45deg);
  transition: transform .15s;
}
.fzt-guide .fzt-faq-item[open] .fzt-arrow { margin-top: 4px; transform: rotate(-135deg); }
.fzt-guide .fzt-faq-answer { padding: 0 16px 16px; font-size: 16px; line-height: 1.55; }

/* ---- tablet a mobil ---- */
@media (max-width: 900px) {
  .fzt-guide .fzt-step,
  .fzt-guide .fzt-step.fzt-blue,
  .fzt-guide .fzt-step.fzt-image-emphasis { grid-template-columns: 1fr !important; gap: 14px; }
  .fzt-guide .fzt-visual-pair { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .fzt-guide { font-size: 16px; line-height: 1.5; }
  .fzt-guide h1 { font-size: 26px; }
  .fzt-guide .fzt-intro p { font-size: 16px; line-height: 23px; }
  .fzt-guide .fzt-flow-img { display: none !important; }
  .fzt-guide .fzt-flow-img-mobile { display: block; width: 100%; max-width: 480px; margin: 20px auto var(--fzt-sec); border-radius: var(--fzt-radius); }
  .fzt-guide .fzt-note:not(.fzt-step-img-note) { display: none; }
  .fzt-guide .fzt-section-title { font-size: 19px; }
  .fzt-guide .fzt-step, .fzt-guide .fzt-step.fzt-blue, .fzt-guide .fzt-step.fzt-image-emphasis { padding: 14px; }
  .fzt-guide .fzt-step-number, .fzt-guide .fzt-step-number.fzt-green { width: 34px; height: 34px; font-size: 17px; line-height: 34px; margin-right: 10px; }
  .fzt-guide .fzt-step h2 { font-size: 18px; line-height: 34px; }
  .fzt-guide .fzt-step-img, .fzt-guide .fzt-step1-img { width: 100% !important; max-height: none; }
  .fzt-guide .fzt-visual-col:has(> .fzt-step-img-note) { width: 100%; }
  .fzt-guide .fzt-visual-col:has(> .fzt-step-img-note) .fzt-step-img { width: 100% !important; height: auto; }
  .fzt-guide .fzt-info-cards, .fzt-guide .fzt-two-opt { grid-template-columns: 1fr; }
  .fzt-guide .fzt-note { font-size: 20px; }
  .fzt-guide .fzt-divider { font-size: 17px; padding: 14px; }
  .fzt-guide .fzt-done-box { padding: 84px 14px 18px; text-align: center; font-size: 16px; }
  .fzt-guide .fzt-done-box::before { left: 50%; top: 18px; margin: 0 0 0 -28px; }
  .fzt-guide .fzt-done-box b { font-size: 20px; }
  .fzt-guide .fzt-faq { padding: 14px; }
  .fzt-guide .fzt-faq-item summary { font-size: 15px; padding: 12px; }
  .fzt-guide .fzt-faq-answer { font-size: 15px; }
}