<style>
/* ===============================
   Betaglukan ELITE – CSS pro Shoptet
   Plná verze včetně FAQ a hodnocení
   =============================== */

/* Základní typografie a obal */
#elite-betaglukan { font-size:14px; }
#elite-betaglukan h1, #elite-betaglukan .hero-title { font-size:34px; line-height:1.25; }
#elite-betaglukan h2 { font-size:24px; line-height:1.3; }
#elite-betaglukan h3 { font-size:18px; line-height:1.35; }

/* ===== HERO editorial ===== */
.hero-editorial {
  position: relative;
  padding: 16px;
  border-radius: 16px;
  background: none;
}

.hero-ed-card {
  border:1px solid #e6e6e6;
  border-radius:16px;
  background: linear-gradient(180deg, #f7f7f7 0%, #f3f3f3 100%);
  padding:20px 22px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
}

.hero-ed-grid {
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:28px;
  align-items:center;
}

.hero-eyebrow {
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#6b7280;
  margin-bottom:6px;
}

.hero-title {
  font-size:34px;
  line-height:1.25;
  margin:4px 0 8px;
  font-weight:700;
}

.hero-accent { color:#0ea5e9; }

.hero-lead {
  color:#374151;
  margin:0 0 10px;
  max-width:60ch;
}

.hero-facts {
  display:flex;
  flex-wrap:wrap;
  gap:10px 16px;
  padding:0;
  margin:0 0 12px;
  list-style:none;
}

.hero-facts li {
  background:#eef6ff;
  color:#0b63a3;
  padding:6px 10px;
  border-radius:999px;
  font-size:13px;
}

/* CTA */
.cta-primary {
  display:inline-block;
  background:#0ea5e9;
  color:#fff;
  padding:10px 14px;
  border-radius:10px;
  font-weight:600;
  text-decoration:none;
  transition: background 0.3s ease;
}
.cta-primary:hover { background:#0284c7; }
.cta-link {
  color:#0ea5e9;
  text-decoration:underline;
  margin-left:12px;
}
.hero-cta {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  margin:10px 0 8px;
}

/* Obrázek v hero menší o cca 30 % */
.hero-ed-media .hero-img {
  max-width:70%;
  width:70%;
  height:auto;
  object-fit:contain;
}

/* Textový blok – vycentrování */
.hero-ed-text {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  align-self:center;
  justify-self:center;
  text-align:left;
}

.hero-ed-media {
  margin:0;
  text-align:right;
  align-self:center;
}

.hero-img { display:block; margin-left:auto; }
.elite-uniform { border-radius:14px; }

/* ===== Ostatní sekce ===== */
.elite-section { margin:28px 0; }
.elite-grid { display:grid; gap:20px; }
.elite-two-col { grid-template-columns: 1fr 1fr; }
.elite-col-3 { grid-template-columns: repeat(3, 1fr); }
.elite-card {
  border:1px solid #e5e7eb;
  border-radius:12px;
  background:#fff;
  padding:18px 20px;
}
.elite-table { width:100%; border-collapse:collapse; }
.elite-table th, .elite-table td { padding:8px 10px; border-bottom:1px solid #f0f0f0; text-align:left; }
.elite-compare-img { width:100%; height:auto; display:block; }
.elite-badges { display:flex; gap:10px; flex-wrap:wrap; }
.elite-badge { background:#f3f4f6; border-radius:999px; padding:6px 10px; font-size:12px; }
.elite-small { font-size:12px; }
.elite-muted { color:#6b7280; }
.elite-mt-xs { margin-top:8px; }
.elite-divider { height:1px; background:#eef2f7; margin:12px 0; }
.elite-list { padding-left:18px; margin:0; }
.elite-list li { margin:6px 0; }
.elite-kicker { font-size:12px; color:#0ea5e9; letter-spacing:.06em; text-transform:uppercase; display:inline-block; margin-bottom:6px; }

/* ===== FAQ – šipky + hover + zvýraznění boxu ===== */
.faq-list details {
  border:1px solid #e5e7eb;
  border-radius:10px;
  padding:10px 12px;
  background:#fff;
  margin-bottom:10px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* zvýraznění boxu při najetí */
.faq-list details:hover {
  border-color:#bae6fd;
  box-shadow:0 0 0 3px rgba(14,165,233,0.08);
}

.faq-list summary {
  cursor:pointer;
  font-weight:600;
  position:relative;
  padding-right:22px;
  color:#374151;
  transition:color 0.2s ease;
}

/* šipka dolů */
.faq-list summary::after {
  content:"▼";
  position:absolute;
  right:6px;
  top:50%;
  transform:translateY(-50%);
  font-size:12px;
  color:#6b7280;
  transition:transform 0.2s ease, color 0.2s ease;
}

/* modré zvýraznění při hoveru */
.faq-list summary:hover {
  color:#0ea5e9;
}
.faq-list summary:hover::after {
  color:#0ea5e9;
}

/* otočení šipky při rozbalení */
.faq-list details[open] summary::after {
  transform:translateY(-50%) rotate(180deg);
}

/* odpověď */
.faq-a {
  margin-top:8px;
  color:#374151;
  line-height:1.45;
  font-size:14px;
}

/* ===== Sekce Hodnocení ===== */
#elite-reviews h2 { text-align:left; margin-bottom:16px; }

.elite-review {
  border:1px solid #eef2f7;
  border-radius:12px;
  padding:14px 16px 16px;
  background:#fafcff;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transition:box-shadow 0.2s ease, border-color 0.2s ease;
}

/* efekt při hoveru (jemné zvýraznění recenze) */
.elite-review:hover {
  border-color:#bae6fd;
  box-shadow:0 0 0 3px rgba(14,165,233,0.08);
}

/* text recenze */
.elite-review p {
  font-style:italic;
  margin-bottom:8px;
  color:#111827;
  line-height:1.45;
}

/* hvězdičky */
.elite-stars {
  color:#fbbf24; /* zlatá */
  font-size:16px;
  letter-spacing:2px;
  margin:4px 0 6px;
  user-select:none;
}

/* jméno */
.elite-review .elite-small {
  color:#6b7280;
  margin-top:auto;
}

/* ===== Sekce Srovnání ===== */
#elite-compare h2 { text-align:left; margin:0 0 12px 0; }

.elite-compare-head-img th {
  border-bottom:none;
  padding-bottom:12px;
  overflow:hidden;
}

.elite-compare-figure {
  display:block;
  margin:0;
  text-align:center;
  overflow:hidden;
}

.elite-compare-figure img {
  width:95%;
  max-width:300px;
  max-height:160px;
  height:auto;
  object-fit:contain;
  display:inline-block;
}

.elite-compare-head-cap th {
  text-align:center;
  border-top:none;
  border-bottom:1px solid #f0f0f0;
  padding-top:6px;
  padding-bottom:12px;
  overflow:hidden;
}
.elite-compare-cap { font-weight:600; text-align:center; }

.elite-compare--centered thead th:first-child,
.elite-compare--centered tbody td:first-child {
  text-align:left;
  vertical-align:middle;
}

.elite-compare--centered thead th:nth-child(2),
.elite-compare--centered thead th:nth-child(3),
.elite-compare--centered tbody td:nth-child(2),
.elite-compare--centered tbody td:nth-child(3) {
  text-align:center;
  vertical-align:middle;
}

/* Moderní SVG ikonky */
.elite-icon {
  display:inline-block;
  width:1.05em;
  height:1.05em;
  margin-right:8px;
  vertical-align:-2px;
  background-color:currentColor;
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-position:center;
  -webkit-mask-size:contain;
  mask-repeat:no-repeat;
  mask-position:center;
  mask-size:contain;
}
.elite-icon--check {
  color:#16a34a;
  -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>');
  mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>');
}
.elite-icon--cross {
  color:#dc2626;
  -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M18.3 5.71 12 12.01l-6.29-6.3-1.41 1.42 6.29 6.29-6.3 6.29 1.42 1.41 6.29-6.29 6.29 6.3 1.41-1.42-6.29-6.29 6.3-6.29z"/></svg>');
  mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M18.3 5.71 12 12.01l-6.29-6.3-1.41 1.42 6.29 6.29-6.3 6.29 1.42 1.41 6.29-6.29 6.29 6.3 1.41-1.42-6.29-6.29 6.3-6.29z"/></svg>');
}

/* ===== Responsivita ===== */
@media (max-width: 900px) {
  .hero-ed-grid { grid-template-columns: 1fr; }
  .hero-ed-media { text-align:center; }
  .hero-img { margin: 0 auto; width:80%; max-width:80%; }
  .elite-two-col { grid-template-columns: 1fr; }
  .elite-col-3 { grid-template-columns: 1fr; }
  .elite-compare-figure img { max-height:120px; width:90%; }
}
</style>
