/* === LOVELLA – titulka varianta C (návrh 30. 10. 2026) ===
   Nahrát na FTP: /user/documents/css/titulka-c.css
   Záhlaví (pod ostatní CSS): <link href="/user/documents/css/titulka-c.css?v=2" rel="stylesheet" />
   Patří k titulka-c.js (Zápatí). Vrácení: smazat oba řádky.
   POJISTKA: všechna pravidla platí jen pro třídy, které přidá titulka-c.js (lv-…),
   a ten je přidá jen tehdy, když v adminu existuje odpovídající banner.
   Bez bannerů nebo bez JS vypadá titulka jako dnes.
*/
.in-index { --lv-hneda: #3a2f28; --lv-hneda-2: #5a4a40; --lv-bezova: #eaccb2; --lv-krem: #faf5f0; --lv-krem-2: #f3e8dd; --lv-linka: #ead9c8; }

/* nadpisy sekcí */
.in-index .lv-nadpis { margin: 40px 0 18px; font-size: 26px; font-weight: 900; line-height: 1.15; }
@media (max-width: 767px) { .in-index .lv-nadpis { margin: 28px 0 14px; font-size: 21px; } }

/* --- Co hledáte? – dlaždice z doplňkových bannerů (Zápatí) --- */
.in-index .footer-banners.lv-dlazdice {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  grid-gap: 14px !important;
  margin-top: 0 !important;
}
.in-index .footer-banners.lv-dlazdice .footer-banner { padding: 0 !important; width: auto !important; max-width: none !important; float: none !important; }
.in-index .footer-banners.lv-dlazdice .footer-banner > a {
  display: flex; flex-direction: column; height: 100%; border-radius: 18px; overflow: hidden; background: var(--lv-krem);
  transition: transform .2s, box-shadow .2s, background .2s; text-decoration: none; color: #1a1919;
}
.in-index .footer-banners.lv-dlazdice .footer-banner > a:hover { transform: translateY(-4px); box-shadow: 0 12px 28px #3a2f2824; background: var(--lv-krem-2); }
.in-index .footer-banners.lv-dlazdice .footer-banner img {
  display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; padding: 10px 10px 0; mix-blend-mode: multiply;
}
.in-index .footer-banners.lv-dlazdice .extended-banner-texts { display: none !important; }
.in-index .footer-banners.lv-dlazdice .lv-popisek {
  display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-top: auto; padding: 12px 14px 14px;
  font-weight: 900; font-size: 17px; line-height: 1.15;
}
.in-index .footer-banners.lv-dlazdice .lv-popisek::after {
  content: "→"; flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
  background: #fff; font-size: 15px; transition: background .2s, color .2s;
}
.in-index .footer-banners.lv-dlazdice .footer-banner > a:hover .lv-popisek::after { background: var(--lv-hneda); color: #fff; }
@media (max-width: 991px) { .in-index .footer-banners.lv-dlazdice { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 767px) {
  .in-index .footer-banners.lv-dlazdice { grid-template-columns: repeat(2, 1fr) !important; grid-gap: 10px !important; }
  .in-index .footer-banners.lv-dlazdice .lv-popisek { font-size: 15px; padding: 10px 12px 12px; }
  .in-index .footer-banners.lv-dlazdice .lv-popisek::after { width: 24px; height: 24px; font-size: 13px; }
}

/* --- Pro koho? – textový banner --- */
.in-index .lv-prokoho h2 { margin: 32px 0 14px; font-size: 26px; font-weight: 900; }
.in-index .lv-prokoho__chipy { display: flex; flex-wrap: wrap; gap: 10px; }
.in-index .lv-prokoho__chipy a {
  display: inline-flex; align-items: center; gap: 8px; padding: 11px 18px; border-radius: 999px; border: 1.5px solid var(--lv-linka);
  font-weight: 800; font-size: 15px; background: #fff; color: #1a1919; text-decoration: none; transition: border-color .15s, background .15s;
}
.in-index .lv-prokoho__chipy a:hover { border-color: var(--lv-hneda); background: var(--lv-krem); }
.in-index .lv-prokoho__chipy b { font-size: 18px; font-weight: 400; }
@media (max-width: 767px) {
  .in-index .lv-prokoho h2 { margin-top: 24px; font-size: 21px; }
  .in-index .lv-prokoho__chipy { flex-wrap: nowrap; overflow-x: auto; margin: 0 -10px; padding: 0 10px 4px; scrollbar-width: none; }
  .in-index .lv-prokoho__chipy a { flex-shrink: 0; font-size: 14px; padding: 9px 14px; }
}

/* --- Slider personalizace – z textových bannerů .lv-snimek --- */
.in-index .lv-slider { margin-top: 36px; }
.in-index .lv-slider__okno { position: relative; border-radius: 24px; overflow: hidden; }
.in-index .lv-slider__pas { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; }
.in-index .lv-slider__pas::-webkit-scrollbar { display: none; }
.in-index .lv-snimek {
  flex: 0 0 100%; scroll-snap-align: start; display: grid; grid-template-columns: 1fr 1.1fr; align-items: center; gap: 30px;
  padding: 44px 64px; min-height: 380px; background: var(--lv-krem); box-sizing: border-box;
}
.in-index .lv-snimek__stitek {
  display: inline-block; padding: 6px 14px; border-radius: 999px; background: #fff; font-weight: 800; font-size: 12px;
  letter-spacing: .06em; text-transform: uppercase; color: var(--lv-hneda-2); margin-bottom: 14px;
}
.in-index .lv-snimek h2 { margin: 0 0 12px; font-size: 38px; line-height: 1.05; font-weight: 900; letter-spacing: -.02em; }
.in-index .lv-snimek p { margin: 0 0 22px; font-size: 17px; line-height: 1.55; color: var(--lv-hneda-2); max-width: 440px; }
.in-index .lv-tlacitko {
  display: inline-flex; align-items: center; gap: 10px; padding: 14px 26px; border-radius: 999px; background: var(--lv-hneda); color: #fff !important;
  font-weight: 800; font-size: 16px; text-decoration: none !important; transition: background .15s;
}
.in-index .lv-tlacitko:hover { background: #000; }
.in-index .lv-snimek__fotky { position: relative; height: 300px; }
.in-index .lv-snimek__fotky img {
  position: absolute; width: 46%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 18px; background: #fff; box-shadow: 0 12px 30px #3a2f2826;
}
.in-index .lv-snimek__fotky img:nth-child(1) { left: 0; top: 18%; transform: rotate(-4deg); }
.in-index .lv-snimek__fotky img:nth-child(2) { left: 27%; top: 0; z-index: 2; transform: rotate(2deg); }
.in-index .lv-snimek__fotky img:nth-child(3) { right: 0; top: 22%; transform: rotate(5deg); }
.in-index .lv-snimek__fotky img:only-child { width: auto; height: 100%; aspect-ratio: auto; left: 50%; top: 0; transform: translateX(-50%) rotate(-2deg); }
.in-index .lv-slider__sip {
  position: absolute; top: 50%; margin-top: -22px; width: 44px; height: 44px; border-radius: 50%; border: 0; background: #fff;
  box-shadow: 0 4px 14px #0002; cursor: pointer; font-size: 22px; line-height: 1; color: var(--lv-hneda); z-index: 3;
}
.in-index .lv-slider__sip.l { left: 14px; } .in-index .lv-slider__sip.p { right: 14px; }
.in-index .lv-slider__tecky { display: flex; justify-content: center; gap: 8px; margin-top: 14px; }
.in-index .lv-slider__tecky button { width: 10px; height: 10px; padding: 0; border-radius: 999px; border: 0; background: var(--lv-linka); cursor: pointer; transition: width .2s, background .2s; }
.in-index .lv-slider__tecky button.on { width: 28px; background: var(--lv-hneda); }
.in-index .lv-slider:not(.vic) .lv-slider__sip, .in-index .lv-slider:not(.vic) .lv-slider__tecky { display: none; }
@media (max-width: 767px) {
  .in-index .lv-slider { margin-top: 26px; }
  .in-index .lv-slider__okno { border-radius: 18px; }
  .in-index .lv-snimek { grid-template-columns: 1fr; padding: 22px 20px 26px; gap: 14px; min-height: 0; }
  .in-index .lv-snimek__fotky { order: -1; height: auto; aspect-ratio: 16 / 9; }
  .in-index .lv-snimek__fotky img { width: 40%; }
  .in-index .lv-snimek__fotky img:nth-child(2) { left: 30%; }
  .in-index .lv-snimek h2 { font-size: 26px; }
  .in-index .lv-snimek p { font-size: 15px; margin-bottom: 16px; }
  .in-index .lv-slider__sip { display: none; }
  .in-index .lv-tlacitko { padding: 12px 20px; font-size: 15px; }
}

/* --- Rodinné gangy – tmavý pás kolem výpisu GANGY --- */
.in-index .lv-gangy { position: relative; margin: 44px 0 0; padding: 48px 0 40px; color: #fff; }
.in-index .lv-gangy { background: var(--lv-hneda); box-shadow: 0 0 0 100vmax var(--lv-hneda); clip-path: inset(0 -100vmax); }
.in-index .lv-gangy__hlava { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: end; margin-bottom: 28px; }
.in-index .lv-gangy h2 { margin: 0; font-size: 40px; line-height: 1.05; font-weight: 900; color: #fff; }
.in-index .lv-gangy h2 em { font-style: normal; color: var(--lv-bezova); }
.in-index .lv-gangy p { margin: 10px 0 0; color: #e9dccf; font-size: 17px; max-width: 560px; }
.in-index .lv-gangy .lv-tlacitko { background: var(--lv-bezova); color: var(--lv-hneda) !important; justify-self: start; }
.in-index .lv-gangy .lv-tlacitko:hover { background: #fff; }
.in-index .lv-gangy .homepage-group-title { display: none !important; }
.in-index .lv-gangy .products-block .p { background: #fff; border-radius: 14px; overflow: hidden; }
.in-index .lv-gangy .products-block .p .p-in { padding: 0 12px 12px; }
@media (max-width: 767px) {
  .in-index .lv-gangy { margin-top: 32px; padding: 32px 0 28px; }
  .in-index .lv-gangy__hlava { grid-template-columns: 1fr; gap: 16px; margin-bottom: 20px; }
  .in-index .lv-gangy h2 { font-size: 28px; }
  .in-index .lv-gangy p { font-size: 15px; }
}


/* --- v2 (31. 10.): karty v tmavém pásu gangů stejně vysoké --- */
.in-index .lv-gangy .slick-track { display: flex !important; }
.in-index .lv-gangy .slick-slide { height: auto !important; float: none !important; display: flex !important; }
.in-index .lv-gangy .slick-slide > div { display: flex; width: 100%; }
.in-index .lv-gangy .slick-slide .product { display: flex !important; width: 100% !important; }
.in-index .lv-gangy .products-block .p { display: flex; flex-direction: column; width: 100%; height: 100%; }
.in-index .lv-gangy .products-block .p .p-in { flex: 1; display: flex; flex-direction: column; }

/* --- v2: pruh výhod dole pod „Proč Lovella“ jako rámeček (2 × 2 na mobilu) --- */
.in-index .advantages.lv-vyhody {
  display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 16px;
  margin: 40px 0 48px !important; padding: 22px 24px !important;
  background: #fff !important; border: 1px solid var(--lv-linka); border-radius: 18px !important;
}
.in-index .advantages.lv-vyhody .advantages__item { width: auto !important; margin: 0 !important; justify-content: flex-start !important; }
.in-index .advantages.lv-vyhody .advantages__item img { height: 42px !important; margin-right: 12px !important; flex-shrink: 0; }
.in-index .advantages.lv-vyhody .advantages__item p { font-size: 14px; line-height: 1.35; }
@media (max-width: 767px) {
  .in-index .advantages.lv-vyhody { grid-template-columns: repeat(2, 1fr); gap: 14px 10px; margin: 28px 0 32px !important; padding: 14px !important; }
  .in-index .advantages.lv-vyhody .advantages__item img { height: 30px !important; margin-right: 8px !important; }
  .in-index .advantages.lv-vyhody .advantages__item p { font-size: 12px; }
}
