/* =========================================================
   Homepage – hlavní banner, kolekce, dlaždice kategorií, loga
   Načítá se až po screen.min.css a přepisuje jen homepage.
   ========================================================= */
:root {
  --hp-wine: #951f25;
  --hp-wine-dark: 90, 14, 20;
  --hp-gap: 14px;
  --hp-side: 16px;
  --hp-radius: 4px;
}

/* ---------- Pořadí bloků: kolekce → dlaždice → loga ---------- */
.type-index .banners-row .col-sm-4 {
  display: flex !important;
  flex-direction: column;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.type-index .banners-row .col-sm-4 > .next-to-carousel-banners { order: 1; }
.type-index .banners-row .col-sm-4 > .fav-categories { order: 2; }
.type-index .banners-row .col-sm-4 > .footer-banners { order: 3; }
/* na velkých monitorech bloky pod hlavním bannerem vycentrovat */
.type-index .banners-row .col-sm-4 > .next-to-carousel-banners,
.type-index .banners-row .col-sm-4 > .fav-categories {
  width: 100% !important;
  max-width: 1600px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.type-index .banners-row .col-sm-4 > .footer-banners {
  width: calc(100% - 2 * var(--hp-side)) !important;
  max-width: calc(1600px - 2 * var(--hp-side)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ---------- Společné tlačítko (CTA) ---------- */
.type-index #carousel .extended-banner-link,
.type-index .next-to-carousel-banners .extended-banner-link {
  display: inline-flex !important;
  align-items: center;
  gap: 12px;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 13px 22px !important;
  border: 0 !important;
  border-radius: 3px;
  background: #fff !important;
  color: #111 !important;
  font-family: Rubik, sans-serif;
  font-size: 15px !important;
  font-weight: 500;
  line-height: 1.2 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  transition: background-color .2s;
}
.type-index #carousel .extended-banner-link::after,
.type-index .next-to-carousel-banners .extended-banner-link::after {
  content: "";
  position: static !important;
  display: block !important;
  width: 7px !important;
  height: 7px !important;
  margin: 0 !important;
  background: none !important;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
}
/* najetí myší: vínové tlačítko s bílým textem (přebíjí hover pravidla kodéra) */
.type-index #carousel .carousel-inner .item > a:hover .extended-banner-texts .extended-banner-link,
.type-index .next-to-carousel-banners .banner-wrapper > a:hover .extended-banner-texts .extended-banner-link {
  background: var(--hp-wine) !important;
  color: #fff !important;
}

/* =================== HLAVNÍ BANNER (karusel) =================== */
.type-index #carousel,
.type-index #carousel .carousel-inner {
  height: auto !important;
  min-height: 0 !important;
}
.type-index #carousel .item > a {
  display: block !important;
  position: relative;
  height: clamp(340px, 30vw, 600px);
  overflow: hidden;
}
.type-index #carousel .item > a > img {
  position: absolute !important;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  max-width: none !important;
  margin: 0 !important;
  object-fit: cover;
  /* na širokých monitorech ořezávat hlavně spodek, ať zůstane vidět hlava */
  object-position: 75% 15%;
}
.type-index #carousel .item > a::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(var(--hp-wine-dark), .7) 0%, rgba(var(--hp-wine-dark), .35) 40%, rgba(var(--hp-wine-dark), 0) 62%);
}
.type-index #carousel .extended-banner-texts {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  right: auto !important;
  z-index: 2;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: min(760px, 62%) !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 0 0 clamp(24px, 7vw, 120px) !important;
  background: none !important;
  color: #fff;
  text-align: left !important;
  transform: none !important;
}
/* text skrýt, dokud ho home.js nezpracuje (jinak problikne "NADTITULEK | *nadpis*");
   pojistka: bez skriptu se text ukáže sám po 1,5 s */
