#sidebar{
	display: none;
}
#maincontent{
	width: 100%;
    max-width: 1100px;
}
h2{
	margin-top: 50px;
}
/*
  HANADENT – dentální hygiena | layout CSS
  Přidejte ZA existující stylesheet webu.
  Pouze nové komponenty – žádné přepisování existujících stylů webu.
  ----------------------------------------------------------------- */

/* ── TOP CTA BANNER ──────────────────────────────────────────── */
.dh-cta-top {
  background: #7cc235;
  color: #fff;
  padding: 30px;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 4rem;
}
.dh-cta-top__msg        { flex: 1; min-width: 200px; }
.dh-cta-top__msg strong { display: block; font-size: 2.25rem; margin-bottom: 2rem; color: #fff; }
.dh-cta-top__msg span   {  }
.dh-cta-top__contacts   { display: flex; flex-direction: column; gap: 6px; align-items: flex-end; }
.dh-cta-top__tel  { color: #fff !important; font-weight: 700; font-size: 1.25em;
                    text-decoration: none !important; white-space: nowrap; }
.dh-cta-top__mail { color: rgba(255,255,255,.9) !important; 
                    text-decoration: none !important; }



/* ── SEKCE spacing ───────────────────────────────────────────── */
.dh-section      { margin-bottom: 36px; }
.dh-section__sub { margin: 0 0 16px; }

/* ── VÝHODY – grid karet ─────────────────────────────────────── */
.dh-benefits {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
  margin-top: 16px;
}
.dh-benefit {
  border: 1px solid #dde8d0;
  padding: 16px 14px;
  background: #f9fbf6;
}
.dh-benefit__icon  { font-size: 1.6rem; line-height: 1; margin-bottom: 8px; }
.dh-benefit__title { font-weight: 700; margin-bottom: 6px; }
.dh-benefit__text  {  margin: 0; }

/* ── KROKY – grid ────────────────────────────────────────────── */
.dh-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 14px;
  margin-top: 16px;
}
.dh-step {
  border: 1px solid #dde8d0;
  padding: 16px 14px;
}
.dh-step__num {
  width: 40px; height: 40px; border-radius: 50%;
  background: #7cc235; color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 1em;
  margin-bottom: 10px;
}
.dh-step__title { font-weight: 700; margin-bottom: 5px; }
.dh-step__text  {  margin: 0; }

/* ── TÝM – flex karet vedle sebe ────────────────────────────── */
.dh-team {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 16px;
}
.dh-team-card {
  flex: 1;
  min-width: 180px;
  max-width: 300px;
  border: 1px solid #ddd;
  overflow: hidden;
}
.dh-team-card--hl   { border-top: 3px solid #7cc235; }
.dh-team-card img   { width: 100%; display: block; }
.dh-team-card__placeholder {
  width: 100%; aspect-ratio: 1/1; background: #f2f8ea;
  display: flex; align-items: center; justify-content: center; font-size: 2.5rem;
}
.dh-team-card__body { padding: 14px; }
.dh-team-card__name { font-weight: 700; margin-bottom: 2px; }
.dh-team-card__role { font-size: .85em; color: #5fa020; font-weight: 600;
                      text-transform: uppercase; letter-spacing: .04em; margin-bottom: 8px; }
.dh-team-card__text {  margin: 0; font-size: .9em; }

/* ── CENÍK – tabulka ─────────────────────────────────────────── */
.dh-pricing-table           { width: 100%; border-collapse: collapse; margin-top: 12px; border: 1px solid #dde8d0; }
.dh-pricing-table th        { background: #7cc235; color: #fff; padding: 10px 14px;
                              text-align: left; text-transform: uppercase; }
.dh-pricing-table th:last-child { text-align: right; }
.dh-pricing-table td        { padding: 10px 14px; border-bottom: 1px solid #dde8d0; vertical-align: top; }
.dh-pricing-table td:last-child { text-align: right; font-weight: 700; color: #5fa020; white-space: nowrap; }
.dh-pricing-table tr:last-child td { border-bottom: none; }
.dh-insurance {
  margin-top: 12px; padding: 20px; 
  background: #f2f8ea; border-left: 4px solid #7cc235;
}

/* ── RECENZE – grid ──────────────────────────────────────────── */
.dh-reviews {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
  margin-top: 16px;
}
.dh-review {
  border: 1px solid #dde8d0;
  padding: 18px 16px;
}
.dh-review__stars  { color: #e8a000; margin-bottom: 10px; }
.dh-review__text   { font-style: italic; margin: 0 0 10px; font-size: .9em; }
.dh-review__author { font-weight: 700; font-size: .9em; }

/* ── FAQ – accordion ─────────────────────────────────────────── */
.dh-faq        { margin-top: 16px; }
.dh-faq-item   { border: 1px solid #dde8d0;  margin-bottom: 6px; overflow: hidden; }
.dh-faq-item__q {
  width: 100%; background: #fff; border: none; text-align: left;
  padding: 20px 40px 20px 20px; font-weight: 600; cursor: pointer;
  position: relative; 
  font-family: inherit; color: inherit;
}
.dh-faq-item__q:hover { background: #f9fbf6; }
.dh-faq-item__q::after {
  content: '+'; position: absolute; right: 14px; top: 50%;
  transform: translateY(-50%); font-size: 2.5rem; color: #7cc235; font-weight: 400;
  transition: transform .2s;
}
.dh-faq-item.open .dh-faq-item__q::after { transform: translateY(-50%) rotate(45deg); }
.dh-faq-item__a {
  max-height: 0; overflow: hidden;
  transition: max-height .3s ease, padding .3s;
  padding: 0 20px; 
}
.dh-faq-item.open .dh-faq-item__a { max-height: 400px; padding: 20px; }

/* ── SPODNÍ CTA ───────────────────────────────────────────────── */
.dh-cta-bottom {
  background: #f2f8ea; border-left: 4px solid #7cc235;
   padding: 30px; margin-top: 32px;
}
.dh-cta-bottom h2{
	margin-top: 1rem;
}
.dh-cta-bottom__tel {
  font-size: 1.3rem; font-weight: 700; color: #5fa020 !important;
  text-decoration: none !important; display: inline-block; margin: 6px 8px 4px 0;
}

/* ── RESPONSIVE ───────────────────────────────────────────────── */
@media (max-width: 580px) {
  .dh-cta-top             { flex-direction: column; }
  .dh-cta-top__contacts   { align-items: flex-start; }
  .dh-benefits,
  .dh-steps               { grid-template-columns: 1fr 1fr; }
  .dh-team-card           { min-width: 140px; }
  .dh-reviews             { grid-template-columns: 1fr; }
}
@media (max-width: 380px) {
  .dh-benefits,
  .dh-steps               { grid-template-columns: 1fr; }
}