/* ══════════════════════════════════════════════════════════════════════════
   /web-na-miru-nebo-wordpress — styly JEN pro tuhle stránku ($extra_css).
   Srovnávací tabulka `.cmp` je SDÍLENÁ a bydlí v base.css — sem ji
   nekopírovat.
   ⚠️ Barvy VÝHRADNĚ z proměnných base.css.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Dvě karty: co je co ──────────────────────────────────────────────────
   Obě karty mají stejnou váhu. Naše je zvýrazněná rámečkem, ale text v té
   druhé není napsaný jako výsměch — férové srovnání je celý smysl stránky. */
.two{display:grid;gap:18px;grid-template-columns:1fr;align-items:start}
@media(min-width:820px){ .two{grid-template-columns:1fr 1fr;gap:22px} }
.two-card{background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius);padding:24px 22px}
.two-card--us{border-color:var(--orange);box-shadow:0 8px 26px rgba(239,96,29,.12)}
.two-lab{display:block;font-family:var(--font-head);font-weight:700;color:var(--navy);
  font-size:1.14rem;margin-bottom:.5em}
.two-card--us .two-lab{color:var(--orange-600)}
.two-card p{margin:0;color:var(--muted);font-size:.97rem;line-height:1.6}

/* ── Skryté položky u WordPressu ──────────────────────────────────────────
   Nikde se netvrdí, KOLIK která položka stojí — to nevíme a vymýšlet si to
   nebudeme. Říká se jen, že existují. */
.hidden-costs{list-style:none;margin:0;padding:0;display:grid;gap:0;grid-template-columns:1fr}
@media(min-width:820px){ .hidden-costs{grid-template-columns:1fr 1fr;column-gap:44px} }
.hidden-costs li{padding:16px 0 16px 34px;border-top:1px solid var(--border);position:relative}
.hidden-costs li:first-child{border-top:0}
@media(min-width:820px){ .hidden-costs li:nth-child(2){border-top:0} }
/* Kolečko s plusem: „tohle se k ceně ještě přičte". */
.hidden-costs li::before{content:"";position:absolute;left:0;top:19px;width:21px;height:21px;
  border-radius:50%;background:var(--navy-tint) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A2547' stroke-width='3' stroke-linecap='round'><path d='M12 5v14M5 12h14'/></svg>") center/12px no-repeat}
.hidden-costs b{display:block;font-family:var(--font-head);font-weight:600;color:var(--navy);
  font-size:1.04rem;margin-bottom:.2em}
.hidden-costs span{display:block;color:var(--muted);font-size:.95rem;line-height:1.55}
.hidden-costs-note{color:var(--muted);font-size:.96rem;line-height:1.6;margin:24px 0 0;
  padding-top:20px;border-top:1px solid var(--border)}
/* Druhý odstavec (naše cena, 23. 9. 2026) navazuje bez další čáry. */
.hidden-costs-note + .hidden-costs-note{margin-top:12px;padding-top:0;border-top:0}

/* ── Tmavý pruh „Na rovinu" ───────────────────────────────────────────────
   Základ je sdílený `.band` z base.css (na střed). Tady je obsahem seznam,
   a ten se na střed číst nedá — proto varianta zarovnaná doleva.
   ⚠️ Tahle sekce se nemá odstraňovat: je to jediné místo na stránce, kde
   mluvíme proti vlastnímu zájmu, a tím drží věrohodnost zbytku. */
.band--left{text-align:left;padding:34px 24px}
@media(min-width:700px){ .band--left{padding:40px 38px} }
.band--left .band-title{font-size:clamp(1.35rem,3.6vw,1.9rem);margin-bottom:.35em}
.band--left .band-sub{margin:0 0 22px;max-width:64ch}
.honest{position:relative;list-style:none;margin:0;padding:0;display:grid;gap:14px}
.honest li{position:relative;padding-left:30px;color:#c3cae0;font-size:.98rem;line-height:1.55}
.honest li b{color:#fff;font-weight:600}
/* Fajfka v oranžové — na tmavém podkladu je to jediná barva, která projde. */
.honest li::before{content:"";position:absolute;left:0;top:3px;width:18px;height:18px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23EF601D' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><path d='m5 12 5 5L20 7'/></svg>") center/contain no-repeat}
.honest-note{position:relative;color:#c3cae0;font-size:.96rem;line-height:1.6;
  margin:22px 0 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.16)}

/* ── Jak stavíme weby my ──────────────────────────────────────────────────
   Stejná sada fajfek jako .hero-checks, jen ve dvou sloupcích. */
.incl2{list-style:none;margin:0;padding:0;display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:760px){ .incl2{grid-template-columns:1fr 1fr;column-gap:34px} }
.incl2 li{position:relative;padding-left:32px;color:var(--muted);font-size:.97rem;line-height:1.55}
.incl2 li::before{content:"";position:absolute;left:0;top:1px;width:22px;height:22px;
  border-radius:50%;background:var(--orange-tint) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23EF601D' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><path d='m5 12 5 5L20 7'/></svg>") center/14px no-repeat}
.incl2 b{display:block;color:var(--navy);font-weight:600}
.incl2-more{color:var(--muted);font-size:.96rem;line-height:1.6;margin:24px 0 0;
  padding-top:20px;border-top:1px solid var(--border)}
.faq-more2{color:var(--muted);font-size:.95rem;margin:18px 0 0;text-align:center}