/* ------------------------------------------------------------------
   Home Energy — survey (vanilla, bez frameworku a bez CDN)
   Vše je pod #hes-root, aby se to nepralo s GHL CSS na stránce.

   VŠECHNY barvy, písmo i zaoblení jdou z proměnných, které nastavuje
   survey.js podle konfigurace KONKRÉTNÍ landing page (build.mjs → PAGES).
   Nic tu není natvrdo zelené ani natvrdo zaoblené — survey má vypadat
   jako část té stránky, na které stojí, ne jako vložený widget.

     --hes-accent      identita stránky: progress, vybraná karta, focus
     --hes-cta         akční barva: tlačítko „Pokračovat" / „Odeslat"
     --hes-text        barva textu (ink)
     --hes-muted       sekundární text
     --hes-line        linky a oddělovače (hlavička a patička modalu)
     --hes-track       kolejnice progressu a posuvníku
     --hes-border      rámečky ovládacích prvků a karet
     --hes-bg          podklad karet a polí
     --hes-font        písmo stránky
     --hes-radius-*    zaoblení (okno / karta / input / pill)
     --hes-shadow      stín okna

   Soubor má dvě části:
     • společné (progress, karty, posuvník, pole, patička) — platí vždy
     • na konci INLINE režim, ve kterém survey NENÍ karta ani okno,
       ale sekce stránky (viz jeho vlastní komentář). Tenhle režim
       používá všech 7 LP; modal zůstává jen jako podporovaná varianta
       enginu, aktuálně ho žádná stránka nezapíná.

   Dvě věci, které se tu řeší záměrně a ať se nerozbijí:
   1. NIC se nesmí ořezávat. `overflow:hidden` má jen okno modalu (jinak
      by obsah přelezl zaoblené rohy a neroloval uvnitř). Inline sekce
      `overflow` nemá vůbec — roste s obsahem.
   2. Číselník kraj/okres je mřížka karet (`[data-layout=grid]`), ne
      rozbalovací seznam. Ten se přesně o ten `overflow` ořezával.
   ------------------------------------------------------------------ */

#hes-root {
  --hes-accent: #18bd5b;
  --hes-accent-dark: #14a34e;
  --hes-accent-ring: rgba(24, 189, 91, 0.22);
  --hes-accent-soft: rgba(24, 189, 91, 0.08);
  --hes-accent-line: rgba(24, 189, 91, 0.28);
  --hes-cta: var(--hes-accent);
  --hes-cta-dark: var(--hes-accent-dark);
  /* barva textu na hlavním tlačítku — některé LP mají světlé CTA
     s tmavým popiskem (on-nzu03/04: oranžová pilulka, text #3a2600) */
  --hes-cta-text: #ffffff;
  --hes-text: #101828;
  --hes-muted: #667085;
  --hes-border: #d0d5dd;
  --hes-border-strong: #98a2b3;
  --hes-line: #eaecf0;
  /* kolejnice progressu a posuvníku — poloprůhledná, ať drží kontrast
     i když survey stojí přímo na barevném pásu stránky (inline sekce) */
  --hes-track: rgba(17, 24, 39, 0.11);
  --hes-bg: #ffffff;
  --hes-error: #d92d20;
  --hes-thumb: 30px;
  --hes-shadow: 0 32px 80px rgba(16, 24, 40, 0.34), 0 2px 8px rgba(16, 24, 40, 0.12);
  /* překryv stránky pod modalem — LP si ho může přebarvit do svého tónu */
  --hes-overlay: rgba(16, 24, 40, 0.58);

  /* --- tvarosloví (přebíjí konfigurace stránky nebo vzhledová varianta) --- */
  --hes-font: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  --hes-radius-modal: 18px;   /* okno modalu / inline karta */
  --hes-radius-card: 12px;    /* karty, souhlas, intro */
  --hes-radius-input: 10px;   /* inputy, křížek */
  --hes-radius-button: var(--hes-radius-input); /* tlačítka (jinde pilulky) */
  --hes-radius-pill: 99px;    /* progress bar, kolejnice posuvníku */

  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 24px;
  font-family: var(--hes-font);
  -webkit-font-smoothing: antialiased;
}

