/* ph-bannery.css | mercato.cz, titulní strana | verze 2 (2026-10-22, nasazeno)
   Správce souborů Shoptetu -> https://www.mercato.cz/user/documents/upload/ph-bannery.css
   Bez JavaScriptu, bez externích fontů (Roboto načítá Shoptet).
   Všechna pravidla se uplatní jen na banner nebo slide s vyplněným polem Nadpis: Adamin z něj vytvoří
   div.banner-caption, na který se pravidla vážou přes :has(). Banner se zapečeným textem zůstává beze změny. */

/* ===== 1. SPODNÍ BANNERY (Střed, Zápatí), varianta B. Doslovná kopie bloku PH-BANNERY-B 2026-10-22,
   pravidla beze změny (shoda znak po znaku s nasazeným blokem ověřena 22. 10.). ===== */
body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption){--phb-cols:minmax(0,5fr) minmax(0,7fr);--phb-pad:40px 48px;--phb-title:32px;--phb-body:17px;--phb-cta:15px;position:relative;display:grid;grid-template-columns:var(--phb-cols);grid-template-rows:minmax(0,1fr);grid-auto-rows:0;overflow:hidden;width:100%;min-height:340px;margin:0;padding:0;border-radius:8px;background:#F6EEE2;color:#1e1e1c;text-decoration:none}body.type-index .footer-banners a:has(.banner-caption){--phb-cols:minmax(0,1fr) minmax(0,1.1fr);--phb-pad:28px 30px;--phb-title:24px;--phb-body:15px;min-height:300px}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption)::before,body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption)::after{content:none}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption)>img{position:absolute;inset:0;grid-column:2;grid-row:1;display:block;width:100%;height:100%;min-height:0;max-width:none;margin:0;object-fit:cover;object-position:center center;transform:none}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .extended-banner-texts{display:contents}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .banner-caption{position:static !important;inset:auto;grid-column:1;grid-row:1;display:flex;flex-direction:column;justify-content:center !important;align-items:flex-start !important;text-align:left !important;width:auto;height:auto;max-width:none;margin:0;padding:var(--phb-pad);background:none;transform:none;font-family:Roboto,"Helvetica Neue",Arial,sans-serif;color:#1e1e1c}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .banner-caption>div{width:auto;max-width:none;margin:0;padding:0;background:none}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .extended-banner-title{display:block;max-width:16em;margin:0 0 14px;padding:0;background:none;border:0;color:#1e1e1c;font-family:inherit;font-size:var(--phb-title);font-weight:700;line-height:1.15;letter-spacing:0;text-transform:none;text-shadow:none;white-space:normal}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .extended-banner-title::after{content:"";display:block;width:40px;height:3px;margin-top:12px;background:#B69C75}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .extended-banner-title::before{content:none}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .extended-banner-text{display:block;max-width:28em;margin:0 0 22px;padding:0;background:none;color:#4d4438;font-family:inherit;font-size:var(--phb-body);font-weight:400;line-height:1.45;letter-spacing:0;text-transform:none;text-shadow:none;white-space:normal}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .extended-banner-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;width:auto;margin:0;padding:0 22px;border:0;border-radius:8px;background:#8c6a3c;box-shadow:none;color:#fff;font-family:inherit;font-size:var(--phb-cta);font-weight:600;line-height:1.2;letter-spacing:.01em;text-transform:none;text-shadow:none;white-space:nowrap;transition:background-color .15s ease}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .extended-banner-link::before,body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .extended-banner-link::after{content:none}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption):is(:hover,:focus-visible) .extended-banner-link{background:#75582f}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption):focus-visible{outline:3px solid #8c6a3c;outline-offset:3px}@media (min-width: 768px) and (max-width: 1199px){body.type-index .body-banners a:has(.banner-caption),body.type-index .footer-banners a:has(.banner-caption){--phb-cols:minmax(0,1fr) minmax(0,1.2fr);--phb-pad:32px 36px;--phb-title:26px;--phb-body:16px;min-height:300px}}@media (max-width: 767px){body.type-index .body-banners a:has(.banner-caption),body.type-index .footer-banners a:has(.banner-caption){--phb-pad:18px 20px 22px;--phb-title:21px;--phb-body:15px;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;min-height:0}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption)>img{position:static;grid-column:1;grid-row:1;height:auto;aspect-ratio:2 / 1}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .banner-caption{grid-column:1;grid-row:2}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .extended-banner-title{margin-bottom:10px}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .extended-banner-title::after{width:32px;margin-top:10px}body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .extended-banner-text{margin-bottom:16px;line-height:1.4}}@media (prefers-reduced-motion: reduce){body.type-index :is(.body-banners,.footer-banners) a:has(.banner-caption) .extended-banner-link{transition:none}}

/* ===== 2. HORNÍ ČÁST: carousel + dva bannery vedle něj. Stejný jazyk jako spodní karty:
   krémový panel #F6EEE2, linka #B69C75, Roboto, radius 8. Carousel má jediné plné tlačítko (#8c6a3c),
   malé bannery mají textový odkaz, aby v prvním výhledu nesoutěžily tři stejně silná tlačítka. ===== */

/* --- 2a. Carousel: dělená karta. Rozměr je zamčený na tvar starých slidů (počítač 1920:830, mobil 1:1),
   takže nové a staré slidy se dají míchat a carousel při přepnutí neposkakuje. --- */
body.type-index #carousel:has(.banner-caption){border-radius:8px}
body.type-index #carousel .item>a:has(.banner-caption){
  --pht-cols:minmax(0,5fr) minmax(0,7fr);
  --pht-pad:40px 48px;
  --pht-title:34px;
  --pht-body:17px;
  position:relative;display:grid;grid-template-columns:var(--pht-cols);grid-template-rows:minmax(0,1fr);
  aspect-ratio:1920/830;width:100%;height:auto;overflow:hidden;margin:0;padding:0;
  background:#F6EEE2;color:#1e1e1c;text-decoration:none;line-height:1.4
}
/* fotka: absolutně v ploše mřížky (u absolutní pozice nutné obě hranice, jinak sahá až k okraji), výšku karty určuje poměr stran */
body.type-index #carousel .item>a:has(.banner-caption)>img{
  position:absolute;inset:0;grid-column:2/3;grid-row:1/2;z-index:auto;display:block;
  width:100%;height:100%;min-width:0;min-height:0!important;max-width:none;max-height:none;margin:0;
  object-fit:cover;object-position:center;transform:none;transition:none
}
body.type-index #carousel .item>a:has(.banner-caption) .extended-banner-texts{display:contents}
body.type-index #carousel .item>a:has(.banner-caption) .banner-caption{
  position:static;inset:auto;grid-column:1;grid-row:1;z-index:auto;display:flex;flex-direction:column;
  justify-content:center;align-items:flex-start;text-align:left;width:auto;height:auto;max-width:none;
  margin:0;padding:var(--pht-pad);background:none;transition:none;
  font-family:Roboto,"Helvetica Neue",Arial,sans-serif;color:#1e1e1c;line-height:1.4
}
body.type-index #carousel .item>a:has(.banner-caption) .extended-banner-title{
  display:block;width:auto;max-width:14em;margin:0 0 14px;padding:0;background:none;border:0;
  color:#1e1e1c;font-family:inherit;font-size:var(--pht-title);font-weight:700;line-height:1.12;
  letter-spacing:0;text-transform:none;text-shadow:none;white-space:normal
}
body.type-index #carousel .item>a:has(.banner-caption) .extended-banner-title::before{content:none}
body.type-index #carousel .item>a:has(.banner-caption) .extended-banner-title::after{
  content:"";display:block;width:40px;height:3px;margin-top:12px;background:#B69C75
}
body.type-index #carousel .item>a:has(.banner-caption) .extended-banner-text{
  display:block;max-width:24em;margin:0 0 22px;padding:0;background:none;opacity:1;
  color:#4d4438;font-family:inherit;font-size:var(--pht-body);font-weight:400;line-height:1.45;
  letter-spacing:0;text-transform:none;text-shadow:none;white-space:normal
}
body.type-index #carousel .item>a:has(.banner-caption) .extended-banner-link{
  display:inline-flex;align-items:center;justify-content:center;min-height:48px;min-width:0;width:auto;
  margin:0;padding:0 26px;border:0;border-radius:8px;background:#8c6a3c;box-shadow:none;
  color:#fff;font-family:inherit;font-size:16px;font-weight:600;line-height:1.2;letter-spacing:.01em;
  text-transform:none;text-shadow:none;white-space:nowrap;transition:background-color .15s ease
}
body.type-index #carousel .item>a:has(.banner-caption) .extended-banner-link::before,
body.type-index #carousel .item>a:has(.banner-caption) .extended-banner-link::after{content:none}
body.type-index #carousel .item>a:has(.banner-caption):is(:hover,:focus-visible) .extended-banner-link{background:#75582f}
body.type-index #carousel .item>a:has(.banner-caption):focus-visible{outline:3px solid #8c6a3c;outline-offset:-3px}

