/* Ciper – obsahové stránky fázy 3: Kontakt, FAQ, Ako poslať vzorku, Recenzie.
   Mobil najprv, breakpoint @900px ako v ostatných CSS súboroch témy. */

.kontakt,
.faq,
.vzorka,
.recenzie { background: var(--biela); }

.kontakt h1,
.faq h1,
.vzorka h1,
.recenzie h1 { margin: 0 0 14px; }

/* ---------- Kontakt ---------- */
.kontakt__hore {
  padding-block: 28px 40px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.kontakt__perex { margin: 0; font-size: 17px; line-height: 1.55; color: var(--text2); max-width: 60ch; }
.kontakt__panel { width: 100%; }
.kontakt__zvoncky { display: flex; flex-direction: column; gap: 10px; }
.kontakt__zvoncky .menovka { min-height: 56px; }

.kontakt__odber { padding-block: 8px 40px; display: flex; flex-direction: column; gap: 14px; }
.kontakt__odber-mriezka { display: flex; flex-direction: column; gap: 16px; }
.kontakt__odber-text { display: flex; flex-direction: column; gap: 14px; }
.kontakt__adresa {
  display: flex;
  align-items: center;
  gap: 14px;
  color: var(--tmava);
  text-decoration: none;
}
.kontakt__adresa .ikona { color: var(--zelena-tmava); flex: 0 0 auto; }
.kontakt__adresa span { display: flex; flex-direction: column; }
.kontakt__adresa strong { font-size: 17px; }
.kontakt__adresa span span { font-size: 14px; color: var(--text2); }
.kontakt__adresa:hover { color: var(--zelena-tmava); }
.kontakt__odber-text p { margin: 0; font-size: 16px; line-height: 1.55; color: var(--text2); max-width: 62ch; }
.kontakt__odkaz {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  font-weight: 700;
}
.kontakt__odkaz .ikona { width: 18px; height: 18px; }

.kontakt__spodok { display: flex; flex-direction: column; }
.kontakt__firma { padding-block: 8px 48px; display: flex; flex-direction: column; gap: 14px; }
.kontakt__firma-mriezka { display: flex; flex-direction: column; gap: 16px; }
.kontakt__riadky,
.kontakt__banka { display: flex; flex-direction: column; gap: 0; }
.kontakt__riadok {
  padding: 12px 0;
  border-bottom: 1px solid var(--linka);
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  font-size: 15px;
}
.kontakt__riadok--blok { flex-direction: column; align-items: flex-start; gap: 2px; }
.kontakt__popis { color: var(--text2); }
.kontakt__banka .kontakt__riadok:last-of-type { border-bottom: 0; }
.kontakt__poznamka { margin: 12px 0 0; font-size: 14px; line-height: 1.5; color: var(--text2); }
.kontakt__banka { gap: 14px; }
.kontakt__banka .lcd { margin-top: 4px; }

@media (min-width: 900px) {
  .kontakt__hore { padding-block: 56px 48px; flex-direction: row; gap: 64px; align-items: center; justify-content: space-between; }
  .kontakt__uvod { flex: 1 1 0; max-width: 560px; }
  .kontakt__panel { flex: 0 0 440px; }
  /* Adresa a firemné údaje vedľa seba */
  .kontakt__spodok { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 64px; align-items: start; padding-block: 16px 72px; }
  .kontakt__odber,
  .kontakt__firma { padding-block: 0; }
  .kontakt__odber-text p { max-width: none; }
  .kontakt__firma-mriezka { flex-direction: column; }
}

/* ---------- FAQ ---------- */
.faq__uvod { padding-block: 28px 8px; }
.faq__perex { margin: 0; font-size: 17px; line-height: 1.55; color: var(--text2); }
.faq__skupina { padding-block: 24px 8px; }
.faq__skupina h2 { margin: 0 0 10px; font-size: 24px; }
.faq__zoznam .akordeon__obsah p { margin: 0 0 10px; }
.faq__zoznam .akordeon__obsah p:last-child { margin-bottom: 0; }
.faq__odkaz {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-weight: 700;
}
.faq__pomoc { padding-block: 32px 48px; }

@media (min-width: 900px) {
  .faq__uvod { padding-block: 56px 12px; max-width: calc(820px + 2 * var(--okraj-stranky)); }
  .faq__skupina { padding-block: 32px 12px; max-width: calc(820px + 2 * var(--okraj-stranky)); }
  .faq__pomoc { padding-block: 48px 64px; max-width: calc(820px + 2 * var(--okraj-stranky)); }
  .faq__uvod p { max-width: 62ch; }
}

/* ---------- Ako poslať vzorku ---------- */
.vzorka__uvod {
  padding-block: 28px 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.vzorka__uvod-text { display: flex; flex-direction: column; gap: 16px; }
.vzorka__perex { margin: 0; font-size: 17px; line-height: 1.55; color: var(--text2); max-width: 58ch; }
.vzorka__cta { max-width: 480px; }
.vzorka__kedy { display: flex; flex-direction: column; gap: 12px; }
.vzorka__kedy strong { font-size: 18px; }
.vzorka__kedy p { margin: 0; display: flex; align-items: flex-start; gap: 10px; font-size: 16px; line-height: 1.5; }
.vzorka__kedy p .ikona { flex: 0 0 22px; width: 22px; height: 22px; color: var(--zelena-tmava); margin-top: 1px; }
.vzorka__kedy hr { margin: 0; border: 0; border-top: 1px solid var(--linka); }
.vzorka__kedy-pod { font-size: 15px !important; color: var(--text2); }

.vzorka__kroky-sekcia { background: var(--podklad); padding: 32px 0; }
.vzorka__kroky-sekcia h2 { margin: 0 0 20px; }
.vzorka__kroky { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 12px; }

.vzorka__prepravcovia { padding-block: 32px; display: flex; flex-direction: column; gap: 8px; }
.vzorka__prepravcovia-perex { margin: 0 0 8px; font-size: 16px; line-height: 1.5; color: var(--text2); max-width: 62ch; }
.vzorka__karty { display: flex; flex-direction: column; gap: 16px; }
.vzorka__prepravca { display: flex; flex-direction: column; gap: 14px; }
.vzorka__prepravca-hlava { display: flex; align-items: center; gap: 14px; }
.vzorka__prepravca-hlava strong { display: block; font-size: 18px; }
.vzorka__prepravca-hlava span span { font-size: 14px; color: var(--text2); }
.logo-prepravcu--balikovo.logo-prepravcu { height: 26px; max-width: 96px; }
.logo-prepravcu--packeta.logo-prepravcu { height: 26px; max-width: 96px; }
.vzorka__cennik { width: 100%; border-collapse: collapse; font-size: 15px; }
.vzorka__cennik th { text-align: left; font-weight: 700; color: var(--text2); font-size: 13px; padding: 0 0 6px; border-bottom: 1px solid var(--linka); }
.vzorka__cennik td { padding: 8px 0; border-bottom: 1px solid var(--linka); }
.vzorka__cennik td:last-child { text-align: right; font-weight: 700; }
.vzorka__cennik tr:last-child td { border-bottom: 0; }
.vzorka__zadarmo { color: var(--zelena-tmava); }
.vzorka__odkaz { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 700; align-self: flex-start; }
.vzorka__odkaz .ikona { width: 18px; height: 18px; }

.vzorka__balik-sekcia { background: var(--podklad); padding: 32px 0; }
.vzorka__balik-mriezka { display: flex; flex-direction: column; gap: 20px; }
.vzorka__balik-mriezka h2 { margin: 0 0 12px; }
.vzorka__balik-mriezka p { font-size: 16px; line-height: 1.55; color: var(--text2); }
.vzorka__lehota { display: flex; flex-direction: column; gap: 8px; background: var(--biela); }
.vzorka__lehota strong { font-size: 28px; font-weight: 800; font-stretch: 125%; color: var(--zelena-tmava); }
.vzorka__lehota p { margin: 0; font-size: 15px; }

.vzorka__otazky { padding-block: 32px 48px; }
.vzorka__otazky h2 { margin: 0 0 12px; }
.vzorka__zoznam .akordeon__obsah p { margin: 0 0 10px; }
.vzorka__zoznam .akordeon__obsah p:last-child { margin-bottom: 0; }

@media (min-width: 900px) {
  .vzorka__uvod { padding-block: 56px 48px; flex-direction: row; align-items: flex-start; gap: 56px; }
  .vzorka__uvod-text { flex: 1 1 0; }
  .vzorka__kedy { flex: 0 0 420px; }
  .vzorka__kroky-sekcia { padding: 56px 0; }
  .vzorka__kroky { flex-direction: row; }
  .vzorka__kroky .klavesa { flex: 1 1 0; }
  .vzorka__prepravcovia { padding-block: 56px; }
  .vzorka__karty { flex-direction: row; }
  .vzorka__prepravca { flex: 1 1 0; }
  .vzorka__balik-sekcia { padding: 56px 0; }
  .vzorka__balik-mriezka { flex-direction: row; align-items: flex-start; }
  .vzorka__balik-mriezka > div:first-child { flex: 1 1 0; max-width: calc(640px + 2 * var(--okraj-stranky)); }
  .vzorka__lehota { flex: 0 0 340px; }
  .vzorka__otazky { padding-block: 56px 64px; max-width: calc(820px + 2 * var(--okraj-stranky)); }
}

/* ---------- Recenzie ---------- */
.recenzie__uvod { padding-block: 28px 32px; display: flex; flex-direction: column; gap: 24px; }
.recenzie__uvod-text { display: flex; flex-direction: column; gap: 12px; }
.recenzie__odkaz { margin: 0; display: inline-flex; align-items: center; gap: 4px; min-height: 48px; font-weight: 700; }
.recenzie__odkaz a { color: var(--zelena-tmava); }
.recenzie__odkaz .ikona { width: 18px; height: 18px; color: var(--zelena-tmava); }
.recenzie__panel { width: 100%; max-width: 440px; }
.recenzie__lcd { display: flex; flex-direction: column; gap: 6px; }
.recenzie__hviezdy { display: flex; gap: 4px; color: var(--led); }
.recenzie__lcd-text { font-size: 17px; }
.recenzie__zvoncky { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.recenzie__zvoncky .menovka { min-height: 56px; }
.recenzie__otazka { margin: 4px 0 0; font-size: 22px; }
.recenzie__perex { margin: 0; font-size: 16px; line-height: 1.55; color: var(--text2); max-width: 62ch; }
.recenzie__cta { max-width: 480px; margin-top: 6px; }

.recenzie__navody { padding-block: 32px 48px; display: grid; gap: 16px; }
.recenzie__navod { padding: 20px; display: flex; flex-direction: column; }
.recenzie__navod .btn { margin-top: auto; }
.recenzie__navod h2 { margin: 0 0 16px; font-size: 22px; }
.recenzie__kroky { margin: 0 0 20px; padding: 0; list-style: none; counter-reset: krok; display: flex; flex-direction: column; }
.recenzie__kroky li {
  counter-increment: krok;
  position: relative;
  display: block; /* flex by rozdelil text a odkaz do stĺpcov */
  min-height: 60px;
  padding: 12px 0 12px 50px;
  overflow-wrap: anywhere;
  border-bottom: 1px solid var(--linka);
  font-size: 16px;
  line-height: 1.5;
}
.recenzie__kroky li:first-child { border-top: 1px solid var(--linka); }
.recenzie__kroky li::before {
  content: counter(krok);
  position: absolute;
  left: 0;
  top: 12px;
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 2px solid var(--zelena);
  color: var(--zelena-tmava);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 15px;
}
.recenzie__navod-sekcia { background: var(--podklad); }


@media (min-width: 900px) {
  .recenzie__uvod { padding-block: 56px 56px; flex-direction: row; align-items: center; justify-content: space-between; gap: 64px; }
  .recenzie__uvod-text { flex: 1 1 0; max-width: 620px; }
  .recenzie__panel { flex: 0 0 420px; }
  .recenzie__otazka { font-size: 28px; }
  .recenzie__navody { padding-block: 56px 72px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: stretch; }
  .recenzie__navod { padding: 28px; }
  }
.kontakt__iban { text-align: right; overflow-wrap: anywhere; }