#hes-root[hidden] { display: none !important; }

#hes-root *,
#hes-root *::before,
#hes-root *::after { box-sizing: border-box; }

/* ---------- rozostřené pozadí ---------- */

.hes-backdrop {
  position: absolute;
  inset: 0;
  background: var(--hes-overlay);
  animation: hes-fade 0.18s ease-out;
}

/* kde backdrop-filter je, přidá se k barvě ještě rozostření stránky pod ním */
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .hes-backdrop {
    -webkit-backdrop-filter: blur(10px) saturate(115%);
    backdrop-filter: blur(10px) saturate(115%);
  }
}

.hes-modal {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 760px;
  max-height: 100%;
  background: var(--hes-bg);
  border-radius: var(--hes-radius-modal);
  box-shadow: var(--hes-shadow);
  /* modal: obsah roluje UVNITŘ okna (.hes-body), nesmí vylézt přes rohy */
  overflow: hidden;
  animation: hes-pop 0.2s ease-out;
}

@keyframes hes-fade { from { opacity: 0 } to { opacity: 1 } }
@keyframes hes-pop {
  from { opacity: 0; transform: translateY(12px) scale(0.985) }
  to   { opacity: 1; transform: none }
}

/* ---------- hlavička + progress ---------- */

.hes-head {
  flex: 0 0 auto;
  padding: 24px 68px 18px 36px;
  border-bottom: 1px solid var(--hes-line);
}

.hes-progress-track {
  height: 8px;
  border-radius: var(--hes-radius-pill);
  background: var(--hes-track);
  overflow: hidden;
}

.hes-progress-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: var(--hes-radius-pill);
  background: var(--hes-accent);
  transition: width 0.25s ease;
}

.hes-progress-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 10px 0 0;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--hes-muted);
  text-transform: uppercase;
}
.hes-progress-pct { color: var(--hes-accent); }

/* Kruh nezávisle na zaoblení stránky — křížek se má číst jako „zavřít"
   všude stejně a je to jediný ovládací prvek nad obsahem. */
.hes-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 44px;
  height: 44px;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: var(--hes-line);
  color: var(--hes-muted);
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.hes-close:hover { background: var(--hes-border); color: var(--hes-text); }
.hes-close:focus-visible { outline: 2px solid var(--hes-accent); outline-offset: 2px; }

/* ---------- tělo ---------- */

.hes-body {
  flex: 1 1 auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 32px 36px 34px;
}

/* poslední krok bez patičky (auto-posun) — ať tělo nekončí naostro */
.hes-modal:not(.hes-has-foot) .hes-body { padding-bottom: 30px; }

.hes-intro {
  margin: 0 0 22px;
  padding: 14px 18px;
  border-radius: var(--hes-radius-card);
  background: var(--hes-accent-soft);
  border: 1px solid var(--hes-accent-line);
  color: var(--hes-text);
  font-size: 15px;
  font-weight: 600;
  text-align: center;
  line-height: 1.45;
}

.hes-label {
  display: block;
  margin: 0 0 24px;
  font-size: 25px;
  font-weight: 700;
  line-height: 1.28;
  letter-spacing: -0.01em;
  color: var(--hes-text);
}

.hes-empty {
  margin: 0;
  padding: 18px 20px;
  border: 1px dashed var(--hes-border);
  border-radius: var(--hes-radius-card);
  color: var(--hes-muted);
  font-size: 15px;
  line-height: 1.5;
}

.hes-field + .hes-field { margin-top: 18px; }

.hes-sublabel {
  display: block;
  margin: 0 0 7px;
  font-size: 14px;
  font-weight: 600;
  color: var(--hes-text);
}

.hes-input,
.hes-textarea {
  display: block;
  width: 100%;
  min-height: 56px;
  margin: 0;
  padding: 16px 18px;
  font-family: inherit;
  font-size: 16px; /* 16px = iOS nezoomuje při focusu */
  line-height: 1.4;
  color: var(--hes-text);
  background: var(--hes-bg);
  border: 1px solid var(--hes-border);
  border-radius: var(--hes-radius-input);
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  -webkit-appearance: none;
  appearance: none;
}