/* šipky: z levého okraje (kde by ležely přes text) do pravého dolního rohu fotky; zobrazení na najetí řídí Adamin */
@media (min-width:768px){
  body.type-index #carousel:has(.banner-caption) .carousel-control{
    top:auto;bottom:16px;left:auto;width:44px;height:44px;transform:none
  }
  body.type-index #carousel:has(.banner-caption) .carousel-control.right{right:16px}
  body.type-index #carousel:has(.banner-caption) .carousel-control.left{right:68px}
  body.type-index #carousel:has(.banner-caption) .carousel-control::before{
    top:0;left:0;right:auto;width:44px;height:44px;margin:0;line-height:44px;
    background:rgba(246,238,226,.94);color:#5c4628;box-shadow:0 0 0 1px rgba(182,156,117,.5)
  }
  body.type-index #carousel:has(.banner-caption) .carousel-control:focus-visible{opacity:1}
}
/* 1200–1439 px: carousel 740–900 px široký */
@media (min-width:1200px) and (max-width:1439px){
  body.type-index #carousel .item>a:has(.banner-caption){--pht-pad:30px 36px;--pht-title:29px;--pht-body:16px}
}
/* 768–1199 px: carousel na plnou šířku (Adamin), bannery pod ním */
@media (min-width:768px) and (max-width:1199px){
  body.type-index #carousel .item>a:has(.banner-caption){--pht-pad:32px 40px;--pht-title:30px;--pht-body:16px}
}
/* mobil: čtverec, fotka nahoře, panel pod ní */
@media (max-width:767px){
  body.type-index #carousel .item>a:has(.banner-caption){
    --pht-pad:16px 20px 20px;--pht-title:22px;--pht-body:15px;
    grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;aspect-ratio:1/1
  }
  body.type-index #carousel .item>a:has(.banner-caption)>img{grid-column:1/2;grid-row:1/2}
  body.type-index #carousel .item>a:has(.banner-caption) .banner-caption{grid-column:1;grid-row:2}
  body.type-index #carousel .item>a:has(.banner-caption) .extended-banner-title{margin-bottom:8px}
  body.type-index #carousel .item>a:has(.banner-caption) .extended-banner-title::after{width:32px;margin-top:8px}
  body.type-index #carousel .item>a:has(.banner-caption) .extended-banner-text{margin-bottom:14px;line-height:1.4}
  body.type-index #carousel .item>a:has(.banner-caption) .extended-banner-link{min-height:44px;padding:0 22px;font-size:15px}
  /* šipky do středu fotky, ne přes nadpis */
  body.type-index #carousel:has(.banner-caption) .carousel-control{top:24%}
}