.type-index #carousel .extended-banner-texts > * {
  opacity: 0;
  animation: hp-reveal .3s 1.5s forwards;
}
.type-index #carousel .extended-banner-texts.hp-ready > * {
  opacity: 1;
  animation: none;
  transition: opacity .25s;
}
@keyframes hp-reveal { to { opacity: 1; } }
.type-index #carousel .hp-kicker {
  display: block;
  margin-bottom: 14px;
  font-family: Rubik, sans-serif;
  font-size: clamp(13px, 1.1vw, 18px);
  font-weight: 400;
  letter-spacing: .4em;
  text-transform: uppercase;
}
.type-index #carousel .extended-banner-title {
  display: block !important;
  max-width: 11em;
  margin: 0 !important;
  padding: 0 !important;
  font-family: "Playfair Display", serif !important;
  font-size: clamp(34px, 4.4vw, 72px) !important;
  font-weight: 400 !important;
  line-height: 1.05 !important;
  color: #fff !important;
  text-transform: none !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .25);
}
.type-index #carousel .extended-banner-title em { font-style: italic; }
.type-index #carousel .extended-banner-title::after {
  content: "";
  display: block;
  width: 80px;
  height: 2px;
  margin-top: clamp(14px, 1.6vw, 24px);
  background: rgba(255, 255, 255, .8);
}
.type-index #carousel .extended-banner-text {
  display: block !important;
  max-width: 34em;
  margin: clamp(12px, 1.4vw, 20px) 0 clamp(18px, 2vw, 28px) !important;
  padding: 0 !important;
  font-size: clamp(15px, 1.2vw, 18px) !important;
  line-height: 1.5 !important;
  letter-spacing: .04em;
  color: #fff !important;
}

/* =================== DÁMSKÁ / PÁNSKÁ KOLEKCE =================== */
.type-index .next-to-carousel-banners {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: var(--hp-gap);
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: var(--hp-gap) var(--hp-side) 0 !important;
}
.type-index .next-to-carousel-banners::before,
.type-index .next-to-carousel-banners::after { display: none !important; }
.type-index .next-to-carousel-banners .banner-wrapper {
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
.type-index .next-to-carousel-banners .banner-wrapper > a {
  display: block !important;
  position: relative;
  aspect-ratio: 8 / 3;
  height: auto !important;
  overflow: hidden;
  border-radius: var(--hp-radius);
}
.type-index .next-to-carousel-banners .banner-wrapper > a > img {
  position: absolute !important;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  max-width: none !important;
  margin: 0 !important;
  object-fit: cover;
  object-position: left center;
  transition: transform .6s;
}
.type-index .next-to-carousel-banners .banner-wrapper > a:hover > img { transform: scale(1.03); }
.type-index .next-to-carousel-banners .banner-wrapper > a::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(270deg, rgba(20, 24, 32, .55) 0%, rgba(20, 24, 32, .3) 45%, rgba(20, 24, 32, 0) 68%);
}
.type-index .next-to-carousel-banners .extended-banner-texts {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  right: 0 !important;
  left: auto !important;
  z-index: 2;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 56% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 16px !important;
  background: none !important;
  color: #fff;
  text-align: center !important;
  transform: none !important;
}
.type-index .next-to-carousel-banners .extended-banner-title {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: "Playfair Display", serif !important;
  font-size: clamp(26px, 3vw, 48px) !important;
  font-weight: 400 !important;
  line-height: 1.1 !important;
  color: #fff !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .35);
}
.type-index .next-to-carousel-banners .extended-banner-text {
  display: block !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  font-size: clamp(12px, 1vw, 15px) !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
  color: #fff !important;
  text-shadow: 0 1px 8px rgba(0, 0, 0, .4);
}
.type-index .next-to-carousel-banners .extended-banner-link {
  margin-top: clamp(14px, 1.6vw, 22px) !important;
  padding: 11px 20px !important;
  font-size: 14px !important;
}