.hes-textarea {
  min-height: 140px;
  resize: vertical;
}

.hes-input::placeholder,
.hes-textarea::placeholder { color: #98a2b3; opacity: 1; }

.hes-input:focus,
.hes-textarea:focus {
  outline: none;
  border-color: var(--hes-accent);
  box-shadow: 0 0 0 3px var(--hes-accent-ring);
}

.hes-field.is-invalid .hes-input,
.hes-field.is-invalid .hes-textarea { border-color: var(--hes-error); }

.hes-error-msg {
  display: none;
  margin: 8px 0 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--hes-error);
}
.hes-field.is-invalid .hes-error-msg { display: block; }

/* ---------- karty (výběr možnosti; klik = další krok) ----------
   data-layout:
     list — jeden sloupec (výchozí)
     pair — dvě možnosti vedle sebe
     grid — číselník (kraj/okres): 2 sloupce na PC, 1 na mobilu */

.hes-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.hes-cards[data-layout="pair"],
.hes-cards[data-layout="grid"] { grid-template-columns: 1fr 1fr; }
.hes-cards[data-layout="grid"] { gap: 10px; }

.hes-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 66px;
  padding: 16px 18px;
  margin: 0;
  border: 1px solid var(--hes-border);
  border-radius: var(--hes-radius-card);
  background: var(--hes-bg);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--hes-text);
  cursor: pointer;
  text-align: left;
  transition: border-color 0.15s ease, background 0.15s ease,
              box-shadow 0.15s ease, transform 0.12s ease;
}
.hes-card:hover {
  border-color: var(--hes-accent);
  background: var(--hes-accent-soft);
}

/* číselník má hodně položek — kompaktnější řádek, ať se vejde bez rolování */
.hes-cards[data-layout="grid"] .hes-card {
  min-height: 54px;
  gap: 11px;
  padding: 12px 14px;
  font-size: 15px;
  font-weight: 600;
}
.hes-cards[data-layout="grid"] .hes-card-mark { width: 20px; height: 20px; }
.hes-cards[data-layout="grid"] .hes-card.is-checked .hes-card-mark {
  box-shadow: inset 0 0 0 5px var(--hes-accent);
}

.hes-card input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: 0;
}

.hes-card-mark {
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  border: 2px solid var(--hes-border-strong);
  border-radius: 50%;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.hes-card.is-checked {
  border-color: var(--hes-accent);
  background: var(--hes-accent-soft);
  box-shadow: 0 0 0 1px var(--hes-accent) inset;
}
.hes-card.is-checked .hes-card-mark {
  border-color: var(--hes-accent);
  box-shadow: inset 0 0 0 6px var(--hes-accent);
}
/* krátký feedback, než engine přeskočí na další krok */
.hes-card.is-picking { transform: scale(0.985); }

.hes-card input:focus-visible + .hes-card-mark {
  outline: 2px solid var(--hes-accent);
  outline-offset: 3px;
}

/* ---------- posuvník (výběr >= 8 možností) ---------- */

.hes-slider { padding: 4px 0 2px; }

.hes-slider-value {
  margin: 0 0 18px;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  color: var(--hes-text);
  min-height: 34px;
}
.hes-slider.is-unset .hes-slider-value {
  font-size: 17px;
  font-weight: 600;
  color: var(--hes-muted);
  padding-top: 8px;
}

.hes-slider-wrap {
  position: relative;
  height: 48px;
  display: flex;
  align-items: center;
}

.hes-slider-rail {
  position: absolute;
  left: 0;
  right: 0;
  height: 8px;
  border-radius: var(--hes-radius-pill);
  background: var(--hes-track);
  pointer-events: none;
}

.hes-slider-fill {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  border-radius: var(--hes-radius-pill);
  background: var(--hes-accent);
}
.hes-slider.is-unset .hes-slider-fill { background: transparent; }

.hes-slider-tick {
  position: absolute;
  top: 50%;
  width: 3px;
  height: 3px;
  margin: -1.5px 0 0 -1.5px;
  border-radius: 50%;
  background: rgba(16, 24, 40, 0.22);
}

.hes-slider-input {
  position: relative;
  width: 100%;
  height: 48px;
  margin: 0;
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
}
.hes-slider-input:focus { outline: none; }

.hes-slider-input::-webkit-slider-runnable-track {
  height: 48px;
  background: transparent;
  border: 0;
}
.hes-slider-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: var(--hes-thumb);
  height: var(--hes-thumb);
  margin-top: calc((48px - var(--hes-thumb)) / 2);
  border-radius: 50%;
  background: #fff;
  border: 3px solid var(--hes-accent);
  box-shadow: 0 2px 6px rgba(16, 24, 40, 0.25);
  cursor: grab;
}
.hes-slider-input:focus-visible::-webkit-slider-thumb {
  box-shadow: 0 0 0 4px var(--hes-accent-ring);
}

