/* blog-vypis.css — redesign výpisu blogu „Poradna Dreamy“ (/blog/ a rubriky)
 * Blok .dbv staví blog-vypis.js z originálního výpisu Shoptetu.
 * Dreamy, 2026-10-30 (návrh, zatím nenasazeno)
 */
.dbv-done .sectionDescription,
.dbv-done .subcategories,
.dbv-done #articlesListHeading,
.dbv-done #newsWrapper { display: none !important; }

.dbv {
  --dbv-teal: #01928D;
  --dbv-teal-bg: #E8F6F5;
  --dbv-pink: #D90074;
  --dbv-pink-bg: #FDEFF6;
  --dbv-ink: #1d1d1f;
  --dbv-muted: #5f6368;
  --dbv-line: #ece6ea;
  color: var(--dbv-ink);
  font-family: inherit;
  margin: 0 0 32px;
}
.dbv *, .dbv *::before, .dbv *::after { box-sizing: border-box; }

/* hlavička */
.dbv__head { padding: 8px 0 28px; border-bottom: 1px solid var(--dbv-line); margin-bottom: 32px; }
.dbv__eyebrow {
  display: inline-block; margin-bottom: 10px;
  font-size: 13px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--dbv-pink);
}
.dbv .dbv__title {
  margin: 0; padding: 0; font-family: inherit; font-size: 40px; line-height: 1.15; font-weight: 400;
  color: var(--dbv-ink); text-align: left; text-transform: none; letter-spacing: -.01em;
}
.dbv__sub { margin: 12px 0 0; max-width: 640px; font-size: 17px; line-height: 1.55; font-weight: 300; color: var(--dbv-muted); }

.dbv__chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.dbv .dbv__chip {
  display: inline-flex; align-items: center; padding: 9px 16px; border-radius: 999px;
  font-size: 14px; font-weight: 500; line-height: 1.2; text-decoration: none;
  color: var(--dbv-ink); background: #fff; border: 1px solid var(--dbv-line);
  transition: border-color .2s, color .2s, background .2s;
}
.dbv .dbv__chip:hover { color: var(--dbv-teal); border-color: var(--dbv-teal); text-decoration: none; }
.dbv .dbv__chip.is-active { color: #fff; background: var(--dbv-teal); border-color: var(--dbv-teal); }

/* sekce */
.dbv__sec { margin-bottom: 44px; }
.dbv .dbv__h2 {
  margin: 0 0 18px; padding: 0; font-family: inherit; font-size: 22px; line-height: 1.3; font-weight: 500;
  color: var(--dbv-ink); text-align: left; text-transform: none;
}

/* karta (společné) */
.dbv .dbv__card {
  display: flex; flex-direction: column; background: #fff; border-radius: 14px; overflow: hidden;
  color: inherit; text-decoration: none;
  box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.05);
  transition: transform .25s, box-shadow .25s;
}
.dbv .dbv__card:hover { color: inherit; text-decoration: none; transform: translateY(-4px);
  box-shadow: 0 2px 4px rgba(0,0,0,.05), 0 12px 28px rgba(0,0,0,.09); }
