/* ==================================================================
   KONTAKT — stránka /kontakt (.kt)
   Nasazuje se NAD reseni-v2.css: <main class="rs2 kt">. Odtud bere
   barvy (--navy, --mint…), tlačítka (.btn, .gb), chipy „kdy volat"
   i .fc__field — tady je jen to, co je pro kontakt navíc.

   Skladba: nadpis, pod ním karta s jedním polem a jednou nepovinnou
   větou, pod kartou tři kroky „co bude dál". Pak kontaktní blok — formulář je doplněk telefonu
   a mailu, ne jejich náhrada, takže číslo nesmí skončit v patičce.
   ================================================================== */

/* ── HERO = nadpis, pod ním formulář uprostřed ─────────────── */
.kt .kt-hero { background:var(--mint-tint); text-align:center; padding:clamp(2.2rem,5vw,3.6rem) 1.5rem clamp(2.2rem,4.5vw,3.2rem); }
.kt .kt-kicker { display:inline-block; font-size:.85rem; font-weight:700; color:var(--cendre-text); background:#fff; border-radius:999px; padding:.45rem 1.2rem; box-shadow:0 6px 18px -8px rgb(0 29 57 / .18); }
.kt .kt-hero h1 { font-size:clamp(2.1rem,5vw,3.9rem); font-weight:800; letter-spacing:-.04em; line-height:1.04; color:var(--navy); margin:1.25rem auto .85rem; max-width:20ch; text-wrap:balance; }
/* Podtah v nadpisu: ::after má z-index:-1, takže bez vlastního stacking
   contextu na .hl propadne za pozadí pruhu a není ho vidět. */
.kt .kt-hero h1 .hl { position:relative; z-index:0; white-space:nowrap; }
.kt .kt-hero h1 .hl::after { content:""; position:absolute; left:-.05em; right:-.05em; bottom:.08em; height:.32em; background:var(--turquoise); opacity:.35; z-index:-1; border-radius:.2em; }
.kt .kt-lead { color:var(--muted); font-size:clamp(1.02rem,1.6vw,1.16rem); max-width:50ch; margin:0 auto; }

/* ── „co bude dál" — časová osa pod kartou ──────────────────── */
/* Tři kroky nad sebou = seznam odrážek. Tři kroky na jedné lince
   s čísly na ní = pořadí, tedy slib, jak to půjde. Linka vede přes
   celou řadu (::before na <ol>), čísla ji přerušují svým pozadím.
   Čísla jsou dekorace, pořadí nese <ol> (aria-hidden v TSX). */
.kt .kt-next { margin:clamp(2.2rem,4.5vw,3.2rem) auto 0; max-width:900px; }
.kt .kt-next__k { font-family:"JetBrains Mono",monospace; font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--cendre-text); margin-bottom:1.3rem; }
.kt .kt-steps { position:relative; list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; text-align:left; }
.kt .kt-steps::before { content:""; position:absolute; top:1rem; left:calc(100% / 6); right:calc(100% / 6); height:2px; background:var(--beau); }
.kt .kt-steps li { position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; padding:0 .4rem; }
.kt .kt-steps b { position:relative; z-index:1; flex:none; width:2rem; height:2rem; border-radius:50%; display:grid; place-items:center; background:var(--navy); color:#fff; font-size:.85rem; font-weight:800; box-shadow:0 0 0 6px var(--mint-tint); }
.kt .kt-steps strong { display:block; margin-top:.95rem; font-size:1.02rem; font-weight:800; letter-spacing:-.02em; color:var(--navy); line-height:1.25; text-wrap:balance; }
.kt .kt-steps span { display:block; margin-top:.4rem; font-size:.92rem; line-height:1.5; color:var(--muted); max-width:28ch; text-wrap:pretty; }

/* ── karta s formulářem ─────────────────────────────────────── */
.kt .kt-card { position:relative; max-width:640px; margin:clamp(1.8rem,4vw,2.6rem) auto 0; text-align:left; background:#fff; border:1px solid var(--line); border-radius:clamp(1.1rem,2.2vw,1.6rem); padding:clamp(1.4rem,2.8vw,2rem); box-shadow:0 30px 62px -32px rgb(0 29 57 / .36); }
.kt .kt-card h2 { font-size:clamp(1.2rem,2vw,1.5rem); font-weight:800; letter-spacing:-.03em; color:var(--navy); line-height:1.2; text-wrap:balance; }
.kt .kt-card .kt-sub { margin-top:.5rem; color:var(--muted); font-size:.97rem; }

.kt .kt-form { margin-top:1.2rem; }
/* Popisek pole čitelně. Mono verzálky v 10 px jsou zdejší firemní styl,
   ale tady se má vyplňovat — a lékař to má přečíst na první pohled,
   ne luštit. Přebíjí to i .fc__field / legend z reseni-v2.css. */
.kt .kt-q,
.kt .fc__field > label,
.kt legend { display:block; font-family:inherit; font-size:.92rem; font-weight:700; letter-spacing:0; text-transform:none; color:var(--navy); }

/* jediné povinné políčko celé stránky */
.kt .kt-field .kt-row { margin-top:.55rem; }
.kt .kt-row { display:flex; gap:.55rem; align-items:center; background:#fff; border:1.5px solid var(--line); border-radius:999px; padding:.4rem .4rem .4rem 1.35rem; transition:border-color .15s, box-shadow .15s; }
.kt .kt-row:focus-within { border-color:var(--cendre); box-shadow:0 0 0 4px rgb(61 132 167 / .14); }
.kt .kt-row.is-bad { border-color:var(--danger); }
.kt .kt-row input { flex:1; min-width:0; font:inherit; font-size:1.02rem; border:0; outline:none; background:transparent; color:var(--ink); padding:.62rem 0; }
.kt .kt-row input::placeholder { color:var(--hint); }
.kt .kt-row input:disabled { color:var(--muted); -webkit-text-fill-color:var(--muted); opacity:1; }
.kt .kt-row .gb { flex:none; }

/* ── nepovinná věta pod kontaktem ───────────────────────────── */
.kt .kt-msg { margin-top:1.1rem; display:flex; flex-direction:column; gap:.4rem; }
.kt .kt-msg > label { font-size:.92rem; font-weight:700; color:var(--navy); }
.kt .kt-msg > label span { font-weight:500; color:var(--muted); margin-left:.35rem; }
.kt .kt-msg textarea { font:inherit; font-size:.96rem; line-height:1.5; padding:.65rem .85rem; min-height:3.9rem; resize:vertical; border:1.5px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); outline:none; transition:border-color .15s, box-shadow .15s; }
.kt .kt-msg textarea:focus { border-color:var(--cendre); box-shadow:0 0 0 3px rgb(61 132 167 / .12); }
.kt .kt-msg textarea::placeholder { color:var(--hint); }

/* ── drobný text pod formulářem ─────────────────────────────── */
.kt .kt-gdpr,
.kt .kt-fine { margin-top:1.1rem; font-size:.84rem; line-height:1.5; color:var(--muted); }
.kt .kt-gdpr a,
.kt .kt-fine a { color:var(--cendre-text); font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.kt .kt-fallback { margin-top:1.3rem; }

/* ── stav „hotovo" ──────────────────────────────────────────── */
.kt .kt-card--done { text-align:center; }
.kt .kt-tick { width:3.2rem; height:3.2rem; margin:0 auto 1rem; border-radius:50%; background:var(--mint); display:grid; place-items:center; color:var(--navy); font-size:1.35rem; font-weight:800; box-shadow:0 0 0 8px var(--mint-tint); animation:ktTick .45s cubic-bezier(.22,1.4,.4,1) both; }
.kt .kt-card--done h2, .kt .kt-card--done .kt-sub { animation:ktRise .5s .1s ease-out both; }
@keyframes ktTick { from { scale:.35; opacity:0; } to { scale:1; opacity:1; } }
@keyframes ktRise { from { opacity:0; translate:0 8px; } to { opacity:1; translate:0 0; } }

.kt .kt-after { margin-top:1.3rem; font-size:.9rem; line-height:1.55; color:var(--muted); }
.kt .kt-after a { color:var(--cendre-text); font-weight:600; text-decoration:none; border-bottom:1.5px solid var(--beau); }
.kt .kt-after a:hover { border-color:var(--cendre); }

/* ── přímé kontakty ─────────────────────────────────────────── */
/* NN/g: formulář smí být jen doplněk telefonu a mailu. Adresa a IČO
   nejsou dekorace — kontaktní stránka bez nich působí vyhýbavě. */
/* Rytmus pod hero: kontakty, loga i závěrečná řádka dostávají stejný,
   větší odstup (~4rem), aby to nebyly tři věci nalepené na sobě. */
.kt .kt-reach { width:min(1180px, calc(100% - 2.5rem)); margin:clamp(2.4rem,5vw,4rem) auto 0; }
.kt .logos { padding-top:clamp(2.4rem,5vw,4rem); padding-bottom:0; }
.kt .kt-reach__row { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
/* Ikona nahoře, text pod ní na střed — jediná sekce stránky, která byla
   zarovnaná vlevo, a vypadalo to jako chyba. */
.kt .kt-reach__row li { display:flex; flex-direction:column; align-items:center; text-align:center; gap:.75rem; background:#fff; border:1px solid var(--line); border-radius:16px; padding:1.3rem 1.2rem 1.25rem; }
.kt .kt-reach__row a { color:var(--navy); font-size:1.02rem; font-weight:700; letter-spacing:-.01em; text-decoration:none; overflow-wrap:anywhere; }
.kt .kt-reach__row a:hover { color:var(--cendre-text); text-decoration:underline; }
.kt .kt-reach__row b { display:block; color:var(--navy); font-size:1.02rem; letter-spacing:-.01em; }
.kt .kt-reach__row small { display:block; margin-top:.22rem; font-size:.82rem; line-height:1.45; color:var(--muted); text-wrap:balance; }
.kt .kt-way__ico { flex:none; width:2.3rem; height:2.3rem; border-radius:12px; display:grid; place-items:center; }
.kt .kt-way__ico svg { width:1.1rem; height:1.1rem; }
.kt .kt-way__ico--tel { background:var(--turquoise); color:var(--navy); }
.kt .kt-way__ico--mail { background:var(--cendre); color:#fff; }
.kt .kt-way__ico--pin { background:var(--beau); color:var(--navy); }

/* Kdo mluvit nechce, musí mít kam jít — ale jen jedna řádka, ne další sekce. */
.kt .kt-quiet { margin:clamp(2.4rem,5vw,4rem) auto clamp(2.4rem,5vw,4rem); max-width:56ch; padding-inline:1.5rem; text-align:center; font-size:.94rem; color:var(--muted); }
.kt .kt-quiet a { color:var(--cendre-text); font-weight:600; text-decoration:none; border-bottom:1.5px solid var(--beau); }
.kt .kt-quiet a:hover { border-color:var(--cendre); }

/* ── responsive ─────────────────────────────────────────────── */
@media (max-width:980px) {
  .kt .kt-reach__row { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  /* Na výšku: linka jde svisle vlevo, čísla na ní, text vpravo. */
  .kt .kt-next { max-width:34rem; }
  .kt .kt-next__k { text-align:left; }
  .kt .kt-steps { grid-template-columns:1fr; gap:1.4rem; }
  .kt .kt-steps::before { top:1rem; bottom:1rem; left:calc(1rem - 1px); right:auto; width:2px; height:auto; }
  .kt .kt-steps li { display:grid; grid-template-columns:2rem 1fr; column-gap:.9rem; align-items:start; text-align:left; padding:0; }
  .kt .kt-steps b { grid-row:1 / span 2; }
  .kt .kt-steps strong { margin-top:.3rem; }
  .kt .kt-steps span { max-width:none; }
}
@media (max-width:640px) {
  .kt .kt-hero { padding-top:1.8rem; }
  .kt .kt-hero h1 { font-size:clamp(1.85rem,7vw,2.4rem); }
  /* Tlačítko pod pole, ať se do řádku vejde celé číslo. */
  .kt .kt-row { flex-direction:column; align-items:stretch; border-radius:18px; padding:1rem; gap:.8rem; }
  .kt .kt-row input { padding:.6rem .8rem; border:1px solid var(--line); border-radius:12px; text-align:center; }
}
@media (prefers-reduced-motion:reduce) {
  .kt .kt-tick, .kt .kt-card--done h2, .kt .kt-card--done .kt-sub { animation:none; }
}