/* --- 2b. Bannery vedle carouselu: kompaktní karta (nadpis + textový odkaz, pole Text se nezobrazuje).
   Samostatně drží tvar starého banneru 1920:830; když jsou kartou oba, dorovnají se přesně na výšku carouselu. --- */
body.type-index .next-to-carousel-banners .banner-wrapper:has(>a .banner-caption){border-radius:8px;overflow:hidden;line-height:1.3}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption){
  --ptc-title:20px;
  position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);
  aspect-ratio:1920/830;width:100%;height:auto;overflow:hidden;margin:0;padding:0;border-radius:8px;
  background:#F6EEE2;color:#1e1e1c;text-decoration:none;line-height:1.3
}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption)>img{
  position:absolute;inset:0;grid-column:2/3;grid-row:1/2;z-index:auto;display:block;
  width:100%;height:100%;min-width:0;min-height:0;max-width:none;max-height:none;margin:0;
  object-fit:cover;object-position:center;transform:none;transition:none
}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption) .extended-banner-texts{display:contents}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption) .banner-caption{
  position:static;inset:auto;grid-column:1;grid-row:1;z-index:auto;display:flex;flex-direction:column;
  justify-content:center;align-items:flex-start;text-align:left;width:auto;height:auto;max-width:none;
  margin:0;padding:16px 20px;background:none;transition:none;
  font-family:Roboto,"Helvetica Neue",Arial,sans-serif;color:#1e1e1c;line-height:1.3
}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption) .extended-banner-title{
  display:block;width:auto;max-width:none;margin:0 0 10px;padding:0;background:none;border:0;
  color:#1e1e1c;font-family:inherit;font-size:var(--ptc-title);font-weight:700;line-height:1.15;
  letter-spacing:0;text-transform:none;text-shadow:none;white-space:normal
}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption) .extended-banner-title::before{content:none}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption) .extended-banner-title::after{
  content:"";display:block;width:32px;height:3px;margin-top:8px;background:#B69C75
}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption) .extended-banner-text{display:none}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption) .extended-banner-link{
  display:inline-flex;align-items:center;gap:6px;min-height:0;min-width:0;width:auto;margin:0;padding:0;
  border:0;border-radius:0;background:none;box-shadow:none;color:#8c6a3c;font-family:inherit;
  font-size:15px;font-weight:600;line-height:1.3;letter-spacing:0;text-align:left;text-transform:none;
  text-shadow:none;text-decoration:none;white-space:nowrap
}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption) .extended-banner-link::before{content:none}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption) .extended-banner-link::after{content:"\2192";transition:transform .15s ease}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption):is(:hover,:focus-visible) .extended-banner-link{
  background:none;color:#75582f;text-decoration:underline;text-underline-offset:3px
}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption):is(:hover,:focus-visible) .extended-banner-link::after{transform:translateX(3px)}
body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption):focus-visible{outline:3px solid #8c6a3c;outline-offset:-3px}

/* oba bannery jsou kartou (žádný a.extended-empty): mřížka místo plovoucích 48% / max 350 px z Adaminu */
body.type-index .next-to-carousel-banners .normal-banners-line:has(.banner-caption):not(:has(a.extended-empty)){
  display:grid;gap:24px;width:100%;margin:0;padding:0
}
body.type-index .next-to-carousel-banners .normal-banners-line:has(.banner-caption):not(:has(a.extended-empty))>.banner-wrapper{
  width:auto;max-width:none;min-height:0;height:auto;margin:0
}
/* počítač: pravý sloupec se natáhne na výšku carouselu a bannery si ji rozdělí (2 × (výška − 24) / 2) */
@media (min-width:1200px){
  body.type-index .banners-row:has(.normal-banners-line .banner-caption):not(:has(.normal-banners-line a.extended-empty))>.col-sm-4{
    display:flex;flex-direction:column
  }
  body.type-index .banners-row:has(.normal-banners-line .banner-caption):not(:has(.normal-banners-line a.extended-empty)) .next-to-carousel-banners{
    flex:1 1 auto;align-items:stretch
  }
  /* přesně 1200 px: Adamin tu carouselu ještě dává margin-bottom 20 px, sloupec by bannery protáhl o 20 px */
  body.type-index .banners-row:has(.normal-banners-line .banner-caption):not(:has(.normal-banners-line a.extended-empty)) #carousel{margin-bottom:0}
  body.type-index .next-to-carousel-banners .normal-banners-line:has(.banner-caption):not(:has(a.extended-empty)){
    grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,1fr)
  }
  body.type-index .next-to-carousel-banners .normal-banners-line:has(.banner-caption):not(:has(a.extended-empty))>.banner-wrapper>a{
    aspect-ratio:auto;height:100%
  }
}
@media (min-width:1200px) and (max-width:1439px){
  body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption){--ptc-title:17px}
  body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption) .banner-caption{padding:12px 16px}
}
/* tablet: dva bannery vedle sebe pod carouselem, zarovnané na jeho okraje; odstup 30 px jako dnes u Adaminu */
@media (min-width:768px) and (max-width:1199px){
  body.type-index .next-to-carousel-banners .normal-banners-line:has(.banner-caption):not(:has(a.extended-empty)){
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;margin-bottom:30px
  }
}
/* mobil: pod sebou na plnou šířku */
@media (max-width:767px){
  body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption){--ptc-title:18px}
  body.type-index .next-to-carousel-banners .normal-banners-line:has(.banner-caption):not(:has(a.extended-empty)){
    grid-template-columns:minmax(0,1fr);gap:12px;margin-bottom:30px
  }
}
@media (prefers-reduced-motion:reduce){
  body.type-index #carousel .item>a:has(.banner-caption) .extended-banner-link,
  body.type-index .next-to-carousel-banners .banner-wrapper>a:has(.banner-caption) .extended-banner-link::after{transition:none}
}
/* v2 2026-10-22: banner Spolupráce – káva víc vlevo (Pavlův pokyn) */
body.type-index .footer-banners a[href*="spoluprace"]:has(.banner-caption)>img{object-position:85% 50%}
@media (max-width:767px){body.type-index .footer-banners a[href*="spoluprace"]:has(.banner-caption)>img{object-position:50% 50%}}
/* konec ph-bannery.css */