.dbv .dbv__card:focus-visible { outline: 2px solid var(--dbv-teal); outline-offset: 3px; }
.dbv__img { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: #f1ecef; }
.dbv__img img { display: block; width: 100% !important; height: 100% !important; max-width: none; object-fit: cover; border-radius: 0; transition: transform .6s; }
.dbv__card:hover .dbv__img img { transform: scale(1.04); }
.dbv__img--empty {
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--dbv-pink-bg) 0%, var(--dbv-teal-bg) 100%);
}
.dbv__img--empty span { font-size: 15px; font-weight: 500; color: var(--dbv-teal); letter-spacing: .02em; }
.dbv__body { display: flex; flex-direction: column; flex: 1; padding: 20px 22px 22px; }
.dbv__tag {
  align-self: flex-start; margin-bottom: 12px; padding: 4px 10px; border-radius: 999px;
  font-size: 12px; font-weight: 500; line-height: 1.4; color: var(--dbv-teal); background: var(--dbv-teal-bg);
}
.dbv .dbv__h {
  margin: 0 0 8px; padding: 0; font-family: inherit; font-size: 20px; line-height: 1.3; font-weight: 500;
  color: var(--dbv-ink); text-align: left; text-transform: none;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.dbv .dbv__p {
  margin: 0; padding: 0; font-size: 15px; line-height: 1.6; font-weight: 300; color: var(--dbv-muted);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.dbv__foot { margin-top: auto; padding-top: 18px; display: flex; justify-content: space-between; align-items: center; font-size: 14px; }
.dbv__meta { color: #8a8f94; }
.dbv__more { color: var(--dbv-teal); font-weight: 500; }
.dbv__more::after { content: " \2192"; display: inline-block; transition: transform .2s; }
.dbv__card:hover .dbv__more::after { transform: translateX(4px); }

/* doporučené: velká karta + 2 menší */
.dbv__feat { display: grid; grid-template-columns: 1.55fr 1fr; gap: 24px; }
.dbv__feat-side { display: grid; grid-template-rows: 1fr 1fr; gap: 24px; align-content: stretch; }
.dbv .dbv__card--big .dbv__img { aspect-ratio: auto; flex: 1 1 auto; min-height: 320px; }
.dbv .dbv__card--big .dbv__img img { position: absolute; inset: 0; }
.dbv .dbv__card--big .dbv__body { flex: 0 0 auto; }
.dbv .dbv__card--big .dbv__h { font-size: 28px; line-height: 1.25; }
.dbv .dbv__card--big .dbv__p { font-size: 16px; -webkit-line-clamp: 4; }
.dbv .dbv__card--side .dbv__img { aspect-ratio: 16 / 8; }
.dbv .dbv__card--side .dbv__body { padding: 16px 20px 18px; }
.dbv .dbv__card--side .dbv__h { font-size: 18px; -webkit-line-clamp: 2; }
.dbv .dbv__card--side .dbv__p { -webkit-line-clamp: 2; font-size: 14px; }
.dbv .dbv__card--side .dbv__foot { padding-top: 12px; }

/* mřížka */
.dbv__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }

/* výzva */
.dbv__cta {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  margin: 8px 0 40px; padding: 28px 32px; border-radius: 16px; background: #FFF7FB; border: 1px solid #f6dbe9;
}
.dbv__cta strong { display: block; margin-bottom: 4px; font-size: 20px; font-weight: 500; }
.dbv__cta p { margin: 0; font-size: 15px; font-weight: 300; color: var(--dbv-muted); }
.dbv__cta-btns { display: flex; gap: 12px; flex: none; }
.dbv .dbv__btn {
  display: inline-block; padding: 12px 20px; border-radius: 10px; font-size: 15px; font-weight: 500; text-decoration: none;
  color: #fff; background: var(--dbv-teal); border: 1px solid var(--dbv-teal);
}
.dbv .dbv__btn:hover { color: #fff; text-decoration: none; filter: brightness(.95); }
.dbv .dbv__btn--ghost { color: var(--dbv-teal); background: #fff; }
.dbv .dbv__btn--ghost:hover { color: var(--dbv-teal); }

/* v=2: další články přes tlačítko, stránkování na 1. straně skryté */
.dbv .dbv__card--hidden { display: none !important; }
.dbv-all .listingControls { display: none !important; }
.dbv__morewrap { margin-top: 28px; text-align: center; }
.dbv .dbv__morebtn { cursor: pointer; font-family: inherit; }

/* stránkování Shoptetu pod blokem */
.dbv-done .listingControls { margin-top: 0; }

@media (max-width: 991px) {
  .dbv .dbv__title { font-size: 32px; }
  .dbv__feat { grid-template-columns: 1fr; }
  .dbv .dbv__card--big .dbv__img { min-height: 0; aspect-ratio: 16 / 10; }
  .dbv__feat-side { grid-template-rows: none; grid-template-columns: 1fr 1fr; }
  .dbv .dbv__card--side .dbv__img { aspect-ratio: 4 / 3; }
  .dbv__grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .dbv__cta { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 767px) {
  .dbv .dbv__title { font-size: 27px; }
  .dbv__sub { font-size: 15px; }
  .dbv__chips { flex-wrap: nowrap; overflow-x: auto; margin: 20px -20px 0; padding: 0 20px 4px; scrollbar-width: none; }
  .dbv__chips::-webkit-scrollbar { display: none; }
  .dbv .dbv__chip { flex: none; }
  .dbv__feat-side { grid-template-columns: 1fr; }
  .dbv .dbv__card--big .dbv__h { font-size: 22px; }
  .dbv__grid { grid-template-columns: 1fr; }
  .dbv .dbv__card:hover { transform: none; }
  .dbv__cta { padding: 22px 20px; }
  .dbv__cta-btns { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  .dbv .dbv__card, .dbv__img img, .dbv__more::after { transition: none; }
}