/* =================== DLAŽDICE KATEGORIÍ =================== */
.type-index .fav-categories {
  margin: var(--hp-gap) 0 0 !important;
  padding: 0 var(--hp-side) !important;
}
.type-index .fav-categories .container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.type-index .fav-categories .news-wrapper {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--hp-gap);
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
.type-index .fav-categories .news-wrapper::before,
.type-index .fav-categories .news-wrapper::after { display: none !important; }
.type-index .fav-categories .news-item {
  position: relative;
  float: none !important;
  width: auto !important;
  height: auto !important;
  aspect-ratio: 12 / 5;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  border-radius: var(--hp-radius);
}
.type-index .fav-categories .news-item::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .25) 55%, rgba(0, 0, 0, .12) 100%);
}
.type-index .fav-categories .news-item .image,
.type-index .fav-categories .news-item .image a {
  position: absolute !important;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
.type-index .fav-categories .news-item .image img {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  max-width: none !important;
  object-fit: cover;
  transition: transform .6s;
}
.type-index .fav-categories .news-item:hover .image img { transform: scale(1.05); }
.type-index .fav-categories .news-item .text {
  position: absolute !important;
  inset: 0;
  z-index: 2;
  display: flex !important;
  flex-direction: row !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: clamp(8px, 1.2vw, 16px);
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 44px 0 clamp(12px, 2vw, 28px) !important;
  background: none !important;
  text-align: left !important;
  transform: none !important;
}
.type-index .fav-categories .news-item .text::after {
  content: "";
  position: absolute;
  right: clamp(12px, 1.6vw, 22px);
  top: 50%;
  width: 9px;
  height: 9px;
  margin-top: -5px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
}
/* ikona = obrázek vložený do perexu článku */
.type-index .fav-categories .news-item .description {
  order: 0;
  flex: 0 0 auto;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
}
.type-index .fav-categories .news-item .description:not(:has(img)) { display: none !important; }
.type-index .fav-categories .news-item .description p { margin: 0 !important; }
.type-index .fav-categories .news-item .description img {
  display: block;
  width: clamp(30px, 3.6vw, 56px) !important;
  height: auto !important;
  max-width: none !important;
  margin: 0 !important;
}
.type-index .fav-categories .news-item .title {
  order: 1;
  position: static !important;
  display: block !important;
  max-width: 9em;
  margin: 0 !important;
  padding: 0 !important;
  font-family: "Playfair Display", serif !important;
  font-size: clamp(16px, 1.75vw, 28px) !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
  color: #fff !important;
  text-align: left !important;
  text-shadow: 0 1px 10px rgba(0, 0, 0, .35);
}
/* celá dlaždice klikací */
.type-index .fav-categories .news-item .title::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
}
.type-index .fav-categories .news-item .button { display: none !important; }

/* =================== LOGA ZNAČEK =================== */
.type-index .footer-banners {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  height: auto !important;
  margin: clamp(20px, 3vw, 40px) var(--hp-side) clamp(8px, 1.5vw, 20px) !important;
  padding: 0 !important;
}
.type-index .footer-banners::before,
.type-index .footer-banners::after { display: none !important; }
.type-index .footer-banners .footer-banner {
  display: flex !important;
  flex: 1 1 0;
  justify-content: center;
  align-items: center;
  float: none !important;
  width: auto !important;
  max-width: none !important;
  min-height: 56px;
  margin: 0 !important;
  padding: 4px clamp(10px, 2vw, 28px) !important;
}
.type-index .footer-banners .footer-banner + .footer-banner { border-left: 1px solid #ddd; }
.type-index .footer-banners .footer-banner a {
  display: flex !important;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 0 !important;
}
.type-index .footer-banners .footer-banner img {
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 46px !important;
}

/* =================== TABLET (do 991 px) =================== */
@media (max-width: 991px) {
  .type-index #carousel .item > a { height: 380px; }
  .type-index #carousel .item > a > img { object-position: 85% center; }
  .type-index #carousel .item > a::before {
    background: linear-gradient(90deg, rgba(var(--hp-wine-dark), .88) 0%, rgba(var(--hp-wine-dark), .6) 45%, rgba(var(--hp-wine-dark), 0) 75%);
  }
  .type-index #carousel .extended-banner-texts { width: 70% !important; padding-left: 32px !important; }
  .type-index #carousel .extended-banner-title { max-width: 8em; font-size: 44px !important; }

  .type-index .next-to-carousel-banners { grid-template-columns: 1fr; }
  .type-index .next-to-carousel-banners .banner-wrapper > a { aspect-ratio: 3 / 1; }
  .type-index .fav-categories .news-wrapper { grid-template-columns: repeat(2, 1fr); }
  .type-index .fav-categories .news-item .description img { width: 40px !important; }
  .type-index .fav-categories .news-item .title { font-size: 22px !important; }
}

