/* ===========================================================================
   MUJVIT — sdílený CSS pro dotaznik.html + doporuceni.html
   Vít 8.6.2026: extrahováno z inline + pročištěno PurgeCSS (odebrán mrtvý landing/košík/
   staré loading varianty; 118 → ~68 KB). Záloha: pouzité/quiz-reco_PRED-purge_*.css
   =========================================================================== */
/* ===========================================================================
   MUJVIT — sdílený CSS pro dotaznik.html + doporuceni.html
   Vít 2026-06-08: vytaženo z inline \3c style> (bylo duplikované na obou stránkách,
   ~115-120 KB na každé). Teď se stáhne jednou a cachuje napříč quiz→výsledky.
   Zdroj = dotaznik \3c style> (ověřený superset: doporuceni nemá žádný selektor navíc).
   =========================================================================== */

:root {
  color-scheme: light;
  /* Mujvit Brand Guidelines, official colors (sjednoceno s Krev report) */
  --brand-primary: #289546;       /* Mujvit GREEN */
  --brand-primary-dark: #1f7037;
  --brand-primary-soft: #e8f3ec;
  --brand-red: #EE2E27;            /* Mujvit RED */
  --brand-violet: #9E0051;         /* Mujvit VIOLET */
  --brand-blue: #034EA2;           /* Mujvit BLUE */
  --brand-cyan: #00AAE5;           /* Mujvit CYAN */
  --brand-lime: #BDCF3C;           /* Mujvit LIME */
  --brand-yellow: #FFD800;         /* Mujvit YELLOW */
  --brand-orange: #F8961F;         /* Mujvit ORANGE (akcent pro Vít komentář) */
  --brand-gray: #E6E7E8;           /* Mujvit GRAY */
  --brand-cream: #FFF9F0;          /* Vít summary cream (z Krev) */
  --brand-bg: #FAFAFA;             /* Krev background */
  --brand-gray-1: #E5E7EB;
  --brand-gray-2: #c4c1b8;
  --brand-text: #1A2332;           /* mv-ink */
  --brand-text-soft: #6B6D70;      /* mv-gray-dark */
  --brand-text-medium: #4A5662;    /* mv-gray-medium */
  --brand-warm: #F8961F;
  --warning: #F8961F;
  --success: #289546;
  --shadow-card: 0 2px 12px rgba(0,0,0,0.06);
  --shadow-card-hover: 0 4px 20px rgba(0,0,0,0.1);
  --shadow-soft: 0 1px 3px rgba(0,0,0,0.04);
}
* {box-sizing: border-box; margin: 0; padding: 0;}
body {
  font-family: 'Poppins', sans-serif;
  background: var(--brand-cream);
  color: var(--brand-text);
  line-height: 1.6;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
::selection {background: var(--brand-primary-soft); color: var(--brand-primary-dark);}
/* Mobile-first container (80% users mobile) */
.container, .container-wide {
  width: 100%; margin: 0 auto; padding: 16px;
}
/* Vít 21.5.2026: jediný breakpoint 980px, mobil = full-width, desktop = max-width */
@media (min-width: 980px) {
  .container {max-width: 860px; padding: 32px 24px;}
  .container-wide {max-width: 980px; padding: 32px 24px;}
}

/* Progress */
.progress-bar {
  width: 100%; height: 6px; background: var(--brand-gray-1);
  border-radius: 4px; margin-bottom: 8px; overflow: hidden;
}
.progress-fill {
  height: 100%; background: var(--brand-primary);
  border-radius: 4px; transition: width 0.3s;
}
/* Stage indicator, mobile-first */
.stages {
  display: flex; gap: 4px; margin-bottom: 20px;
  font-size: 11px;
}
.stage-pill {
  flex: 1; text-align: center; padding: 8px 4px;
  border-radius: 100px; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  border: 1.5px solid var(--brand-gray-1); background: white;
  font-weight: 500; color: var(--brand-text-soft);
  display: flex; align-items: center; justify-content: center; gap: 4px;
  position: relative; min-height: 32px;
}
.stage-pill.active {
  background: var(--brand-primary); color: white;
  border-color: var(--brand-primary); font-weight: 700;
  box-shadow: 0 4px 14px rgba(40, 149, 70, 0.25);
}
.stage-pill.done {
  background: var(--brand-primary-soft); color: var(--brand-primary);
  border-color: var(--brand-primary-soft); font-weight: 600;
}
.stage-pill.done::before {
  content: "\2713\FE0E"; font-family: -apple-system, "system-ui", "Segoe UI", Roboto, sans-serif; font-weight: 700; margin-right: 2px;
}
@media (min-width: 600px) {
  .stages {gap: 8px; margin-bottom: 28px; font-size: 13px;}
  .stage-pill {padding: 10px 8px; min-height: 38px;}
  .stage-pill.active {transform: scale(1.04);}
}

/* Logo header, mobile-first */
.brand-header {
  padding: 12px 0 16px;
  margin-bottom: 4px;
}
.brand-header img {height: 36px; width: auto; display: block;}
@media (min-width: 600px) {
  .brand-header {padding: 16px 0 24px;}
  .brand-header img {height: 44px;}
}

/* Question card, mobile-first */
.question {
  background: white;
  border-radius: 14px;
  padding: 24px 20px;
  box-shadow: var(--shadow-card);
}
.question h2 {
  font-size: 22px; font-weight: 700;
  color: var(--brand-text);
  margin-bottom: 16px;
  line-height: 1.3;
  letter-spacing: -0.3px;
}
@media (min-width: 600px) {
  .question {padding: 32px 28px; border-radius: 16px;}
  .question h2 {font-size: 28px; margin-bottom: 20px;}
}
@media (min-width: 900px) {
  .question {padding: 40px 36px;}
  .question h2 {font-size: 32px;}
}
/* Vít 19.5.2026: Searchable checkbox (Q23 onemocnění), search input + scrollable list + "Jiné napište nám" */
.sc-wrap {display: flex; flex-direction: column; gap: 10px;}
.sc-input-row {position: relative;}
.sc-search-input {
  width: 100%; padding: 12px 16px 12px 42px;
  border: 1.5px solid var(--brand-gray-1); border-radius: 12px;
  font-size: 15px; font-family: inherit; background: #fafafa;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23289546' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='7'/><line x1='21' y1='21' x2='16.65' y2='16.65'/></svg>");
  background-repeat: no-repeat;
  background-position: 14px center;
  transition: all 0.15s;
}
.sc-search-input:focus {outline: none; border-color: var(--brand-primary); background-color: white; box-shadow: 0 0 0 3px var(--brand-primary-soft);}
.sc-selected-chips {
  display: flex; flex-wrap: wrap; gap: 6px;
  min-height: 4px;
}
.sc-selected-chips:not(:empty) {
  padding: 8px 10px;
  background: var(--brand-primary-soft);
  border-radius: 10px;
}
.sc-chip {
  display: inline-flex; align-items: center; gap: 6px;
  background: white; color: var(--brand-text);
  padding: 4px 6px 4px 10px; border-radius: 999px;
  font-size: 12.5px; font-weight: 600;
  border: 1px solid var(--brand-primary);
}
.sc-chip button {
  background: var(--brand-primary); color: white;
  border: none; border-radius: 50%;
  width: 18px; height: 18px;
  cursor: pointer; font-size: 12px; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: inherit;
}
.sc-list-wrap {
  border: 1.5px solid var(--brand-gray-1); border-radius: 12px;
  background: white;
  overflow: hidden;
}
.sc-list {
  max-height: min(48vh, 380px);  /* Vit 13.7.: vic videt, lepsi scroll */
  overflow-y: auto;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;  /* nescrolluje se pod tim cela stranka */
}
.sc-list::-webkit-scrollbar {width: 8px;}
.sc-list::-webkit-scrollbar-track {background: var(--brand-gray-1); border-radius: 4px;}
.sc-list::-webkit-scrollbar-thumb {background: var(--brand-primary); border-radius: 4px;}
.sc-item {
  display: flex; align-items: center; gap: 12px;
  padding: 11px 16px;
  cursor: pointer;
  border-bottom: 1px solid var(--brand-gray-1);
  transition: background 0.1s;
}
.sc-item:last-child {border-bottom: none;}@media (hover: hover) and (pointer: fine){
.sc-item:hover {background: var(--brand-primary-soft);}}
.sc-item.selected {background: var(--brand-primary-soft);}
.sc-check {
  width: 18px; height: 18px;
  border: 1.5px solid var(--brand-gray-2);
  border-radius: 4px;
  flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: white;
  transition: all 0.15s;
}
.sc-item.selected .sc-check {
  background: var(--brand-primary);
  border-color: var(--brand-primary);
}
.sc-item.selected .sc-check::after {
  content: "\2713\FE0E"; color: white; font-size: 12px; font-weight: 700; font-family: -apple-system, "system-ui", "Segoe UI", Roboto, sans-serif; /* Vit 14.7.: kanon fajfka */
}
.sc-label {font-size: 14px; color: var(--brand-text); line-height: 1.35;}
.sc-no-results {
  padding: 16px;
  text-align: center;
  color: var(--brand-text-soft);
  font-size: 13px;
}
/* Vít 19.5.2026: dolní akce v Q23, 2 buttony vedle sebe: Jiné (primary CTA vlevo) | Nechci odpovídat (decentní vpravo) */
.sc-bottom-actions {
  display: flex; gap: 10px; align-items: center;
  margin-top: 4px;
  flex-wrap: wrap;
  justify-content: space-between;
}
.sc-other-cta { /* Vit 14.7.: decentni (nesviti zelene) - styl jako drivejsi carkovane tlacitko */
  display: inline-flex; align-items: center; gap: 8px;
  background: transparent; color: var(--brand-text-soft);
  border: 1.5px dashed var(--brand-gray-2);
  padding: 10px 14px; border-radius: 12px;
  cursor: pointer; font-family: inherit; font-size: 12.5px; font-weight: 500;
  transition: all 0.15s;
}@media (hover: hover) and (pointer: fine){
.sc-other-cta:hover {color: var(--brand-text); border-color: var(--brand-gray-3); background: #fafafa;}}
.sc-other-icon {
  background: var(--brand-primary-soft); color: var(--brand-primary);
  width: 20px; height: 20px;
  border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 900;
  flex-shrink: 0;
}
/* Decentní dashed šedý "Nechci odpovídat", stejný styl jako "Neužívám nic z naší databáze" u léků */
.sc-skip-btn,
.q-skip-btn {
  background: transparent;
  color: var(--brand-text-soft);
  border: 1.5px dashed var(--brand-gray-2);
  padding: 10px 14px; border-radius: 12px; /* Vit 13.7.: kanon hranate, mensi at se vejde */
  font-weight: 500; cursor: pointer; font-size: 12.5px;
  font-family: inherit;
  transition: all 0.15s;
}@media (hover: hover) and (pointer: fine){
.sc-skip-btn:hover,
.q-skip-btn:hover {color: var(--brand-text); border-color: var(--brand-gray-3); background: #fafafa;}}

/* Vit 14.7.: prave tlacitko Q23 - zelene hranate; meni se jen text Ne, zadny <-> Pokracovat */
.sc-action-main {
  background: var(--brand-primary); color: #fff;
  border: none;
  padding: 10px 16px; border-radius: 12px;
  cursor: pointer; font-family: inherit; font-size: 13.5px; font-weight: 700;
  transition: all 0.15s;
  box-shadow: 0 4px 12px rgba(40,149,70,0.18);
}@media (hover: hover) and (pointer: fine){
.sc-action-main:hover {background: var(--brand-primary-dark); transform: translateY(-1px); box-shadow: 0 6px 16px rgba(40,149,70,0.25);}}

/* Poslední otázka stamp badge */
.last-question-stamp {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px 6px 10px;
  background: var(--brand-primary-soft); /* Vit 13.7.: nase zelena dle brandu */
  border: 1.5px solid rgba(40,149,70,0.25);
  border-radius: 999px;
  color: var(--brand-primary);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  margin-bottom: 14px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}
.last-question-stamp .lqs-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px; height: 18px;
  background: var(--brand-primary); color: white;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 900;
}
/* Examples (i) icon and content */
.examples-content {
  display: block;
  color: var(--brand-text-soft);
  font-size: 13px;
  margin: 6px 0 14px;
  padding: 10px 14px;
  background: #fffbeb;
  border-left: 3px solid var(--brand-yellow);
  border-radius: 6px;
  line-height: 1.5;
}
.examples-content.open {display: block;}
.examples-content strong {color: var(--brand-text);}

/* Collapsible sage tooltip "Proč se ptáme?" */
.sage-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--brand-primary);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  user-select: none;
  margin-bottom: 16px;
  padding: 4px 10px;
  border-radius: 100px;
  background: var(--brand-primary-soft);
  transition: background 0.15s;
  border: none;
  font-family: inherit;
}@media (hover: hover) and (pointer: fine){
.sage-toggle:hover {background: #d4ead9;}}
.sage-toggle .arrow {transition: transform 0.2s;}
.sage-toggle.open .arrow {transform: rotate(180deg);}
.sage-content {
  display: none;
  color: var(--brand-text-soft);
  font-size: 13px;
  margin-bottom: 20px;
  padding: 12px 16px;
  background: var(--brand-primary-soft);
  border-left: 3px solid var(--brand-primary);
  border-radius: 8px;
  line-height: 1.5;
}
.sage-content.open {display: block;}
.sage-content strong {color: var(--brand-text);}

/* Options, mobile-first, min touch target 44px */
.options {display: flex; flex-direction: column; gap: 8px;}
.option {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px; min-height: 52px;
  border: 1.5px solid var(--brand-gray-1);
  border-radius: 12px; cursor: pointer;
  transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  background: white;
  font-size: 15px;
  user-select: none; -webkit-tap-highlight-color: transparent;
}@media (hover: hover) and (pointer: fine){
.option:hover, .option:focus-within {
  border-color: var(--brand-primary); background: var(--brand-primary-soft);
}}
.option.selected {
  border-color: var(--brand-primary); background: var(--brand-primary-soft);
  box-shadow: 0 4px 14px rgba(40, 149, 70, 0.12);
}
@media (min-width: 600px) {
  .options {gap: 10px;}
  .option {padding: 16px 20px; font-size: 15px; border-radius: 14px;}@media (hover: hover) and (pointer: fine){
  .option:hover {transform: translateY(-1px); box-shadow: 0 4px 12px rgba(40, 149, 70, 0.08);}}
}
.option-icon {font-size: 20px;}
.option-marker {
  width: 20px; height: 20px;
  border: 2px solid var(--brand-gray-2);
  border-radius: 50%;
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.option.selected .option-marker {
  border-color: var(--brand-primary);
}
.option.selected .option-marker::after {
  content: ''; width: 10px; height: 10px;
  background: var(--brand-primary); border-radius: 50%;
}
.option-checkbox .option-marker {border-radius: 4px;}
.option-checkbox.selected .option-marker {
  background: var(--brand-primary);
  border-color: var(--brand-primary);
}
.option-checkbox.selected .option-marker::after {
  content: "\2713\FE0E"; color: white; font-weight: 700; font-size: 13px; font-family: -apple-system, "system-ui", "Segoe UI", Roboto, sans-serif; /* Vit 14.7.: kanon fajfka */
  background: none; width: auto; height: auto;
}
/* Sentinel "nic/none" options inside checkbox lists, render as RADIO (circle), visually separated */
.option-checkbox.option-none .option-marker {border-radius: 50%; background: white;}
.option-checkbox.option-none.selected .option-marker::after {
  content: ''; width: 10px; height: 10px;
  background: var(--brand-primary); border-radius: 50%;
  color: transparent; font-size: 0;
}
/* Vít 20.5.2026: "Nic mě netrápí" je teď DECENTNÍ. Vypadá jako ostatní options,
   jen má kolečko (radio) místo čtverečku a lehce odlišenou dashed border, aby user věděl že je to "vyřazovací" volba. */
.option-checkbox.option-none {
  margin-top: 6px;
  border: 1.5px dashed var(--brand-gray-2);
  background: white;
  color: var(--brand-text);
  font-weight: 500;
  padding: 14px 16px;
  min-height: 52px;
  justify-content: flex-start;
  text-align: left;
}@media (hover: hover) and (pointer: fine){
.option-checkbox.option-none:hover {
  background: var(--brand-primary-soft);
  border-color: var(--brand-primary);
  color: var(--brand-text);
}}
.option-checkbox.option-none.selected {
  background: var(--brand-primary-soft);
  border-color: var(--brand-primary);
  color: var(--brand-text);
}
.option-checkbox.option-none.selected .option-marker {background: white; border-color: var(--brand-primary);}
/* Když je vybrané něco jiného, "nic" se vizuálně zablokuje */
.option-checkbox.option-none.disabled-by-others {
  opacity: 0.35; pointer-events: none;
}

/* Scale */
.scale-options {display: flex; gap: 8px; justify-content: space-between; margin-top: 12px;}
.scale-btn {
  flex: 1; padding: 16px 8px;
  border: 2px solid var(--brand-gray-1);
  border-radius: 10px;
  cursor: pointer; background: white;
  font-size: 18px; font-weight: 600;
  transition: all 0.15s;
}@media (hover: hover) and (pointer: fine){
.scale-btn:hover {border-color: var(--brand-primary);}}
.scale-btn.selected {background: var(--brand-primary); color: white; border-color: var(--brand-primary);}
.scale-labels {display: flex; justify-content: space-between; margin-top: 8px; font-size: 12px; color: var(--brand-text-soft);}

/* Text/Number input */
.input-field {
  width: 100%; padding: 14px 16px;
  border: 2px solid var(--brand-gray-1);
  border-radius: 12px;
  font-size: 16px; font-family: inherit;
}
.input-field:focus {outline: none; border-color: var(--brand-primary);}

/* Buttons, mobile-first, min 48px height */
.btn {
  padding: 14px 24px; border: none; border-radius: 100px;
  font-family: inherit; font-size: 16px; font-weight: 600;
  cursor: pointer; transition: all 0.15s;
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 48px;
  -webkit-tap-highlight-color: transparent;
}
.btn-primary {background: var(--brand-primary); color: white;}@media (hover: hover) and (pointer: fine){
.btn-primary:hover:not(:disabled) {background: var(--brand-primary-dark);}}
.btn-primary:disabled {background: var(--brand-gray-2); cursor: not-allowed; opacity: 0.6;}
.btn-secondary {background: transparent; color: var(--brand-text-soft); padding: 12px 16px; min-height: 44px;}
.btn-row {display: flex; justify-content: space-between; align-items: center; margin-top: 20px; gap: 8px;}
@media (min-width: 600px) {
  .btn {padding: 16px 32px; font-size: 17px;}@media (hover: hover) and (pointer: fine){
  .btn-primary:hover:not(:disabled) {transform: translateY(-1px);}}
  .btn-row {margin-top: 24px;}
}

/* Drug autocomplete */
.drug-input-wrapper {position: relative;}
.drug-suggestions {
  position: absolute; top: 100%; left: 0; right: 0;
  background: white; border: 1px solid var(--brand-gray-1);
  border-radius: 8px; max-height: 200px; overflow-y: auto;
  box-shadow: var(--shadow-card); z-index: 10;
}
.drug-suggestion {padding: 10px 14px; cursor: pointer;}@media (hover: hover) and (pointer: fine){
.drug-suggestion:hover {background: var(--brand-gray-1);}}
.drug-chip {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 12px; background: var(--brand-cream);
  border: 1px solid var(--brand-primary);
  border-radius: 8px; font-size: 14px; margin: 4px 4px 4px 0;
}
.drug-chip button {
  background: none; border: none; cursor: pointer;
  color: var(--brand-text-soft); font-size: 16px;
}

/* Loading, premium mixing animation s glow + ring puls */
.loading {text-align: center; padding: 40px 20px 30px;}
/* Glow halo za centrem */
/* Loading teaser, produkty padají do Mujvit balíčku
   Vít 19.5.: chce vidět box samostatný + kolem něj plno produktů co se "vybírají" */

/* Vít 20.5.2026: nová split-layout loading animace, krabička vlevo, scroll produktů vpravo */

/* Vyběhající marquee s produkty nad krabičkou */

/* Mujvit krabička pod marquee */

/* "Padající" pill ze středu marquee dolů do krabičky */
.loading-text {color: var(--brand-text-soft); font-size: 15px; transition: all 0.4s;}
.loading-text.active {color: var(--brand-primary); font-weight: 600; font-size: 17px;}

/* Vít 19.5.2026: LOADING V3, kompletně přepracováno */
.loading-v3 {
  display: flex; flex-direction: column; align-items: center;
  gap: 6px; padding: 18px 6px 30px;
  max-width: 720px; margin: 0 auto;
}
/* Logo NAHORU, Vít 20.5.2026: zmenšeno o 20% (130→104); 12.6.2026 dále o 20 % (104→83) */
.loading-v3-logo {
  width: 83px; height: 83px;
  display: flex; align-items: center; justify-content: center;
  animation: v3LogoSpin 8s linear infinite;
  margin-bottom: 4px;
  padding: 8px;
}
.loading-v3-logo-img {
  width: 100%; height: 100%; object-fit: contain;
  filter: drop-shadow(0 6px 14px rgba(40,149,70,0.18));
}
@keyframes v3LogoSpin {
  from {transform: rotate(0deg);}
  to   {transform: rotate(360deg);}
}
.loading-v3-title {
  font-size: 21px; font-weight: 800; color: var(--brand-text);
  text-align: center; line-height: 1.25; margin-top: 6px;
}
.loading-v3-goal { color: var(--brand-primary); }
.loading-v3-subtitle {
  font-size: 13px; color: var(--brand-text-soft);
  text-align: center; margin-bottom: 14px;
}
/* HLAVNÍ SPLIT, velká krabička vlevo + 2 sloupce vpravo (bez pillů, jen čisté obrázky) */
.loading-v3-split {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 22px;
  align-items: center;
  width: 100%;
  margin: 4px 0 18px;
  min-height: 360px;
}
.loading-v3-box {
  display: flex; justify-content: center; align-items: center;
  position: relative;
}
.loading-v3-box::before {
  content: ''; position: absolute; inset: -20px;
  background: radial-gradient(ellipse at center, rgba(40,149,70,0.10) 0%, transparent 65%);
}
.loading-v3-box-img {
  position: relative; z-index: 1;
  display: block; width: 100%; max-width: 238px;
  filter: drop-shadow(0 18px 40px rgba(0,0,0,0.18));
}
/* Vít 20.5.2026: HTML "sáček" overlay s dynamickým jménem + zajímavostí */
@keyframes v3BoxFloat {
  0%,100% {transform: translateY(0) rotate(-1deg);}
  50%     {transform: translateY(-10px) rotate(1deg);}
}
@keyframes v3BoxGlow {
  0%,100% {opacity: 0.4; transform: scale(0.94);}
  50%     {opacity: 1; transform: scale(1.06);}
}
.loading-v3-cols {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 10px;
  height: 360px;
}
.loading-v3-col-wrap {
  height: 360px; overflow: hidden;
  mask-image: linear-gradient(to bottom, transparent 0, #000 10%, #000 90%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 10%, #000 90%, transparent 100%);
}
.loading-v3-col {
  display: flex; flex-direction: column;
  gap: 12px;
}
.loading-v3-col img {
  width: 100%; aspect-ratio: 1/1; object-fit: contain;
  border-radius: 12px;
  background: transparent;
  flex-shrink: 0;
  filter: drop-shadow(0 4px 10px rgba(0,0,0,0.10));
}
/* Up = první sloupec, Down = druhý sloupec opačně */
.loading-v3-col-up   {animation: v3ScrollUp   14s linear infinite;}
.loading-v3-col-down {animation: v3ScrollDown 16s linear infinite;}
@keyframes v3ScrollUp {
  from {transform: translateY(0);}
  to   {transform: translateY(-50%);}
}
@keyframes v3ScrollDown {
  from {transform: translateY(-50%);}
  to   {transform: translateY(0);}
}
/* STATUS TEXTY DOLŮ */
.loading-v3-status {
  display: flex; flex-direction: column; gap: 8px;
  align-items: center; text-align: center;
  margin-top: 12px;
}
.loading-v3-status .loading-text {opacity: 0.6;}
.loading-v3-status .loading-text.active {opacity: 1;}
/* Mobile */
@media (max-width: 540px) {
  .loading-v3-logo {width: 67px; height: 67px; padding: 6px;}
  .loading-v3-title {font-size: 18px;}
  .loading-v3-split {grid-template-columns: 1.3fr 1fr; gap: 12px; min-height: 300px;}
  .loading-v3-box-img {max-width: 161px;}
  .loading-v3-cols {height: 300px; gap: 6px;}
  .loading-v3-col-wrap {height: 300px;}
}

/* Results page, Mujvit hero s personalizovaným sáčkem */
.results-hero {
  background: var(--brand-cream);
  border-radius: 20px;
  padding: 28px 20px 18px; /* Vit 4.7.: lehce mensi mezera pod H1 */
  margin-bottom: 16px;
  position: relative;
}
.results-hero-content {
  /* Vít 15.6.2026: mobil = všechen text nad fotkou; desktop = text vlevo / fotka vpravo */
  display: flex; flex-direction: column; gap: 14px;
}
.results-hero-text { min-width: 0; }
.results-hero-eyebrow {
  font-size: 11px; font-weight: 700;
  color: var(--brand-orange);
  text-transform: uppercase; letter-spacing: 2px;
  margin-bottom: 8px;
}
.results-hero h2 {
  font-size: clamp(32px, 10vw, 52px); font-weight: 800; letter-spacing: -2px;
  line-height: 1.0; color: var(--brand-text);
  margin-bottom: 12px; white-space: nowrap;
}
.results-hero h2 span.green {color: var(--brand-primary);}
.results-hero p {color: var(--brand-text-soft); font-size: 15px; line-height: 1.6;}
.results-hero-badges {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-top: 16px;
}
.results-hero-badge {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--brand-primary-soft); color: var(--brand-text);
  padding: 7px 13px; border-radius: 999px;
  font-size: 12.5px; font-weight: 600; line-height: 1;
}
.results-hero-badge::before {content: "\2713\FE0E"; font-family: -apple-system, "system-ui", "Segoe UI", Roboto, sans-serif; color: var(--brand-primary); font-weight: 700;}

/* Sáček visual s jménem */
.sacek-wrap {
  position: relative; align-self: center;
  max-width: 340px; width: 100%; padding: 0;
  container-type: inline-size;
  order: -1; /* Vít 15.6.2026: na mobilu fotka úplně nahoře (nad HOTOVO i nadpisem) */
}
.sacek-img {
  width: 100%; height: auto; display: block;
  border-radius: 12px;
  /* Vít 15.6.2026: jemný stín – nový sáček má průhledné pozadí + bílou kartu, na cream pozadí by jinak splýval */
  filter: drop-shadow(0 12px 26px rgba(26,35,50,0.16));
}
.sacek-name {
  position: absolute; top: 39.6%; left: 50%;
  transform: translate(-50%, -50%);
  font-weight: 800; font-size: 8.5cqw;
  color: #1A2332; letter-spacing: 0; line-height: 1;
  white-space: nowrap;
}
/* Vít 20.5.2026: HTML "sáček" overlay na results stránce, dynamický jméno + zajímavost */

/* Vít 21.5.2026: jediný breakpoint 980px, results hero side-by-side jen na desktopu */
@media (min-width: 980px) {
  .results-hero {padding: 36px 32px; margin-bottom: 28px;}
  .results-hero-content { gap: 16px; }   /* Vít 16.6.: bez fotky = text na plnou šířku (žádný prázdný sloupec) */
  /* .results-hero h2: velikost řeší clamp v base (jako hp-h1-big na homepage) */
  .results-hero p {font-size: 16px;}
}

/* Protocol cards, mobile-first */
.protocol-card {
  background: white; border-radius: 16px;
  padding: 18px 16px; margin-bottom: 12px;
  box-shadow: var(--shadow-soft);
}
.protocol-card.core-card {
  border-left: 4px solid var(--brand-primary);
}
.protocol-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 14px; gap: 14px;
}
.protocol-pkg-icon { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; margin-right: 12px; }
.protocol-pkg-icon img { height: 64px; width: auto; display: block; }
.protocol-eyebrow {
  font-size: 11px; font-weight: 700;
  color: var(--brand-orange);
  text-transform: uppercase; letter-spacing: 1.5px;
  margin-bottom: 4px;
}
.protocol-title {
  font-size: 17px; font-weight: 700; color: var(--brand-text);
  letter-spacing: -0.2px;
}
.protocol-header .protocol-title { font-size: 22px; }   /* Vít: "Balíček [jméno]", větší */
.protocol-header .protocol-title .green { color: var(--brand-primary); }
.protocol-price {
  font-size: 20px; font-weight: 700; color: var(--brand-text);
  white-space: nowrap;
}
.protocol-price .kc {font-size: 13px; font-weight: 500; color: var(--brand-text-soft);}
.protocol-intro {
  color: var(--brand-text-soft); font-size: 13px;
  margin-top: 4px; line-height: 1.5;
}
/* Vít 21.5.2026: jediný breakpoint 980px, mobil 1 sloupec → desktop auto-fill */

/* NOVÝ product grid pro Core karty (Vít 17.5.: větší foto + křížek + Více info)
   Vít 19.5.: i na mobilu vždy 2 sloupce vedle sebe (nikdy 1 sloupec) */
.product-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px;
}
@media (min-width: 600px) { .product-grid {gap: 14px;} }
/* Vít 2.7.2026: mřížkové položky musí jít zmenšit, jinak karty přetečou vpravo (mobil). */
.product-grid > * { min-width: 0; }
@media (max-width: 560px) { .mi-full { display: none; } }
/* Vít 21.5.2026: jediný breakpoint 980px, mobil 2 sloupce → desktop 3 sloupce */
@media (min-width: 980px) { .product-grid {grid-template-columns: repeat(3, 1fr);} }
.product-card-large {
  position: relative;
  background: white; border: 1px solid var(--brand-gray-1);
  border-radius: 14px; padding: 10px;
  display: flex; flex-direction: column;
}
@media (min-width: 600px) { .product-card-large {padding: 14px;} }
.product-card-large.excluded {background: #f9f9f9;}
.product-card-large.excluded > *:not(.product-remove-btn) {opacity: 0.5;}
.product-card-large.excluded .product-remove-btn {
  background: var(--brand-primary); border-color: var(--brand-primary); color: #fff;
  width: 38px; height: 38px; font-size: 26px; font-weight: 700;
  box-shadow: 0 2px 10px rgba(40,149,70,0.35);
}@media (hover: hover) and (pointer: fine){
.product-card-large.excluded .product-remove-btn:hover {background: var(--brand-primary-dark); border-color: var(--brand-primary-dark); color: #fff;}}
.product-remove-btn {
  position: absolute; top: 8px; left: 8px;
  width: 28px; height: 28px; border-radius: 50%;
  background: #fff; border: 1.5px solid var(--brand-gray-1);
  color: var(--brand-text-soft); font-size: 18px; line-height: 1;
  cursor: pointer; z-index: 5; padding: 0;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.15s;
}@media (hover: hover) and (pointer: fine){
.product-remove-btn:hover {background: #ffe4e4; border-color: #ff6b6b; color: #ff6b6b;}}
.product-card-photo {
  width: 100%; aspect-ratio: 1 / 1;
  border-radius: 10px; overflow: hidden;
  background: var(--brand-cream);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 10px;
}
.product-card-photo img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
.product-card-body {flex: 1; display: flex; flex-direction: column;}
.product-card-name {font-weight: 700; color: var(--brand-text); font-size: 15px; margin-bottom: 6px;}
.product-card-vetička {font-size: 13px; color: var(--brand-text-medium); line-height: 1.45; margin-bottom: 10px;}
.product-card-footer {
  display: flex; flex-direction: row; justify-content: space-between; align-items: center; gap: 8px;
  margin-top: auto; padding-top: 8px; border-top: 1px solid var(--brand-gray-1);
}
.product-card-price {font-weight: 800; color: var(--brand-text); font-size: 16px; line-height: 1.1; white-space: nowrap;}
.product-card-pack {display: block; font-size: 11.5px; color: var(--brand-text-soft); font-weight: 500; margin-top: 2px;}
.product-card-more {
  background: none; border: none; color: var(--brand-primary);
  font-weight: 700; font-size: 12.5px; cursor: pointer; padding: 0;
  text-decoration: none; white-space: nowrap;
}@media (hover: hover) and (pointer: fine){
.product-card-more:hover {text-decoration: underline;}}
.addon-image-large {
  width: 100px; height: 100px; /* Vit 4.7.: lehce vetsi karta produktu */
  border-radius: 12px; overflow: hidden;
  background: var(--brand-cream);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  aspect-ratio: 1 / 1;
}
.addon-image-large img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
@media (min-width: 600px) {
  .addon-image-large {width: 110px; height: 110px;}
}
/* Vít 19.5.2026: vypnutá addon karta zůstává plně barevná (vidět fotka i texty), jen toggle je off. Bez šedi/opacity. */
.protocol-card.addon.excluded {opacity: 1;}
.protocol-card.addon.excluded .addon-image-large img {filter: none;}
@media (min-width: 600px) {
  .protocol-card {padding: 24px; border-radius: 16px;}
  .protocol-title {font-size: 19px;}
}
/* Vít 21.5.2026: 800px breakpoint sloučen do jednoho 980px (viz výše) */

/* Addon card layout, image left, info middle, price+toggle right */
.protocol-card.addon { position: relative; }
.addon-content {
  /* Vit 5.7.2026 v4: nazev+baleni vlevo nahore, Pridat+cena vpravo, fajfky pres celou sirku, Vice v rohu */
  display: grid;
  grid-template-columns: 100px minmax(0,1fr) auto;
  grid-template-areas: "img info action" "why why why";
  gap: 12px 14px; align-items: start;
}
.addon-content .addon-image-large { grid-area: img; }
.addon-content .addon-info { grid-area: info; align-self: start; display: flex; flex-direction: column; align-items: flex-start; gap: 0; } /* Vit 6.7.: nazev nahoru + cena pod nim */
.addon-content .addon-action { grid-area: action; }
.addon-content .addon-why { grid-area: why; min-width: 0; }
/* Vit 5.7. v5: cena+baleni vlevo hned vedle Pridat (jako builder), tesne u sebe */
.addon-price-stack { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.2; }
.addon-price-stack .aps-price { font-size: 15px; font-weight: 800; color: var(--brand-text); white-space: nowrap; }
.addon-price-stack .aps-pack { font-size: 11.5px; color: var(--brand-text-soft); font-weight: 500; white-space: nowrap; }
.addon-info .addon-price-stack { flex-direction: row; align-items: baseline; gap: 0; margin-top: 3px; } /* Vit 6.7.: cena+baleni VEDLE SEBE pod nazvem */
.addon-info .addon-price-stack .aps-price { font-size: 11.5px; } /* stejna velikost jako kapsle, jen tucne (weight 800) */
.addon-info .addon-price-stack .aps-pack::before { content: "·"; margin: 0 5px; color: var(--brand-text-soft); font-weight: 500; }
.addon-more-inline { background: none; border: none; color: var(--brand-primary); font-weight: 700; cursor: pointer; font-size: 13.5px; padding: 0; font-family: inherit; }
.addon-more-corner { position: absolute; right: 16px; bottom: 13px; white-space: nowrap; } /* Vit 5.7.: Vice v pravem dolnim rohu karty */
.addon-content .addon-why { padding-right: 56px; } /* misto pro Vice na poslednim radku */
/* Vit 14.7.: PC layout dle vzoru - fajfky vedle fotky pod cenou, Vice pod tlacitkem Pridat, fotka lehce vetsi. Mobil beze zmeny. */
@media (min-width: 980px) {
  /* Vit 15.7.2026 v3: PC layout - vlevo blok nazev+cena+benefit, vpravo Pridat+Vice, oboji vertikalne
     vystredene vuci fotce. VELKA mezera od fotky (Vit: text nesmi byt nacpany na fotce, vse doprava). Mobil beze zmeny. */
  .addon-content { grid-template-columns: 128px minmax(0,1fr) auto; grid-template-areas: "img info action" "img why more"; column-gap: 48px; row-gap: 8px; }
  .addon-content .addon-image-large { width: 128px; height: 128px; }
  .addon-content .addon-info { align-self: end; }            /* nazev+cena dolu k benefitu */
  .addon-content .addon-why { align-self: start; padding-right: 0; font-size: 14.5px; line-height: 1.5; }
  .addon-content .addon-action { align-self: end; }          /* Pridat dolu k Vice */
  .addon-more-corner { position: static; grid-area: more; justify-self: end; align-self: start; font-size: 14.5px; padding: 4px 0 0; }
  /* fajfka u benefit textu i u fallbacku (bez why-listu); why-list ma fajfku uz z .why-list li::before */
  .addon-content .addon-why .protocol-intro { position: relative; padding-left: 26px; margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--brand-text); }
  .addon-content .addon-why .protocol-intro::before { content: "\2713\FE0E"; font-family: -apple-system, "system-ui", "Segoe UI", Roboto, sans-serif; position: absolute; left: 0; top: 0; color: var(--brand-primary); font-weight: 800; font-size: 16px; line-height: 1.5; }
}
/* mi-full: na mobilu jen "Více", na PC "Více informací" */
.addon-more-corner .mi-full { display: none; }
@media (min-width: 980px) { .addon-more-corner .mi-full { display: inline; } }
/* Vit 23.7.: mensi telefony - Pridat se zalomi POD cenu (nekoliduje s "30 kapsli"), mensi nazev. Do 419px, >=420 beze zmeny. */
@media (max-width: 399px) {
  .addon-content { grid-template-columns: 64px minmax(0,1fr); grid-template-areas: "img info" "img action" "why why"; gap: 6px 10px; }
  .addon-content .addon-image-large { width: 64px; height: 64px; }
  .addon-content .addon-action { justify-self: start; align-self: start; }
  .addon-info .protocol-title { font-size: 13.5px; overflow-wrap: break-word; }
}
.addon-info {min-width: 0;}
.addon-info .protocol-title {font-size: 16.5px; margin-bottom: 0;} /* Vit 5.7.: vetsi nazev */
.addon-info .protocol-intro {font-size: 12px; margin-top: 2px;}
.addon-action {
  /* Vit 5.7.2026 v5: [cena+baleni | Pridat] vedle sebe, na stred vuci fotce */
  display: flex; flex-direction: row; align-items: center; gap: 10px; align-self: center;
}
.addon-action .addon-add-btn { padding: 9px 16px; font-size: 13.5px; } /* lehce mensi tlacitko */
@media (max-width: 379px) {
  .addon-action { gap: 8px; }
  .addon-action .addon-add-btn { padding: 9px 13px; }
  .addon-price-stack .aps-price { font-size: 14px; }
}
.addon-action .protocol-price {font-size: 16px;}
.addon-action .protocol-price .kc {font-size: 12px;}
@media (min-width: 600px) {
  .addon-content {grid-template-columns: 110px 1fr auto; gap: 18px;}
  .addon-info .protocol-title {font-size: 18px;}
  .addon-info .protocol-intro {font-size: 13px;}
  .addon-action .protocol-price {font-size: 18px;}
}
/* Vit 15.7.2026 v3 FIX: PC override MUSÍ být AŽ ZA @media 600px výše (jinak ho 600px blok přepíše na
   grid 110px / gap 18px = nacpané na fotce). Tady vyhraje: velká mezera od fotky, obsah doprava. Mobil beze změny. */
@media (min-width: 980px) {
  .addon-content { grid-template-columns: 128px minmax(0,1fr) auto; column-gap: 48px; row-gap: 8px; }
}
/* Boost (Tier 3), orange accent + "Přidat" CTA emphasis */
.protocol-card.boost {
  background: #fafaf7;
  border-left: 4px solid var(--brand-orange);
}
.protocol-card.recommended {
  border-left: 4px solid var(--brand-primary);
}
.product-pill.excluded {
  background: var(--brand-gray-1); opacity: 0.55; text-decoration: line-through;
}
/* Addon protocol, větší vizuální rozlišení */
.protocol-card.addon {
  border-left: 4px solid var(--brand-orange);
  position: relative;
  padding: 16px;
}
.addon-info .product-card-more { min-height: 0; }
.addon-badge {
  position: absolute; top: -10px; left: 16px; z-index: 2;
  font-size: 10px; font-weight: 700; letter-spacing: 1px;
  background: var(--brand-orange); color: white;
  padding: 3px 10px; border-radius: 100px;
  text-transform: uppercase;
  max-width: calc(100% - 32px);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.protocol-toggle {
  display: inline-flex; align-items: center; gap: 6px;
  cursor: pointer; user-select: none;
  font-size: 13px; color: var(--brand-text-soft); font-weight: 500;
  /* Vít 19.5.: větší klikatelná plocha aby user trefil toggle i s milimetrovou odchylkou */
  padding: 12px 14px; margin: -12px -14px;
  border-radius: 12px;
  -webkit-tap-highlight-color: transparent;
}@media (hover: hover) and (pointer: fine){
.protocol-toggle:hover {background: rgba(40,149,70,0.06);}}
.protocol-toggle:active {background: rgba(40,149,70,0.12);}
.protocol-toggle .switch {
  position: relative; width: 46px; height: 26px;
  background: var(--brand-gray-2); border-radius: 100px;
  transition: background 0.2s;
}
.protocol-toggle .switch::after {
  content: ""; position: absolute; top: 2px; left: 2px;
  width: 22px; height: 22px; background: white; border-radius: 50%;
  transition: transform 0.2s;
  box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}
.protocol-toggle.active .switch {background: var(--brand-primary);}
.protocol-toggle.active .switch::after {transform: translateX(20px);}
/* Vít 4.6.2026: addon ovládání jako tlačítko „Přidat" z vitaminy-na-miru (sjednocení) */
.addon-add-btn {
  background: var(--brand-cream); color: var(--brand-text);
  border: 1.5px solid var(--brand-primary);
  padding: 0 22px; height: 40px; border-radius: 999px;
  font-size: 13.5px; font-weight: 700; cursor: pointer; font-family: inherit;
  transition: all 0.15s; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  line-height: 1; min-width: 104px; white-space: nowrap;
}@media (hover: hover) and (pointer: fine){
.addon-add-btn:hover { background: var(--brand-primary); color: white; }}
.addon-add-btn.added { background: var(--brand-primary); color: white; }
.addon-price { display: flex; flex-direction: row; align-items: baseline; gap: 5px; }
.addon-footer { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--brand-gray-1); }
.addon-price-main { font-size: 17px; font-weight: 800; color: var(--brand-text); letter-spacing: -0.3px; display: inline-flex; align-items: baseline; gap: 3px; }
.addon-price-kc { font-size: 12.5px; font-weight: 700; color: var(--brand-text-soft); }
.addon-price-pack { font-size: 11.5px; font-weight: 500; color: var(--brand-text-soft); }

.section-title {
  font-size: 12px; text-transform: uppercase; letter-spacing: 1.5px;
  color: var(--brand-orange); font-weight: 700; text-align: left;
  margin: 28px 0 14px;
}
@media (min-width: 600px) {
  .section-title {font-size: 13px;}
}

/* Pricing footer, mobile-first sticky.
   Vít 19.5.2026: all-products modal má vlastní sticky bar uvnitř (cena + tlačítka).
   Tj. pricing footer může zůstat klasicky sticky a být překrytý modalem (bez konfliktu). */
.pricing-footer {
  position: sticky; bottom: 0; left: 0; right: 0;
  background: white; padding: 14px 12px;
  box-shadow: 0 -4px 16px rgba(0,0,0,0.08);
  border-top: 1px solid var(--brand-gray-1);
  z-index: 50;
}
.pricing-row {display: flex; flex-direction: column; gap: 8px; max-width: 980px; margin: 0 auto;}
.pricing-options-grid {display: flex; gap: 8px;}
.pricing-option {
  position: relative;
  flex: 1; padding: 8px 12px; min-height: 0;
  border: 2px solid var(--brand-gray-1); border-radius: 12px;
  cursor: pointer; text-align: center;
  transition: all 0.15s;
  -webkit-tap-highlight-color: transparent;
}
.pricing-option.selected {border-color: var(--brand-warm); background: rgba(248,150,31,0.06);}
.pricing-option::before { content:""; position:absolute; top:8px; left:8px; width:16px; height:16px; border-radius:50%; border:2px solid var(--brand-gray-1); background:#fff; transition:all .15s; }
.pricing-option.selected::before { border-color:var(--brand-warm); background:var(--brand-warm) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/11px no-repeat; }
.pricing-option-label {font-size: 12.5px; font-weight: 400; color: var(--brand-text); margin-top: 0;}
.pricing-option-amount {font-size: 18px; font-weight: 800; color: var(--brand-primary); margin-top: 2px;}
.pricing-option-perday {font-size: 11px; color: var(--brand-text-soft); font-weight: 400;}
.pricing-pkg {font-size: 11px; color: var(--brand-text-soft); font-weight: 600;}
.pricing-option-note {font-size: 11px; color: var(--brand-text-soft); font-style: italic; margin-top: 2px;}
.pricing-option-rec { /* Vít 15.6.2026: bez zelené – nevybraná 3měsíční vypadá neutrálně jako měsíční; výběr značí jen oranžová (.selected) */ }
.pricing-rec {position: absolute; top: -9px; left: 50%; transform: translateX(-50%); background: var(--brand-warm); color: #fff; font-size: 9.5px; font-weight: 700; letter-spacing: .4px; padding: 2px 10px; border-radius: 10px; white-space: nowrap; box-shadow: 0 2px 6px rgba(248,150,31,0.35); z-index: 2; text-transform: uppercase;}
/* Vít 12.6.2026: na mobilu užší pricing lišta (zabírala moc místa) — desktop (>=980px) beze změny */
@media (max-width: 979px) {
  .pricing-footer {padding: 8px 12px;}
  .pricing-row {gap: 6px;}
  .pricing-options-grid {gap: 6px;}
  .pricing-option {padding: 5px 9px;}
  .pricing-option-label {font-size: 12px;}
  .pricing-option-amount {font-size: 16.5px;}
  .pricing-cta {min-height: 44px; padding: 10px 24px; font-size: 14.5px;}
  .pricing-rec {top: -8px; font-size: 9px; padding: 1.5px 8px;}
  .pricing-cta-trust {margin-top: 4px !important; font-size: 10.5px !important;}
}
.pricing-cta {
  /* Vit 3.7.2026: HLAVNI CTA = ZELENE s bilym textem, hranate (rozhodnuto) */
  background: var(--brand-primary); color: #fff; font-weight: 800;
  padding: 14px 24px; border-radius: 14px; border: none;
  cursor: pointer; font-size: 15px;
  min-height: 52px; width: 100%;
  box-shadow: 0 6px 18px rgba(40,149,70,0.30);
  display: flex; align-items: center; justify-content: center; gap: 6px;
  font-family: inherit; transition: all 0.15s;
  -webkit-tap-highlight-color: transparent;
}@media (hover: hover) and (pointer: fine){
.pricing-cta:hover { background: var(--brand-primary-dark, #1f6b39); transform: translateY(-1px); box-shadow: 0 8px 22px rgba(40,149,70,0.38); }}
/* Vít 21.5.2026: jediný breakpoint 980px, pricing footer side-by-side jen na desktopu */
@media (min-width: 980px) {
  .pricing-footer {padding: 18px 20px;}
  .pricing-row {flex-direction: row; align-items: center; gap: 14px;}
  .pricing-options-grid {flex: 1; gap: 12px;}
  .pricing-option {padding: 10px 14px; min-height: 0;}
  .pricing-option-amount {font-size: 20px;}
  .pricing-cta {width: auto; padding: 14px 32px;}
}
/* Vít 19.5.2026: pod K objednávce tlačítkem prominentní info o dopravě zdarma */
.pricing-cta-wrap {
  display: flex; flex-direction: column; align-items: center; gap: 3px;
}
.pricing-cta-shipping {
  text-align: center;
  font-size: 11px;
  color: var(--brand-text-soft);
  font-weight: 500;
  padding: 2px 0 0;
  white-space: nowrap;
}
@media (max-width: 600px) { .pricing-cta-shipping { display: none; } }
.pricing-cta-shipping strong {color: var(--brand-primary); font-weight: 800; letter-spacing: 0.2px;}
@media (min-width: 600px) {
  .pricing-cta-wrap {gap: 4px;}
  .pricing-cta-shipping {font-size: 11px;}
}

/* Vit 3.7.2026: fajfky pod hlavnim CTA - brandove (pevny font, at nefallbackuje) */
.pricing-cta-trust { font-size: 12px; color: var(--brand-text-medium); margin-top: 7px; text-align: center; line-height: 1.5; display: flex; gap: 6px 18px; justify-content: center; flex-wrap: wrap; font-weight: 600; }
.pricing-cta-trust .pct-item { white-space: nowrap; }
.pricing-cta-trust .tick { color: var(--brand-primary); font-weight: 800; font-family: -apple-system, "system-ui", "Segoe UI", Roboto, sans-serif; margin-right: 5px; } /* Vit 13.7.: kanon fajfka */
/* Vit 3.7.2026: fajfky + Google hodnoceni presunuty pod "Prohlednout a upravit balicek" */
.results-trust-below { max-width: 420px; margin: 30px auto 6px; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.results-trust-below .results-hero-points { margin: 0; }
/* Vit 3.7.2026: autor komentare NAHORE (jmeno na 2 radky, vetsi pozornost) */
.vit-summary-author--top { display: flex; align-items: center; gap: 12px; margin: 12px 0 16px; }
.vit-summary-author--top img { width: 52px !important; height: 52px !important; max-width: 52px !important; max-height: 52px !important; }
.vsa-name { display: flex; flex-direction: column; line-height: 1.3; }
.vsa-name strong { font-size: 16px; color: var(--brand-text); }
.vsa-role { font-size: 12.5px; color: var(--brand-text-soft); font-weight: 500; }

/* Vít summary, KREV STYLE (cream box + orange quote mark) */
.vit-summary {
  background: var(--brand-cream);
  border-radius: 16px;
  padding: 22px 22px 18px 22px;
  margin: 24px 0;
  position: relative;
}
.vit-summary::before {
  content: '"';
  position: absolute;
  top: -10px; left: 18px;
  font-size: 64px; line-height: 1;
  color: var(--brand-orange);
  font-family: Georgia, serif;
  font-weight: 700;
}
.vit-summary-head {
  font-size: 11px; font-weight: 700;
  color: var(--brand-orange);
  text-transform: uppercase;
  letter-spacing: 1.5px;
  margin-bottom: 10px;
  margin-left: 32px;
}
.vit-summary-text {
  font-size: 15px; line-height: 1.65;
  color: var(--brand-text);
  margin-left: 32px;
}
.vit-summary-text p + p {margin-top: 10px;}
.vit-summary-text strong {font-weight: 600;}
.vit-summary-author {
  margin-top: 14px;
  margin-left: 32px;
  font-size: 13px;
  color: var(--brand-text-soft);
  font-style: italic;
  display: flex; align-items: center; gap: 10px;
}
.vit-summary-author img {
  width: 36px !important; height: 36px !important;
  max-width: 36px !important; max-height: 36px !important;
  min-width: 36px; min-height: 36px;
  border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
}
.vit-summary-author strong {
  color: var(--brand-text); font-weight: 600; font-style: normal;
}
@media (min-width: 600px) {
  .vit-summary {padding: 28px 28px 22px 28px;}
  .vit-summary::before {font-size: 72px; left: 22px;}
  .vit-summary-text {font-size: 16px;}
}
/* Expandable Vít report (inline) */
.vit-report-toggle {
  display: inline-flex; align-items: center; gap: 8px;
  background: white;
  border: 1.5px solid var(--brand-gray-1);
  padding: 12px 18px; border-radius: 100px;
  color: var(--brand-primary); font-weight: 600; font-size: 14px;
  cursor: pointer; transition: all 0.15s;
  margin-top: 12px; margin-left: 32px;
  -webkit-tap-highlight-color: transparent;
}@media (hover: hover) and (pointer: fine){
.vit-report-toggle:hover {background: var(--brand-primary-soft); border-color: var(--brand-primary);}}
.vit-report-toggle .arrow {transition: transform 0.2s;}
.vit-report-toggle.open .arrow {transform: rotate(180deg);}
.vit-report-toggle-emphasized {
  background: var(--brand-primary) !important;
  color: #fff !important;
  border-color: var(--brand-primary) !important;
  padding: 16px 28px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 16px rgba(40,148,98,0.25) !important;
}@media (hover: hover) and (pointer: fine){
.vit-report-toggle-emphasized:hover {background: #1f7a4c !important; color: #fff !important;}}
.vit-report-toggle-emphasized .arrow {color: #fff;}
/* Vít 20.5.2026: na mobilu plná šíře + center align (margin-left:32px rozbíjelo viewport) */
@media (max-width: 600px) {
  .vit-report-full { padding: 16px; }
  .vit-summary { padding: 20px 16px 16px; }
  .vit-report-toggle, .vit-report-toggle-emphasized {
    margin-left: 0 !important; margin-right: 0;
    width: 100%; box-sizing: border-box;
    justify-content: center; text-align: center;
    padding: 14px 14px !important; font-size: 14.5px !important;
    white-space: normal; line-height: 1.35;
  }
  .all-products-cta {
    display: flex !important;
    width: 100%; box-sizing: border-box;
    justify-content: center; align-items: center;
    font-size: 14.5px !important; padding: 14px 14px !important;
    white-space: normal; line-height: 1.35;
  }
}
/* Vít 20.5.2026: úzké telefony (< 380 px), ikonka NAD textem aby se vše vešlo */
@media (max-width: 380px) {
  .all-products-cta {
    flex-direction: column; gap: 6px;
    padding: 12px 10px !important;
    font-size: 14px !important;
  }
  .vit-report-toggle, .vit-report-toggle-emphasized {
    padding: 12px 10px !important; font-size: 14px !important;
  }
}
.vit-report-full {
  display: none !important;
  margin-top: 16px;
  background: white;
  border: 1.5px solid var(--brand-orange);
  border-radius: 14px;
  padding: 22px;
  font-size: 14.5px; line-height: 1.65;
}
.vit-report-full.open {display: block !important;}
.vit-report-full h3 {
  font-size: 16px; font-weight: 700; margin: 18px 0 8px;
  color: var(--brand-primary);
}
.vit-report-full h3:first-child {margin-top: 0;}
.vit-report-full p {margin-bottom: 10px;}
.vit-report-full .study-ref {
  display: inline-block; font-size: 11px;
  background: var(--brand-blue); color: white;
  padding: 2px 8px; border-radius: 100px;
  margin-left: 4px; cursor: pointer;
  text-decoration: none;
}
.vit-report-full .warning-block {
  background: #fef3c7; border-left: 4px solid var(--warning);
  padding: 12px 16px; border-radius: 8px; margin: 12px 0;
}
.vit-report-full .lifestyle-block {
  display: flex; align-items: flex-start; gap: 11px;
  background: #e0f2fe; border-left: 4px solid var(--brand-blue);
  padding: 14px 16px; border-radius: 10px; margin: 10px 0;
  line-height: 1.55;
}
.lifestyle-block .lb-body { flex: 1; min-width: 0; }
.lifestyle-block-top .lifestyle-block-ico { color: var(--brand-orange); }
.lifestyle-block-situational .lifestyle-block-ico { color: var(--brand-gray-2); }
.vit-report-full .lifestyle-block-ico {
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 8px; margin-top: 1px;
  background: rgba(255,255,255,0.65); color: var(--brand-blue);
}
.lifestyle-block-ico svg { width: 19px; height: 19px; }
.vit-report-full .lifestyle-block-top {
  background: #FFF3E0; border-left: 4px solid var(--brand-orange);
  position: relative;
  box-shadow: 0 4px 14px rgba(248,150,31,0.08);
}
.vit-report-full .lifestyle-block-top::after {
  content: "Vaše hlavní priorita"; position: absolute; top: -10px; right: 12px;
  background: var(--brand-orange); color: white;
  font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
  padding: 3px 10px; border-radius: 100px;
}
.vit-report-full .lifestyle-block-situational {
  background: #f8f8f5; border-left: 4px solid var(--brand-gray-2);
}

/* Priority cards, Persona Nutrition style */
.priority-cards {
  display: grid; grid-template-columns: 1fr;
  gap: 14px; margin: 12px 0 18px;
}
/* Vít 21.5.2026: jediný breakpoint 980px, mobil 1 sloupec → desktop 2 sloupce */
@media (min-width: 980px) {
  .priority-cards {grid-template-columns: 1fr 1fr;}
}
.priority-card {
  background: white; border: 1.5px solid var(--brand-gray-1);
  border-radius: 14px; padding: 18px 18px 16px;
  position: relative;
}
.priority-card-top {
  border-color: var(--brand-orange);
  background: linear-gradient(180deg, #FFF9F0 0%, #ffffff 100%);
  box-shadow: 0 4px 18px rgba(248, 145, 31, 0.08);
}
.priority-card-head {display: flex; gap: 12px; align-items: center; margin-bottom: 10px;}
.priority-card-icon {
  font-size: 28px; line-height: 1;
  width: 44px; height: 44px;
  background: var(--brand-primary-soft); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.priority-card-top .priority-card-icon {background: #ffe7c8;}
.priority-card-icon svg { width: 26px; height: 26px; color: var(--brand-primary); display: block; }
.priority-card-top .priority-card-icon svg { color: var(--brand-warm); }
.priority-card-label {
  font-size: 16px; font-weight: 700; color: var(--brand-text);
  line-height: 1.25;
}
.priority-top-badge {
  display: inline-block; font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1px;
  background: var(--brand-orange); color: white;
  padding: 2px 8px; border-radius: 100px;
  margin-left: 6px; vertical-align: middle;
}
.priority-card-why {
  font-size: 13.5px; line-height: 1.55;
  color: var(--brand-text-soft); margin: 0 0 10px;
}
.priority-card-nutrients {
  font-size: 12.5px; color: var(--brand-text);
  background: var(--brand-cream); padding: 8px 12px;
  border-radius: 8px; margin-bottom: 8px;
}
.priority-card-products {
  /* Vít 15.6.2026: jemně zvýraznit oranžově – klíčová informace pro zákazníka */
  font-size: 13px; color: var(--brand-text);
  padding: 9px 13px; margin: 4px 0 2px; line-height: 1.5;
  background: #FFF3E0; border-radius: 8px;
}
.priority-card-products strong {color: var(--brand-orange);}
.priority-card-study {margin-top: 4px;}
.priority-card-study .study-ref {
  display: inline-block; font-size: 11px;
  background: var(--brand-blue); color: white;
  padding: 3px 10px; border-radius: 100px;
  text-decoration: none;
}
.priority-card-studies {
  margin-top: 10px; padding-top: 10px;
  border-top: 1px dashed var(--brand-gray-1);
}
.priority-card-studies .study-ref {
  font-size: 10px; padding: 1px 7px;
  background: var(--brand-blue); color: white;
  border-radius: 100px; text-decoration: none;
  display: inline-block;
}
.priority-card-studies ul {list-style: none; padding-left: 0;}
.priority-card-studies li {
  padding-left: 14px; position: relative;
}
.priority-card-studies li::before {
  content: "•"; position: absolute; left: 4px;
  color: var(--brand-primary); font-weight: 700;
}

/* === PROČ MY sekce (Vít 19.5.2026) === */
.why-us { margin: 32px 0 18px; }
.why-us-title {
  font-size: 22px; font-weight: 800; color: var(--brand-text);
  text-align: center; margin: 0 0 18px;
  letter-spacing: -0.3px;
}
/* Vít 16.6.: mobile-first karty s ikonou vlevo (jako „Jak to funguje" na homepage) */
.why-us-grid { display: grid; gap: 12px; grid-template-columns: 1fr; }
@media (min-width: 980px) { .why-us-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; } }
.why-us-item {
  display: flex; align-items: center; gap: 16px; text-align: left;
  background: #fff; border: 1px solid var(--brand-gray-1);
  border-radius: 16px; padding: 18px 20px;
  box-shadow: var(--shadow-sm);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}@media (hover: hover) and (pointer: fine){
.why-us-item:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(26,35,50,.10); border-color: var(--brand-primary-soft); }}
.why-us-text { min-width: 0; flex: 1; }
.why-us-icon {
  flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  width: 52px; height: 52px;
  background: var(--brand-primary-soft); border-radius: 12px;
  color: var(--brand-primary);
}
.why-us-icon svg { width: 26px; height: 26px; }
/* === Recenze na výsledkové stránce (Vít 2.6.2026, inspirace homepage/hodnoceni) === */
.rr-reviews { max-width: 1000px; margin: 26px auto 0; }
.rr-head { text-align: center; margin-bottom: 20px; }
.rr-eyebrow { display:inline-block; font-size:12px; font-weight:800; letter-spacing:1.5px; text-transform:uppercase; color:var(--brand-warm); margin-bottom:8px; }
.rr-h2 { font-size: clamp(22px,5vw,30px); font-weight:800; margin:0 0 10px; color:var(--brand-text); }
.rr-gold { color:#FBBC04; } .rr-green { color:var(--brand-primary); }
.rr-lede { color:var(--brand-text-soft); font-size:15px; margin:0 0 16px; }
.rr-badge { display:inline-flex; align-items:center; flex-wrap:wrap; gap:8px; background:#fff; border:1px solid var(--brand-gray-1); padding:10px 16px; border-radius:14px; font-size:14px; font-weight:600; text-decoration:none; color:inherit; box-shadow:0 2px 10px rgba(0,0,0,0.04); }
.rr-gword, .rr-mini-g { display:inline-flex; gap:0; font-weight:800; }
.rr-gword span:nth-child(1),.rr-mini-g span:nth-child(1){color:#4285F4;} .rr-gword span:nth-child(2),.rr-mini-g span:nth-child(2){color:#EA4335;}
.rr-gword span:nth-child(3),.rr-mini-g span:nth-child(3){color:#FBBC04;} .rr-gword span:nth-child(4),.rr-mini-g span:nth-child(4){color:#4285F4;}
.rr-gword span:nth-child(5),.rr-mini-g span:nth-child(5){color:#34A853;} .rr-gword span:nth-child(6),.rr-mini-g span:nth-child(6){color:#EA4335;}
.rr-stars { color:#FBBC04; letter-spacing:1px; } .rr-muted { color:var(--brand-text-soft); font-weight:500; }
.rr-grid { display:grid; gap:16px; grid-template-columns:1fr; }
@media (min-width:760px){ .rr-grid { grid-template-columns:repeat(3,1fr); } }
.rr-card { background:#fff; border:1px solid var(--brand-gray-1); border-radius:16px; padding:20px; box-shadow:0 1px 3px rgba(0,0,0,0.04); display:flex; flex-direction:column; gap:12px; }
.rr-card-stars { color:#FBBC04; font-size:18px; letter-spacing:1px; line-height:1; }
.rr-card-text { color:var(--brand-text); font-size:14px; line-height:1.6; flex:1; margin:0; }
.rr-card-meta { display:flex; align-items:center; gap:12px; padding-top:12px; border-top:1px solid #F4F4F4; }
.rr-avatar { width:40px; height:40px; border-radius:50%; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:16px; flex-shrink:0; }
.rr-c1{background:var(--brand-primary);} .rr-c2{background:var(--brand-warm);} .rr-c3{background:#4285F4;}
.rr-name { font-weight:700; font-size:14px; color:var(--brand-text); }
.rr-date { font-size:12px; color:var(--brand-text-soft); display:flex; align-items:center; gap:6px; }
.rr-mini-g { font-size:11px; letter-spacing:-0.3px; }
.rr-more { display:inline-block; margin-top:18px; color:var(--brand-primary); font-weight:700; font-size:14px; text-decoration:none; }
.why-us-item h3 {
  font-size: 16px; font-weight: 800; color: var(--brand-text);
  margin: 0 0 4px; letter-spacing: -0.2px;
}
.why-us-item p {
  font-size: 14px; line-height: 1.5;
  color: var(--brand-text-soft); margin: 0;
}

/* === RECENZE preview === */

/* === REVIEWS MODAL === */
.reviews-modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.55);
  z-index: 9999; display: flex; align-items: flex-start; justify-content: center;
  padding: 30px 16px; overflow-y: auto;
  animation: fadeBg 0.2s ease-out;
}
.reviews-modal {
  background: white; border-radius: 20px;
  max-width: 640px; width: 100%;
  padding: 24px 22px 28px; position: relative;
  box-shadow: 0 30px 80px rgba(0,0,0,0.3);
  animation: contactSlide 0.3s cubic-bezier(0.4,0,0.2,1);
}
.reviews-modal-close {
  position: absolute; top: 14px; right: 14px;
  background: #f1f1f1; border: none; border-radius: 50%;
  width: 36px; height: 36px; font-size: 20px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.reviews-modal-head {
  padding-bottom: 16px; margin-bottom: 18px;
  border-bottom: 1px solid var(--brand-gray-1);
}
.reviews-modal-head h2 {font-size: 22px; font-weight: 700; margin: 0 0 6px;}
.reviews-modal-meta {display: flex; align-items: center; gap: 8px; font-size: 14px;}
.reviews-list {display: flex; flex-direction: column; gap: 20px;}
.review-item {
  padding: 14px 0; border-bottom: 1px dashed var(--brand-gray-1);
  position: relative;
}
.review-item:last-child {border-bottom: none;}
.review-head {display: flex; align-items: center; gap: 12px; margin-bottom: 8px;}
.review-avatar {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--brand-primary-soft); color: var(--brand-primary);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 16px; flex-shrink: 0;
}
.review-info {flex: 1; min-width: 0;}
.review-name {font-weight: 700; font-size: 14px; color: var(--brand-text);}
.review-date {font-size: 12px; color: var(--brand-text-soft);}
.review-google {flex-shrink: 0;}
.review-stars {color: #FBBC04; font-size: 14px; letter-spacing: -1px; margin-bottom: 6px;}
.review-text {font-size: 13.5px; line-height: 1.55; color: var(--brand-text);}
.reviews-modal-footer {
  margin-top: 20px; padding-top: 16px;
  border-top: 1px solid var(--brand-gray-1);
  text-align: center;
}
.reviews-modal-footer a {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--brand-primary); font-weight: 700;
  text-decoration: none; font-size: 14px;
  padding: 10px 20px; border: 2px solid var(--brand-primary);
  border-radius: 999px;
}@media (hover: hover) and (pointer: fine){
.reviews-modal-footer a:hover {background: var(--brand-primary); color: white;}}

/* === All-products CTA + modal (Vít 19.5.2026) === */
.all-products-cta {
  /* Vít 15.6.2026: výraznější, ať si ho člověk při scrollu dole všimne a chce kliknout */
  display: inline-flex; align-items: center; justify-content: center;
  gap: 10px; flex-wrap: wrap;
  background: var(--brand-primary-soft); border: 2px solid var(--brand-primary);
  color: var(--brand-primary); font-weight: 800; font-size: 15.5px;
  padding: 15px 26px; border-radius: 14px;
  cursor: pointer; font-family: inherit; line-height: 1.35;
  transition: all 0.18s; text-align: center;
  box-shadow: 0 4px 16px rgba(40,149,70,0.18);
  -webkit-tap-highlight-color: rgba(40,149,70,0.15);
  touch-action: manipulation;
}@media (hover: hover) and (pointer: fine){
.all-products-cta:hover, .all-products-cta:active {
  background: var(--brand-primary); color: white;
  border-style: solid; transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(40,149,70,0.25);
}}

.all-products-modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.55);
  z-index: 9999; display: flex; align-items: flex-start; justify-content: center;
  padding: 24px 12px;
  overflow-y: auto;
  animation: fadeBg 0.2s ease-out;
  -webkit-overflow-scrolling: touch;
}
.all-products-modal {
  background: white; border-radius: 20px;
  max-width: 760px; width: 100%;
  padding: 22px 18px 28px; position: relative;
  box-shadow: 0 30px 80px rgba(0,0,0,0.3);
  animation: contactSlide 0.3s cubic-bezier(0.4,0,0.2,1);
  /* Vít 19.5.: na mobilu nesmí přesahovat, vždy se vejde */
  max-width: min(760px, 100%);
}
.all-products-modal-head {
  padding-bottom: 14px; margin-bottom: 14px;
  border-bottom: 1px solid var(--brand-gray-1);
  position: sticky; top: 0; background: white; z-index: 2;
}
.all-products-modal-head h2 {font-size: 21px; font-weight: 700; margin: 0 0 4px;}
.all-products-modal-head p {font-size: 13px; color: var(--brand-text-soft); margin: 0;}
.all-products-modal-close {
  position: absolute; top: 14px; right: 14px;
  background: #f1f1f1; border: none; border-radius: 50%;
  width: 36px; height: 36px; font-size: 20px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  z-index: 3;
}
/* Vít 19.5.2026: live sticky bar dole v modalu, počítadlo + cena + tlačítka */
.all-products-modal-stickybar {
  position: sticky; bottom: -28px;
  background: white;
  border-top: 1.5px solid var(--brand-gray-1);
  padding: 12px 16px;
  margin: 16px -18px -28px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
  box-shadow: 0 -6px 16px rgba(0,0,0,0.06);
  z-index: 3;
  flex-wrap: wrap;
}
.apmb-info {display: flex; flex-direction: column; gap: 2px; min-width: 0;}
.apmb-count {font-size: 11.5px; color: var(--brand-text-soft); font-weight: 600; text-transform: uppercase; letter-spacing: 0.4px;}
.apmb-price {font-size: 18px; color: var(--brand-primary); font-weight: 800;}
.apmb-actions {display: flex; gap: 8px; align-items: center;}
.apmb-back {
  background: white;
  border: 1.5px solid var(--brand-gray-1);
  color: var(--brand-text);
  padding: 10px 14px; border-radius: 999px;
  font-size: 13px; font-weight: 600;
  cursor: pointer; font-family: inherit;
}@media (hover: hover) and (pointer: fine){
.apmb-back:hover {border-color: var(--brand-text-soft);}}
.apmb-cta {
  background: var(--brand-primary);
  color: white; border: none;
  padding: 11px 20px; border-radius: 999px;
  font-size: 14px; font-weight: 800;
  cursor: pointer; font-family: inherit;
  box-shadow: 0 4px 12px rgba(40,149,70,0.3);
  transition: all 0.15s;
}@media (hover: hover) and (pointer: fine){
.apmb-cta:hover {transform: translateY(-1px); box-shadow: 0 6px 16px rgba(40,149,70,0.4);}}
@media (max-width: 480px) {
  .all-products-modal-stickybar {padding: 10px 12px; margin: 12px -12px -22px;}
  .apmb-price {font-size: 16px;}
  .apmb-back {padding: 9px 12px; font-size: 12px;}
  .apmb-cta {padding: 10px 16px; font-size: 13px;}
}
/* Vít 19.5.2026 mobile-first: auto-fit grid reaguje na ŠÍŘKU MODALU, ne na viewport.
   Na úzkém modalu (mobile) = 1 sloupec. Když má prostor 240+ px na sloupec = 2 sloupce. */
.all-products-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 10px;
}
.all-product-card {
  display: flex; gap: 12px; padding: 12px;
  border: 1px solid var(--brand-gray-1); border-radius: 12px;
  background: white; transition: all 0.15s;
  align-items: center;
  min-width: 0; /* Vít 19.5.: aby flex item nepřekročil parent width na úzkém viewportu */
  overflow: hidden;
}
.all-product-card.added {
  border-color: var(--brand-primary); background: var(--brand-primary-soft);
}
/* Vít 19.5.2026: produkt už v plánu má zelený rámeček a soft pozadí, ale plnou barvu (žádné opacity) */
.all-product-card.in-plan {
  background: var(--brand-primary-soft);
  border-color: var(--brand-primary);
}
.all-product-img {
  width: 64px; height: 64px; flex-shrink: 0;
  border-radius: 10px; overflow: hidden;
  background: var(--brand-cream); display: flex;
  align-items: center; justify-content: center;
}
.all-product-img img {width: 100%; height: 100%; object-fit: cover;}
.all-product-info {flex: 1 1 auto; min-width: 0; overflow: hidden;}
.all-product-name {font-weight: 700; font-size: 14px; color: var(--brand-text); margin-bottom: 2px; word-wrap: break-word;}
.all-product-desc {font-size: 12px; color: var(--brand-text-soft); line-height: 1.4; margin-bottom: 4px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.all-product-price {font-size: 13px; font-weight: 700; color: var(--brand-primary); word-wrap: break-word;}
.all-product-actions {display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex-shrink: 0;}
/* Vít 19.5.2026: mobile fix, užší padding + menší foto aby se vše vešlo */
@media (max-width: 480px) {
  .all-products-modal {padding: 18px 12px 22px; border-radius: 16px;}
  .all-products-modal-head h2 {font-size: 18px;}
  .all-products-modal-head p {font-size: 12px;}
  .all-products-cat-title {font-size: 16px;}
  .all-product-card {padding: 10px; gap: 10px;}
  .all-product-img {width: 56px; height: 56px;}
  .all-product-name {font-size: 13px;}
  .all-product-desc {font-size: 11.5px;}
  .all-product-price {font-size: 12px;}
}
.all-products-cat {margin-bottom: 24px;}
.all-products-cat-title {
  font-size: 18px; font-weight: 700; color: var(--brand-text);
  margin: 0 0 12px; padding-bottom: 8px;
  border-bottom: 2px solid var(--brand-gray-1);
}

/* === CART V3 (Vít 19.5.2026): GymBeam-inspired 3-step wizard === */
#cartView {padding: 0 0 60px; background: #f5f5f0; min-height: 100vh;}
.cv3-header {
  display: flex; align-items: center; gap: 24px;
  padding: 18px 24px; background: white;
  border-bottom: 1px solid var(--brand-gray-1);
  position: sticky; top: 0; z-index: 50;
  flex-wrap: wrap;
}
.cv3-step.active {opacity: 1;}
.cv3-step.active .cv3-step-circle {background: var(--brand-warm); color: white;}
.cv3-step.active .cv3-step-label {color: var(--brand-warm);}
@media (max-width: 720px) {
  .cv3-header {padding: 12px 14px; gap: 12px;}
}
.cv3-billing-tab-active {background: var(--brand-text); color: white; border-color: var(--brand-text);}@media (hover: hover) and (pointer: fine){
.cv3-billing-tab-active:hover {background: black; color: white;}}
.cv3-tooltip.open {display: block;}
/* Vít 21.5.2026: balíček v košíku, zelený rámeček, hlavička jako mobile expand panel */
/* Nová hlavička, balíček ikona + nadpis */
/* Jméno na balíček, povinné, jde přepsat ale nejde smazat */
/* "+ Přidat vitamíny" dlaždice, Vít 21.5.2026 */

.cv3-nav {display: flex; gap: 12px; justify-content: space-between; margin-top: 6px;}
.cv3-nav-back {
  background: transparent; border: 1.5px solid var(--brand-gray-1);
  color: var(--brand-text); padding: 14px 26px;
  border-radius: 999px; font-weight: 600; cursor: pointer;
  font-family: inherit; font-size: 14px;
}@media (hover: hover) and (pointer: fine){
.cv3-nav-back:hover {border-color: var(--brand-text); background: white;}}
.cv3-nav-next {
  background: var(--brand-primary); color: white; border: none;
  padding: 14px 32px; border-radius: 14px; font-weight: 800;
  cursor: pointer; font-family: inherit; font-size: 15px;
  box-shadow: 0 6px 18px rgba(40,149,70,0.28);
  transition: all 0.15s;
}@media (hover: hover) and (pointer: fine){
.cv3-nav-next:hover {background: var(--brand-primary-dark); transform: translateY(-1px);}}
.cv3-promo.is-open .cv3-promo-chevron {transform: rotate(180deg);}
.cv3-promo.is-open .cv3-promo-toggle {border-bottom: 1px dashed var(--brand-gray-1);}
/* Vít 21.5.2026: stav po uplatnění kódu */
/* Vít 2.6.2026: oranžové "Závazně objednat" v souhrnu bylo duplikát zeleného tlačítka.
   Schovat všude (předtím jen na mobilu). Odesílá zelené cv3NavNext / mobilní sticky lišta. */
/* Vít 21.5.2026: Pokračovat tlačítko v summary boxu, zelené, full-width */
.cv3-summary-next:disabled {
  background: var(--brand-gray-1); color: var(--brand-text-soft);
  cursor: not-allowed; box-shadow: none; transform: none;
}
/* Vít 2.6.2026: finální tlačítko (krok 3 Platba) oranžové */

/* Vít 21.5.2026: mobilní sticky lišta, Celkem + cena + Pokračovat (GymBeam styl) */
.cv3-footer {
  display: flex; align-items: center; justify-content: space-between;
  max-width: 1200px; margin: 0 auto; gap: 14px;
  padding: 20px 24px 30px; border-top: 1px solid var(--brand-gray-1);
}
.cv3-footer-copy {font-size: 12.5px; color: var(--brand-text-soft); font-weight: 500;}
.cv3-footer-mark {height: 24px; width: auto; opacity: 0.75;}
/* Vít 21.5.2026: košík se přepíná jen mezi PC (≥980) a mobil/tablet (≤979), nic mezitím */
@media (max-width: 979px) {
  .cv3-mobile-bar-btn:disabled {background: var(--brand-gray-1); color: var(--brand-text-soft);}
  /* lišta navazuje přímo na souhrn, žádná mezera pod boxem */
  /* souhrn = plochý panel přes celou šířku (žádné kolečko) */
  /* na mobilu jen sticky lišta, schovat duplicitní tlačítko, cenu i trust v souhrnu */
  /* trust řádek pod lištou, lišta se zastaví nad ním */
  .cv3-footer {padding: 10px 16px calc(16px + env(safe-area-inset-bottom));}
}

/* Hidden */
.hidden {display: none !important;}

/* Mobile */
@media (max-width: 600px) {
  .container {padding: 16px 12px;}
  .question {padding: 24px 18px;}
  .question h2 {font-size: 20px;}
  .pricing-row {flex-direction: column; gap: 8px;}
  .pricing-option {padding: 12px;}
}

/* Focus states pro klávesnici (accessibility) */
button:focus-visible, .option:focus-visible, .input-field:focus-visible, .protocol-toggle:focus-visible {
  outline: 3px solid var(--brand-primary);
  outline-offset: 2px;
}

/* Print stylesheet, uživatel si může plán vytisknout */
@media print {
  body {background: white;}
  #landing, #quiz, #loading, #pricingFooter, #ageBlock,
  .vit-report-toggle, .product-remove-btn, .protocol-toggle, .results-hero-badges,
  button {display: none !important;}
  .results-hero {box-shadow: none; border: 1px solid #ddd; padding: 16px;}
  .vit-report-full {display: block !important; max-height: none !important;}
  .protocol-card {break-inside: avoid; box-shadow: none; border: 1px solid #ddd;}
  .priority-card {break-inside: avoid; box-shadow: none;}
  a[href]:after {content: " (" attr(href) ")"; font-size: 10px; color: #666;}
  .priority-cards {grid-template-columns: 1fr !important;}
}

/* ============================================================================
   MOBILE AUDIT FIX BLOCK, Vít 20.5.2026
   Konsolidovaný mobile fix: touch targets ≥44px, čitelné fonty, single-column,
   bez horizontal overflow. Inspirováno GymBeam/Mixit mobile-first standardům.
   ============================================================================ */

/* === Forms, iOS Safari auto-zoom prevention (input ≥16px) === */
input[type="text"], input[type="email"], input[type="tel"], input[type="search"],
input[type="number"], textarea {
  font-size: 16px;
}

/* === KOŠÍK V3, kompletní mobile redesign === */
@media (max-width: 600px) {
  /* Header, menší logo, kruhy bez labels (kromě active), úzké čáry */
  .cv3-header {gap: 8px; padding: 10px 12px;}
  .cv3-step.active .cv3-step-label {display: inline-block; font-size: 11.5px; font-weight: 700;}

  /* Body, single column, aside pod main */

  /* Package, větší touch targets */

  /* Form fields, single column */

  /* Radio rows shipping/payment, 4-col grid, větší info button */

  /* Billing tabs, flex 1 + center */

  /* Promo box */

  /* Summary aside, full width, no sticky, no max-height scroll */

  /* Nav buttons, větší + plná šíře */
  .cv3-nav {gap: 8px; flex-wrap: wrap;}
  .cv3-nav-back {padding: 13px 18px; font-size: 13.5px;}
  .cv3-nav-next {padding: 14px 22px; font-size: 14.5px; flex: 1;}

  /* Final CTA jen v jednom místě (skryjeme duplicitu v summary boxu) */
}

/* === Q23 searchable_checkbox, chip remove + skip btn === */
.sc-chip button {min-width: 32px !important; min-height: 32px !important; width: 32px !important; height: 32px !important; font-size: 14px !important;}
.sc-skip-btn, .q-skip-btn {padding: 12px 18px;}
@media (max-width: 600px) {
  .sc-item {padding: 14px 16px;}
  .sc-chip {padding: 6px 8px 6px 12px; font-size: 13.5px;}
}

/* === Drug input (Q25) === */
@media (max-width: 600px) {
  .drug-suggestion {padding: 12px 14px;}
  .drug-suggestions {max-height: 240px;}
  .drug-chip button {padding: 6px 10px; min-width: 32px; min-height: 32px;}
}

/* === Vit summary, bez margin-left 32px na mobilu === */
@media (max-width: 600px) {
  .vit-summary {padding: 22px 16px 16px;}
  .vit-summary-head, .vit-summary-text, .vit-summary-author {margin-left: 0;}
  .vit-summary::before {left: 14px; font-size: 56px;}
}

/* === Results hero + sáček + addons === */
@media (max-width: 480px) {
  .results-hero {padding: 22px 16px 14px;}
  .sacek-wrap {max-width: 270px;}
  .sacek-img {max-height: 320px; object-fit: contain;}
  /* Vit 3.7. v2: addon karta drzi 3 sloupce i na mobilu (img | nazev+cena+Vice | Pridat) */
  .addon-content {grid-template-columns: 64px minmax(0,1fr) auto; gap: 10px;}
  .addon-image-large {width: 64px; height: 64px;}
  /* Product card v all-products */
  .product-remove-btn {width: 36px; height: 36px;}
}
@media (max-width: 380px) {
  .product-grid {grid-template-columns: 1fr;}
}

/* === All-products modal sticky bar, column flex na úzkém === */
@media (max-width: 420px) {
  .all-products-modal-stickybar {flex-direction: column; align-items: stretch; gap: 8px;}
  .apmb-info {flex-direction: row; justify-content: space-between; align-items: baseline;}
  .apmb-actions {display: grid; grid-template-columns: auto 1fr; gap: 8px;}
  .apmb-cta {width: 100%;}
}

/* === Reviews modal + all-products modal close button === */
@media (max-width: 600px) {
  .reviews-modal-close, .all-products-modal-close {width: 44px; height: 44px; font-size: 22px;}
}

/* === Quiz options, align top pro multi-line === */
.option {align-items: flex-start; line-height: 1.4;}
.option-marker {flex-shrink: 0; margin-top: 2px;}
.option-icon {flex-shrink: 0; align-self: center; margin-top: 0; line-height: 1;}
.option-icon {color: var(--brand-primary);}
.option-icon svg {display: block; width: 22px; height: 22px;}

/* === Loading screen, ultra mobile (<380) === */
@media (max-width: 380px) {
  .loading-v3-split {grid-template-columns: 1fr; gap: 16px; min-height: 0;}
  .loading-v3-box-img {max-width: 154px;}
  .loading-v3-cols {height: 220px;}
  .loading-v3-col-wrap {height: 220px;}
}

/* === Pricing CTA shipping, čitelný font === */
.pricing-cta-shipping {font-size: 11px;}

/* === Cart V3 brand confirm modal, Vít 21.5.2026 (místo confirm()) === */
.cv3-confirm-overlay.open { display: flex; }

/* Reduced motion (a11y), vypnout animace, pokud uživatel preferuje */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ========================================================================
   DOTAZNÍK LANDING V6, v rámci webu, bez fotky, krev-style barvy (Vít 21.5.2026)
   ======================================================================== */

/* HERO, centered, no image */
/* Vít 7.6.: H1 stejná jako vitaminy-na-miru (.vnm-h1) */

/* Personalizace stat, výrazný highlight (centered) */

/* Trust checks row (hero) */

/* GDPR */

/* CTA START button, Vít: do dotazníku se jde ZELENĚ (do košíku oranžově) */
.dotv2-start-btn {
  background: var(--brand-primary, #289546) !important;
  color: white !important;
  border: none;
  padding: 20px 40px;
  border-radius: 14px;
  font-size: 19px; font-weight: 800;
  cursor: pointer;
  transition: all 0.2s;
  font-family: inherit;
  box-shadow: 0 12px 32px rgba(40,149,70,0.32);
  text-decoration: none; display: inline-block;
  width: 100%; max-width: 440px;
}@media (hover: hover) and (pointer: fine){
.dotv2-start-btn:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 16px 40px rgba(40,149,70,0.45);
  background: var(--brand-primary-dark, #1f6b39) !important;
}}

/* Google badge */

/* EXPERT QUOTE Vít */
/* Vít 21.5.2026: jediný breakpoint 980px */
/* Vít 21.5.2026: jediný breakpoint 980px */

/* FEATURES SECTION */
/* Vít 21.5.2026: jediný breakpoint 980px, mobil 1 sloupec → desktop 4 sloupce */

/* BIG CTA BLOCK, premium karta s gradient pozadím (jako krev) */

/* Common */
/* Vít 6.6.: hero fajfky pod sebou + zelené */
/* Komentář Víta — blok jako krevní testy (Tomáš Vebr) */
/* Vít 7.6.: na desktopu blok jako Tomáš Vebr (foto vlevo, bublina vpravo s ocáskem) */
/* Souhlas jako 1. otázka dotazníku */
.quiz-sell { list-style: none; padding: 0; margin: 4px 0 22px; display: flex; flex-direction: column; gap: 12px; }
.quiz-sell li { display: flex; align-items: flex-start; gap: 10px; font-size: 16px; font-weight: 400; color: var(--brand-text, #1A2332); line-height: 1.45; }
.quiz-sell .qs-check { color: var(--brand-primary, #289546); font-weight: 800; font-size: 16px; line-height: 1.45; flex-shrink: 0; }
.quiz-sell .qs-check::before { content: "\2713\FE0E"; font-family: -apple-system, "system-ui", "Segoe UI", Roboto, sans-serif; }  /* ✓ jako text (ne emoji box), shodné s ckd-checks/hp-megacta */
.quiz-consent { background: var(--brand-primary-soft, #E8F5E9); border: 2px solid var(--brand-primary, #289546); border-radius: 14px; padding: 16px 18px; cursor: pointer; transition: box-shadow .18s; }@media (hover: hover) and (pointer: fine){
.quiz-consent:hover { box-shadow: 0 0 0 4px rgba(40,149,70,0.16); }}
.quiz-consent label { display: flex; gap: 14px; align-items: flex-start; cursor: pointer; font-size: 14px; color: var(--brand-text, #1A2332); line-height: 1.5; text-align: left; }
.quiz-consent input[type="checkbox"] { margin-top: 1px; flex-shrink: 0; width: 24px; height: 24px; accent-color: var(--brand-primary, #289546); cursor: pointer; }
.quiz-consent a { color: var(--brand-primary, #289546); font-weight: 700; }
.quiz-disclaimer { font-size: 11.5px; color: #9aa3ad; line-height: 1.6; margin: 26px auto 0; max-width: 760px; text-align: left; padding: 0 4px; }
.question.q-consent h2 { font-size: clamp(30px, 8vw, 40px); line-height: 1.1; letter-spacing: -0.8px; }
.question.q-consent h2 .green { color: var(--brand-primary, #289546); }
@media (min-width: 980px) { .question.q-consent h2 { font-size: clamp(40px, 4.5vw, 52px); letter-spacing: -1px; } }
/* Vít 8.6.2026: mezistránka "Zobrazit doporučení / Začít znovu" */
#recoChoice { padding: 50px 4px 30px; }
#recoChoice { min-height: calc(100vh - 150px); display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 28px 20px 40px; }
.reco-choice-card { max-width: 560px; width: 100%; text-align: center; display: flex; flex-direction: column; align-items: center; }
.reco-choice-title { font-size: clamp(26px, 7vw, 46px); font-weight: 800; line-height: 1.08; letter-spacing: -0.8px; color: var(--brand-text, #1A2332); margin: 0 0 16px; }
.reco-choice-title .green { color: var(--brand-primary, #289546); }
.reco-choice-sub { font-size: 16px; color: var(--brand-text-soft, #6B7785); line-height: 1.6; margin: 0 auto 28px; max-width: 460px; }
.reco-choice-show { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; max-width: 360px; background: var(--brand-primary, #289546); color: #fff; border: none; padding: 16px 28px; border-radius: 999px; font-weight: 800; font-size: 16px; cursor: pointer; font-family: inherit; box-shadow: 0 6px 18px rgba(40,149,70,0.28); transition: all .15s; }@media (hover: hover) and (pointer: fine){
.reco-choice-show:hover { background: var(--brand-primary-dark, #1F6336); transform: translateY(-1px); }}
.reco-choice-new { display: inline-flex; align-items: center; justify-content: center; width: 100%; max-width: 360px; margin-top: 12px; background: #fff; color: var(--brand-text, #1A2332); border: 1.5px solid var(--brand-gray-1, #E5E7EB); padding: 14px 28px; border-radius: 999px; font-weight: 700; font-size: 15px; cursor: pointer; font-family: inherit; box-shadow: 0 2px 8px rgba(0,0,0,0.05); transition: all .15s; }@media (hover: hover) and (pointer: fine){
.reco-choice-new:hover { border-color: var(--brand-gray-2, #9CA3AF); box-shadow: 0 5px 14px rgba(0,0,0,0.09); transform: translateY(-1px); }}
.quiz-lede { font-size: 15px; color: var(--brand-text-soft, #5F7268); margin: 6px 0 20px; line-height: 1.5; }
.quiz-lede strong { color: var(--brand-text, #1A2332); font-weight: 800; }
.quiz-lede strong.green { color: var(--brand-primary, #289546); }

/* === Product modal v2 (Vít 9.6.) === */
.pm-photo{width:100%;display:flex;justify-content:center;margin-bottom:12px;}
.pm-photo img{width:205px;height:205px;border-radius:16px;object-fit:cover;box-shadow:0 6px 18px rgba(0,0,0,0.10);}
.pm-cat{font-size:11px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--brand-warm);text-align:center;margin-bottom:4px;}
.pm-titlerow{display:flex;align-items:baseline;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:2px;}
.pm-name{margin:0;font-size:23px;font-weight:800;color:var(--brand-text);line-height:1.15;}
.pm-price{font-weight:700;font-size:16px;color:var(--brand-primary);white-space:nowrap;}
.pm-meta{text-align:center;font-size:13.5px;color:var(--brand-text-soft);margin:8px 0 12px;}
.pm-meta strong{color:var(--brand-text);}
.pm-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:12px;}
.pm-badge{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;padding:6px 12px;border-radius:999px;}
.pm-badge svg{width:15px;height:15px;}
.pm-badge.vegan{background:var(--brand-primary);color:#fff;}
.pm-badge.evidence{background:var(--brand-warm);color:#fff;}
.pm-badge.cz{background:#EAF1FB;color:#2B5FA8;}
.pm-badge.evidence-mid{background:#FFE6C7;color:#8E5208;}
.pm-badge.evidence-trad{background:#EFE5D4;color:#6E4520;}
.pm-etiketa{margin:0;text-align:left;}
.pm-footer{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 16px;margin-top:16px;}
.pm-footer-link{font-size:13px;font-weight:700;color:var(--brand-primary);text-decoration:none;white-space:nowrap;}
.pm-etiketa[open]{flex-basis:100%;}
.pm-etiketa summary{cursor:pointer;color:var(--brand-primary);font-weight:700;font-size:13px;list-style:none;display:inline-flex;align-items:center;gap:6px;}
.pm-etiketa summary::-webkit-details-marker{display:none;}
.pm-etiketa[open] summary{margin-bottom:10px;}
.pm-etiketa-body{text-align:left;font-size:12.5px;line-height:1.5;background:var(--brand-cream);border-radius:10px;padding:12px 14px;}
.pm-etiketa-body h2{font-size:16px;font-weight:800;letter-spacing:-0.2px;color:var(--brand-text);margin:0 0 6px;}
.pm-etiketa-body h3{font-size:13.5px;font-weight:800;color:var(--brand-text);margin:14px 0 5px;}
.pm-etiketa-body p{font-size:12.5px;line-height:1.55;color:var(--brand-text-medium);margin:0 0 8px;}
.pm-etiketa-body p:last-child{margin-bottom:0;}
.pm-etiketa-body .vc-mark{color:var(--brand-primary);font-weight:800;}
.pm-etiketa-body .etiketa-table-wrap{margin:0 0 12px;}
.pm-etiketa-body .etiketa-table{border-collapse:collapse;background:#fff;border:1px solid var(--brand-gray-1,#E6E6E6);border-radius:10px;overflow:hidden;width:100%;margin:0;}
.pm-etiketa-body .etiketa-table thead th{background:var(--brand-primary-soft);font-weight:700;font-size:12px;color:var(--brand-text);padding:8px 10px;text-align:left;border-bottom:2px solid var(--brand-gray-1,#E6E6E6);}
.pm-etiketa-body .etiketa-table tbody td{padding:8px 10px;font-size:12.5px;color:var(--brand-text-medium);border-bottom:1px solid var(--brand-gray-1,#E6E6E6);}
.pm-etiketa-body .etiketa-table tbody tr:last-child td{border-bottom:none;}
.pm-etiketa-body .etiketa-table .col-name{text-align:left;width:48%;}
.pm-etiketa-body .etiketa-table .col-dose{text-align:right;width:26%;font-variant-numeric:tabular-nums;}
.pm-etiketa-body .etiketa-table .col-rhp{text-align:right;width:26%;font-size:12px;color:var(--brand-text-soft);font-variant-numeric:tabular-nums;}
.pm-etiketa-body .etiketa-note{font-size:11.5px;color:var(--brand-text-soft);margin:8px 0 0;font-style:italic;}
.pm-lede{font-size:14px;line-height:1.6;color:var(--brand-text);margin:0 0 12px;}
.pm-lede b{color:var(--brand-text);font-weight:800;}
.pm-callout{background:var(--brand-cream);border-left:4px solid var(--brand-warm);border-radius:10px;padding:12px 14px;font-size:13.5px;line-height:1.5;color:var(--brand-text);margin:0 0 16px;}
.pm-callout b{font-weight:800;}
.pm-benefits{background:var(--brand-primary-soft);border-radius:22px;padding:28px 22px;display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:0 0 6px;}
.pm-benefit{display:flex;align-items:center;gap:12px;color:var(--brand-text);min-width:0;}
.pm-benefit-ico{flex-shrink:0;width:56px;height:56px;display:inline-flex;align-items:center;justify-content:center;background:#fff;border-radius:999px;box-shadow:0 4px 12px rgba(31,58,44,0.08);}
.pm-benefit-ico img{width:34px;height:34px;display:block;object-fit:contain;}
.pm-benefit > div{display:flex;flex-direction:column;line-height:1.3;min-width:0;}
.pm-benefit > div strong{display:block;font-size:15px;font-weight:800;color:var(--brand-text);}
.pm-benefit > div span{font-size:12.5px;font-weight:500;color:var(--brand-text-medium);line-height:1.3;display:block;margin-top:2px;}
.pm-overlay{padding:30px 16px;}
.pm-card{padding:22px 22px 26px;}
@media(max-width:520px){.pm-benefits{grid-template-columns:1fr;}}
@media(max-width:480px){
  .pm-overlay{padding:14px 8px;}
  .pm-card{padding:18px 15px 22px;}
  .pm-photo img{width:225px;height:225px;}
  .pm-name{font-size:21px;}
  .pm-benefits{padding:18px 16px;gap:14px;border-radius:16px;}
  .pm-benefit-ico{width:50px;height:50px;}
  .pm-benefit-ico img{width:30px;height:30px;}
}

.why-list { list-style: none; margin: 8px 0 4px; padding: 0; }
.why-list li { position: relative; padding-left: 18px; font-size: 13px; line-height: 1.5; margin-bottom: 3px; color: var(--brand-text-soft, #6B7785); }
.why-list li::before { content: "\2713\FE0E"; font-family: -apple-system, "system-ui", "Segoe UI", Roboto, sans-serif; position: absolute; left: 0; top: 0; color: var(--brand-primary, #289546); font-weight: 800; font-size: 14px; line-height: 1.5; } /* Vit 21.7.: brandová textová fajfka (mujvit-design sekce 21), ne kreslená z borderů */
.why-list li.why-key { color: var(--brand-text, #1A2332); }


/* ===== Srovnávací tabulka „Proč zvolit Mujvit" (převzato z homepage, Vít 15.6.2026) ===== */
.cmp-section { margin: 26px auto; max-width: 960px; background:#fff; border-radius:20px; padding:34px 20px 30px; box-shadow:0 6px 22px rgba(0,0,0,0.05); }
.cmp-section .rr-eyebrow { display:block; text-align:center; }
.cmp-section .why-us-title { margin-top: 4px; }
.compare-wrap { overflow: visible; padding: 22px 0; }
.compare-table {
  position: relative; width: 100%; max-width: 860px; margin: 0 auto;
  border: 1px solid var(--brand-gray-1); border-radius: 14px;
}
.cmp-highlight {
  position: absolute; left: 26%; width: 27%; top: -14px; bottom: -12px;
  background: var(--brand-primary-soft); border-radius: 16px;
  box-shadow: 0 12px 28px rgba(40,149,70,0.20); z-index: 0;
}
.cmp-row { display: grid; grid-template-columns: 26% 27% 23.5% 23.5%; }
.cmp-cell { min-width: 0; }
.cmp-row:not(:last-child) .cmp-cell { border-bottom: 1px solid var(--brand-gray-1); }
.cmp-cell {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; padding: 12px 7px; text-align: center;
  font-size: 11px; line-height: 1.34; color: var(--brand-text-soft);
}
.cmp-label {
  align-items: flex-start; text-align: left;
  font-weight: 700; color: var(--brand-text); font-size: 11.5px;
}
/* Vit 3.7. v2: mobil - plovouci zeleny pruh PRYC, zvyrazneni primo v Mujvit bunkach */
@media (max-width: 560px) {
  .cmp-highlight { display: none; }
  .cmp-row { grid-template-columns: 29% 31% 20% 20%; }
  .cmp-cell { padding: 12px 4px; font-size: 10.5px; gap: 5px; overflow-wrap: break-word; }
  .cmp-cell.cmp-mujvit { background: var(--brand-primary-soft); font-size: 11.5px; }
  .cmp-head .cmp-cell.cmp-mujvit { border-radius: 14px 14px 0 0; }
  .cmp-row:last-child .cmp-cell.cmp-mujvit { border-radius: 0 0 14px 14px; }
  .cmp-label { font-size: 12px; padding-left: 8px; }
}
.cmp-cell.cmp-mujvit { color: var(--brand-text-medium); font-weight: 600; }
.cmp-head .cmp-cell { padding: 13px 7px 15px; gap: 7px; }
.cmp-name { font-size: 11.5px; font-weight: 800; color: var(--brand-text); line-height: 1.2; }
.cmp-head .cmp-mujvit .cmp-name { color: var(--brand-primary); font-size: 14px; }
.cmp-logo { height: 22px; width: auto; display: block; }
.cmp-head-ico { color: var(--brand-gray-2); }
.cmp-head-ico svg { width: 22px; height: 22px; display: block; }
.cmp-yes, .cmp-no, .cmp-na {
  width: 20px; height: 20px; border-radius: 50%; display: inline-flex;
  align-items: center; justify-content: center; font-size: 10px; font-weight: 800; flex-shrink: 0;
}
.cmp-yes { background: var(--brand-primary); color: #fff; box-shadow: 0 2px 6px rgba(40,149,70,0.28); font-family: -apple-system, "system-ui", "Segoe UI", Roboto, sans-serif; }
.cmp-no, .cmp-na { background: #fff; color: var(--brand-gray-2); border: 1.5px solid var(--brand-gray-1); }
@media (min-width: 980px) {
  .compare-wrap { padding: 24px 0; }
  .compare-table { border-radius: 16px; }
  .cmp-highlight { left: 28%; width: 24%; top: -18px; bottom: -16px; border-radius: 16px; }
  .cmp-row { grid-template-columns: 28% 24% 24% 24%; }
  .cmp-cell { gap: 7px; padding: 15px 12px; font-size: 12.5px; line-height: 1.4; }
  .cmp-label { font-size: 13px; }
  .cmp-head .cmp-cell { padding: 16px 12px 18px; gap: 8px; }
  .cmp-name { font-size: 13.5px; }
  .cmp-head .cmp-mujvit .cmp-name { font-size: 18px; }
  .cmp-logo { height: 28px; }
  .cmp-head-ico svg { width: 26px; height: 26px; }
  .cmp-yes, .cmp-no, .cmp-na { width: 22px; height: 22px; font-size: 11px; }
}
/* Vit 23.7.: nejmensi telefony - zmensit text + tvrde zalomeni dlouhych slov (vstrebatelnost). Do 419px, >=420 beze zmeny. */
@media (max-width: 450px) {
  .cmp-row { grid-template-columns: 31% 29% 20% 20%; }
  .cmp-cell { font-size: 9.2px; padding: 11px 3px; gap: 4px; hyphens: auto; overflow-wrap: anywhere; word-break: break-word; }
  .cmp-cell.cmp-mujvit { font-size: 10px; }
  .cmp-label { font-size: 10px; padding-left: 6px; }
  .cmp-name { font-size: 9.5px; }
  .cmp-head .cmp-mujvit .cmp-name { font-size: 12px; }
  .cmp-yes, .cmp-no, .cmp-na { width: 18px; height: 18px; font-size: 9px; }
}


/* ===== Balíček v hero (krabička se složením + sáček), Vít 15.6.2026 ===== */
.balicek-wrap {
  position: relative; align-self: center;
  max-width: 400px; width: 100%; padding: 0;
  container-type: inline-size;
  /* Vít 15.6.2026: na mobilu text NAD fotkou (DOM pořadí text→fotka) */
  font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif; /* Vít 15.6.2026: overlay text v Poppins */
}
.balicek-img {
  width: 100%; height: auto; display: block;
}
/* Vít 15.6.2026: hero = reálná fotka ruky se sáčkem; jediný overlay = jméno na štítku (1. pád) */
.balicek-wrap .sk-name {
  position: absolute; top: 23%; left: 63%;
  transform: translate(-50%, -50%);
  font-weight: 800; font-size: 6cqw; line-height: 1;
  color: #1A2332; white-space: nowrap;
}
@media (min-width: 980px) {
  .balicek-wrap { max-width: 425px; } /* desktop: fotka vpravo (DOM pořadí + row) */
}


/* ===== Google hodnocení v hero (styl homepage), Vít 15.6.2026 ===== */
.results-hero-text .hp-hero-google {
  display: inline-flex; align-items: center; gap: 7px;
  text-decoration: none; color: var(--brand-text-soft);
  padding: 5px 9px; margin: 14px 0 0 -9px; border-radius: 8px;
  transition: background 0.15s; cursor: pointer;
  font-size: 14.5px; font-weight: 500; line-height: 1;
}@media (hover: hover) and (pointer: fine){
.results-hero-text .hp-hero-google:hover { background: var(--brand-gray-1); }}
.results-hero-text .hp-hero-google .g-ico { flex-shrink: 0; }
.results-hero-text .hp-hero-google .stars { color: #FBBC04; letter-spacing: -1px; font-size: 16px; }
.results-hero-text .hp-hero-google b { color: var(--brand-text); font-weight: 700; }


/* ===== Hero fajfky na výsledkové (Vít 15.6.2026) ===== */
.results-hero-points {
  list-style: none; margin: 14px 0 0; padding: 0;
  display: grid; grid-template-columns: 1fr 1fr; column-gap: 18px; row-gap: 9px;
}
.results-hero-points li {
  position: relative; padding-left: 26px;
  font-size: 15px; line-height: 1.35; font-weight: 500;
  color: var(--brand-text);
}
.results-hero-points li strong { font-weight: 700; }
/* Vít 16.6.: na PC 4 body do 2 sloupců (2×2) */
@media (min-width: 980px) {
  .results-hero-points { grid-template-columns: repeat(2, max-content); column-gap: 40px; row-gap: 10px; }
}
.results-hero-points li::before {
  content: "\2713\FE0E"; font-family: -apple-system, "system-ui", "Segoe UI", Roboto, sans-serif; position: absolute; left: 0; top: 0;
  color: var(--brand-primary); font-weight: 800; font-size: 16px; line-height: 1.35;
}


/* Vít 16.6.: blok „Co obsahuje balíček" */
.pkg-content { max-width: 620px; margin: 36px auto 18px; padding: 30px 26px 28px; background: linear-gradient(165deg, #F2F9F4 0%, #FBF6EC 100%); border-radius: 20px; border: 1px solid #E4EFE7; text-align: center; }
.pkg-content-sub { margin: 6px auto 18px; max-width: 520px; color: var(--brand-text-soft); font-size: 14.5px; line-height: 1.55; }
.pkg-content-imgwrap { display: flex; justify-content: center; }
.pkg-content-img { width: 100%; max-width: 400px; height: auto; display: block; }

/* Vít 16.6.2026: čistý copy/paste — akční a dekorativní prvky se nekopírují (jinak se slepí např. „ZinekSilná evidence", „...Přidat") */
.faq-q-icon,
.cmp-yes, .cmp-no, .cmp-head-ico,
.product-card-more, .addon-add-btn, .product-remove-btn,
.rr-more, .pricing-cta, .pricing-option,
.all-products-cta, .vit-report-toggle {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}