.hes-slider-input::-moz-range-track {
  height: 48px;
  background: transparent;
  border: 0;
}
.hes-slider-input::-moz-range-thumb {
  width: var(--hes-thumb);
  height: var(--hes-thumb);
  box-sizing: border-box;
  border-radius: 50%;
  background: #fff;
  border: 3px solid var(--hes-accent);
  box-shadow: 0 2px 6px rgba(16, 24, 40, 0.25);
  cursor: grab;
}
.hes-slider-input:focus-visible::-moz-range-thumb {
  box-shadow: 0 0 0 4px var(--hes-accent-ring);
}

.hes-slider-ends {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-top: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--hes-muted);
}
.hes-slider-ends span:last-child { text-align: right; }

.hes-field.is-invalid .hes-slider-rail { box-shadow: 0 0 0 2px var(--hes-error); }

/* ---------- souhlas ---------- */

.hes-consent {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 22px 0 0;
  padding: 16px;
  border: 1px solid var(--hes-border);
  border-radius: var(--hes-radius-card);
  background: #fcfcfd;
  font-size: 14px;
  line-height: 1.5;
  color: #344054;
  cursor: pointer;
}
.hes-consent input {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  margin: 0;
  accent-color: var(--hes-accent);
  cursor: pointer;
}
.hes-consent a { color: var(--hes-accent-dark); text-decoration: underline; }
.hes-field.is-invalid .hes-consent { border-color: var(--hes-error); }

/* ---------- patička ---------- */

.hes-foot {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 20px 36px;
  border-top: 1px solid var(--hes-line);
  background: var(--hes-bg);
}
.hes-foot[hidden] { display: none; }

.hes-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 56px;
  padding: 15px 28px;
  margin: 0;
  font-family: inherit;
  /* 19px/700 je zároveň hranice „velkého textu" podle WCAG (18,66px bold):
     bílý popisek na značkové zelené #3C8C68 má kontrast 4,15:1 — na běžný
     text málo, na velký (3:1) dost. Menší písmo by tu bylo hůř čitelné. */
  font-size: 19px;
  font-weight: 700;
  line-height: 1.2;
  border: 1px solid transparent;
  border-radius: var(--hes-radius-button);
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s ease, border-color 0.15s ease, opacity 0.15s ease;
  -webkit-appearance: none;
  appearance: none;
}
.hes-btn:focus-visible { outline: 2px solid var(--hes-accent); outline-offset: 2px; }
.hes-btn[hidden] { display: none; }

.hes-btn-next {
  flex: 1 1 auto;
  background: var(--hes-cta);
  color: var(--hes-cta-text);
}
.hes-btn-next:hover { background: var(--hes-cta-dark); }
.hes-btn-next[disabled] { opacity: 0.65; cursor: progress; }