/* =================== MOBIL (do 767 px) =================== */
@media (max-width: 767px) {
  .type-index .banners-row { margin-left: 0 !important; margin-right: 0 !important; }
  /* hlavní banner: text vlevo na vínovém přechodu, postava vpravo */
  .type-index #carousel .item > a { height: 300px; }
  /* postavu posunout až k pravému okraji (část fotky vpravo se ořízne) */
  .type-index #carousel .item > a > img { object-position: calc(100% + 120px) center; }
  .type-index #carousel .item > a::before {
    background: linear-gradient(90deg, rgba(var(--hp-wine-dark), .92) 0%, rgba(var(--hp-wine-dark), .75) 40%, rgba(var(--hp-wine-dark), 0) 66%);
  }
  .type-index #carousel .extended-banner-texts {
    width: 58% !important;
    padding: 0 0 0 18px !important;
  }
  .type-index #carousel .hp-kicker { margin-bottom: 8px; font-size: 11px; letter-spacing: .3em; }
  .type-index #carousel .extended-banner-title { font-size: 31px !important; }
  .type-index #carousel .extended-banner-title::after { width: 54px; margin-top: 12px; }
  .type-index #carousel .extended-banner-text { font-size: 13px !important; line-height: 1.45 !important; margin: 12px 0 16px !important; }
  .type-index #carousel .extended-banner-link { padding: 10px 14px !important; font-size: 12px !important; gap: 8px; white-space: nowrap; }

  /* kolekce vedle sebe: postava vlevo, text vpravo */
  .type-index .next-to-carousel-banners { grid-template-columns: 1fr 1fr; gap: 8px; }
  .type-index .next-to-carousel-banners .banner-wrapper > a { aspect-ratio: auto; height: 150px !important; }
  .type-index .next-to-carousel-banners .banner-wrapper > a > img { object-position: 38% center; }
  .type-index .next-to-carousel-banners .banner-wrapper > a::before {
    background: linear-gradient(270deg, rgba(20, 24, 32, .75) 0%, rgba(20, 24, 32, .5) 45%, rgba(20, 24, 32, 0) 75%);
  }
  .type-index .next-to-carousel-banners .extended-banner-texts { width: 56% !important; padding: 6px 8px 6px 0 !important; }
  .type-index .next-to-carousel-banners .extended-banner-title { font-size: 20px !important; line-height: 1.05 !important; }
  .type-index .next-to-carousel-banners .extended-banner-text { margin-top: 4px !important; font-size: 8px !important; line-height: 1.5 !important; letter-spacing: .1em !important; }
  .type-index .next-to-carousel-banners .extended-banner-link { margin-top: 7px !important; padding: 6px 9px !important; font-size: 10px !important; gap: 6px; }
  .type-index .next-to-carousel-banners .extended-banner-link .hp-more { display: none; }

  .type-index .fav-categories .news-wrapper { gap: 8px; }
  .type-index .fav-categories .news-item { aspect-ratio: 2 / 1; }
  .type-index .fav-categories .news-item .text { padding: 0 26px 0 12px !important; }
  .type-index .fav-categories .news-item .description img { width: 28px !important; }
  .type-index .fav-categories .news-item .title { font-size: 16px !important; }
  .type-index .fav-categories .news-item .text::after { right: 11px; width: 7px; height: 7px; }

  .type-index .footer-banners .footer-banner { flex: 0 0 33.333%; padding: 10px !important; }
  .type-index .footer-banners .footer-banner + .footer-banner { border-left: 0; }
  .type-index .footer-banners .footer-banner img { max-height: 34px !important; }
}