.hes-btn-back {
  flex: 0 0 auto;
  background: var(--hes-bg);
  border-color: var(--hes-border);
  color: #344054;
}
.hes-btn-back:hover { background: #f9fafb; border-color: var(--hes-border-strong); }
/* když „Pokračovat" není (výběrový krok), ať „Zpět" nevisí samo v rohu */
.hes-btn-next[hidden] + .hes-btn-back,
.hes-foot > .hes-btn-back:only-child { flex: 0 0 auto; }

/* barvu bere z textu tlačítka — funguje na bílém i tmavém popisku */
.hes-spinner {
  width: 17px;
  height: 17px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  opacity: 0.85;
  animation: hes-spin 0.7s linear infinite;
}
@keyframes hes-spin { to { transform: rotate(360deg) } }

/* ---------- chyba odeslání ---------- */

.hes-alert {
  margin: 0 0 18px;
  padding: 13px 15px;
  border: 1px solid #fda29b;
  border-radius: var(--hes-radius-input);
  background: #fef3f2;
  color: #912018;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
}
.hes-alert[hidden] { display: none; }

/* ---------- tablet ---------- */

@media (max-width: 900px) {
  .hes-head { padding: 20px 62px 15px 26px; }
  .hes-body { padding: 26px 26px 28px; }
  .hes-foot { padding: 16px 26px; }
  .hes-label { font-size: 23px; }
}

/* ---------- mobil ----------
   Modal: 95 % šířky, kolem prosvítá rozostřené pozadí.
   Inline: plná šířka placeholderu (viz blok „inline režim" níž).
   Číselník kraj/okres jde na 1 sloupec — dva sloupce by lámaly
   „Moravskoslezský kraj" na tři řádky. */

@media (max-width: 640px) {
  /* vodorovné odsazení dělá šířka modalu (95 %), ne padding — jinak
     by se obě hodnoty odečetly a modal by vyšel na ~89 % */
  #hes-root {
    padding: max(16px, env(safe-area-inset-top, 0px)) 0
             max(16px, env(safe-area-inset-bottom, 0px));
  }
  .hes-modal {
    width: 95%;
    max-width: 95%;
    max-height: 100%;
  }
  .hes-head { padding: 16px 56px 13px 18px; }
  .hes-body { padding: 22px 18px 24px; }
  .hes-label { font-size: 21px; margin-bottom: 18px; }
  .hes-progress-label { font-size: 12px; }
  .hes-foot {
    padding: 14px 18px;
    box-shadow: 0 -4px 16px rgba(16, 24, 40, 0.06);
  }
  .hes-cards[data-layout="grid"] { grid-template-columns: 1fr; gap: 8px; }
  .hes-cards[data-layout="grid"] .hes-card { min-height: 52px; font-size: 16px; }
  .hes-card { min-height: 62px; padding: 14px 16px; font-size: 16px; gap: 12px; }
  /* dotykové cíle: „Pokračovat" přes celou šířku, „Zpět" jen tak velké,
     aby se dalo pohodlně trefit, ale nekonkurovalo hlavní akci */
  .hes-btn { min-height: 54px; padding: 15px 20px; }
  .hes-btn-back { padding: 15px 16px; }
  .hes-slider-value { font-size: 22px; }
  .hes-slider-ends { font-size: 11px; }
}

/* velmi úzké displeje — dvousloupcové karty by se rozsypaly */
@media (max-width: 360px) {
  .hes-cards[data-layout="pair"] { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .hes-backdrop, .hes-modal { animation: none; }
  .hes-progress-fill { transition: none; }
  .hes-card { transition: none; }
}

/* ==================================================================
   Varianta „flat" — hranatý vzhled (theme: "flat")

   Web je postavený na Elementor tokenech původního WordPressu: Inter,
   tlačítka 13px BOLD VERZÁLKAMI bez zaoblení, hover = průhledné pozadí
   + černý text, karty s tenkým rámečkem rgba(0,0,0,.35), pole #C4C4C491.
   Zaoblený modal v Open Sans by na něm vypadal jako cizí produkt, proto
   se tady srovnává tvarosloví (viz worker/site/site.css, sekce tlačítka).

   Funnelů se to NETÝKÁ — bez třídy `hes-theme-flat` platí výchozí vzhled.
   Selektor `#hes-root.hes-theme-flat` (id + třída) přebije i deklarace
   z mediálních dotazů výš, na pořadí v souboru se tu nespoléhá.
   ================================================================== */

#hes-root.hes-theme-flat {
  --hes-font: 'Inter', 'Helvetica Neue', Helvetica, -apple-system, BlinkMacSystemFont,
              'Segoe UI', Roboto, Arial, sans-serif;
  --hes-radius-modal: 0px;
  --hes-radius-card: 0px;
  --hes-radius-input: 0px;
  --hes-radius-pill: 0px;
  /* rámeček karet = --line z site.css (#00000059 v Elementoru) */
  --hes-border: rgba(0, 0, 0, 0.35);
  --hes-border-strong: rgba(0, 0, 0, 0.55);
}

.hes-theme-flat .hes-modal {
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34), 0 2px 8px rgba(0, 0, 0, 0.14);
}

/* Nadpis otázky: web má nadpisy lehké (h2 = weight 200–300), ne tučné. */
.hes-theme-flat .hes-label {
  font-size: 26px;
  font-weight: 300;
  letter-spacing: -0.01em;
}

/* Pole formuláře jsou na webu plochá a se světlejším rámečkem než karty. */
.hes-theme-flat .hes-input,
.hes-theme-flat .hes-textarea {
  border-color: #c4c4c491;
  box-shadow: none;
}
.hes-theme-flat .hes-input:focus,
.hes-theme-flat .hes-textarea:focus {
  border-color: var(--hes-accent);
  box-shadow: 0 0 0 2px var(--hes-accent-ring);
}

/* Text možnosti je odpověď, ne nadpis — web nikde nemá 600 v běžném textu. */
.hes-theme-flat .hes-card { font-weight: 400; }

/* Velké červené číslo = stejný jazyk jako výsledek kalkulačky na úvodní stránce. */
.hes-theme-flat .hes-slider-value { color: var(--hes-accent); }
.hes-theme-flat .hes-slider.is-unset .hes-slider-value { color: var(--hes-muted); }

/* Tlačítka 1:1 podle .btn / .btn-lg v site.css (13px, bold, verzálky, hranatá). */
.hes-theme-flat .hes-btn {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.hes-theme-flat .hes-btn-next:hover {
  background: transparent;
  color: #000;
  border-color: #020101;
}

@media (max-width: 640px) {
  #hes-root.hes-theme-flat { --hes-radius-modal: 0px; }
  .hes-theme-flat .hes-label { font-size: 21px; }
}

/* ==================================================================
   Inline režim — survey je SEKCE STRÁNKY, ne vložený widget

   Zadání Jakuba (26. 8. 2026): žádné okno, žádný overlay, žádná
   ohraničená karta. Survey teče přímo v obsahu LP — nemá vlastní
   pozadí, rámeček, stín ani zaoblení, drží jen svislou rytmiku sekce
   a šířku sloupce, ve kterém stojí. Otázka je nadpisem té sekce.

   Vedlejší efekt, o který šlo hlavně: **není co ořezávat**. Sekce nemá
   `overflow`, neroluje sama v sobě a roste s obsahem — dřív se přesně
   o okraj té karty ořezával rozbalený seznam krajů.
   ================================================================== */

#hes-root.hes-inline {
  position: static;
  inset: auto;
  z-index: auto;
  display: block;
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
  /* svislý dech sekce; vodorovně nic — šířku dává sloupec stránky,
     ať survey lícuje s ostatním obsahem LP */
  padding: 18px 0 22px;
  scroll-margin-top: 28px;
}

.hes-inline .hes-modal {
  max-height: none;
  overflow: visible;
  animation: none;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.hes-inline .hes-head {
  padding: 0 0 26px;
  border-bottom: 0;
}
.hes-inline .hes-body { padding: 0; overflow: visible; }
.hes-inline .hes-modal:not(.hes-has-foot) .hes-body { padding-bottom: 0; }
.hes-inline .hes-foot {
  padding: 26px 0 0;
  border-top: 0;
  background: transparent;
  box-shadow: none;
}

/* otázka = nadpis sekce; v proudu stránky snese formát nadpisu, ne popisku */
.hes-inline .hes-label {
  font-size: 30px;
  margin-bottom: 26px;
}
.hes-inline .hes-intro { margin-bottom: 26px; }

@media (max-width: 900px) {
  .hes-inline .hes-label { font-size: 26px; }
}

@media (max-width: 640px) {
  #hes-root.hes-inline { max-width: none; }
  .hes-inline .hes-label { font-size: 22px; margin-bottom: 20px; }
  .hes-inline .hes-head { padding-bottom: 22px; }
  .hes-inline .hes-foot { padding-top: 22px; }
}