/* ---------- scoped reset & tokeny (adidas.cz: černá, bílá, šedé #ECEFF1 / #767677) ---------- */
.adi-brand{
  --ad-black:#000;--ad-white:#fff;--ad-grey:#ECEFF1;--ad-grey2:#767677;--ad-line:#D3D7DA;
  font-family:'Barlow','AdihausDIN',Helvetica,Arial,sans-serif;color:#000;font-size:16px;line-height:1.4;
  max-width:1400px;margin:0 auto;background:#fff;
}
.adi-brand *,.adi-brand *::before,.adi-brand *::after{box-sizing:border-box;margin:0;padding:0;}
.adi-brand img{max-width:100%;height:auto;display:block;}
.adi-brand a{text-decoration:none;color:inherit;}
.adi-brand .adi-wrap{max-width:1280px;margin:0 auto;padding:0 20px;}
.adi-brand .adi-h{font-family:'Barlow Condensed','adidasFG',Helvetica,Arial,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.02em;line-height:1.1;}
.adi-brand .adi-h2{font-size:38px;margin-bottom:24px;}
/* tlačítka předlohy: bílá s černým rámečkem 1px, hranatá, tučná, šipka */
.adi-brand .adi-btn{display:inline-flex;align-items:center;gap:12px;background:#fff;color:#000;border:1px solid #000;font-weight:700;font-size:16px;padding:12px 16px;line-height:1;transition:background .2s,color .2s;}
.adi-brand .adi-btn:hover{background:#000;color:#fff;}
.adi-brand .adi-btn-black{background:#000;color:#fff;}
.adi-brand .adi-btn-black:hover{background:#fff;color:#000;}
.adi-brand .adi-arrow{width:20px;height:20px;}
.adi-brand .adi-link{display:inline-block;font-weight:700;text-decoration:underline;text-underline-offset:3px;}

/* ---------- černá servisní lišta + bílá hlavička ---------- */
.adi-brand .adi-topbar{background:#000;color:#fff;text-align:center;font-size:13px;font-weight:700;padding:9px 16px;letter-spacing:.02em;}
.adi-brand .adi-header .adi-wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:14px;padding-bottom:14px;border-bottom:1px solid var(--ad-line);}
.adi-brand .adi-logo{width:60px;height:40px;display:block;}
.adi-brand .adi-nav{list-style:none;display:flex;flex-wrap:wrap;gap:0 26px;}
.adi-brand .adi-nav a{font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.02em;padding:6px 0;border-bottom:2px solid transparent;}
.adi-brand .adi-nav a:hover{border-bottom-color:#000;}
.adi-brand .adi-header-note{font-size:13px;color:var(--ad-grey2);}

/* ---------- hero (2880:1200) s bílými boxy vlevo dole ---------- */
.adi-brand .adi-hero{position:relative;width:100%;padding-top:41.7%;background:url('/shop-data/campaign/adidas/Autumn_Shop26_DUAL_Desktop_2880x1200_a047257927-a35271.jpg') center/cover no-repeat;container-type:inline-size;}
.adi-brand .adi-hero-box{position:absolute;left:3%;bottom:6%;display:flex;flex-direction:column;align-items:flex-start;gap:6px;}
.adi-brand .adi-hero-box .adi-h1{background:#fff;color:#000;font-family:'Barlow Condensed','adidasFG',Helvetica,Arial,sans-serif;font-weight:700;text-transform:uppercase;font-size:2.4cqw;line-height:1.15;padding:.5cqw 1cqw;letter-spacing:.02em;}
.adi-brand .adi-hero-box p{background:#fff;font-size:1.25cqw;padding:.5cqw 1cqw;}
.adi-brand .adi-hero-btns{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;}
.adi-brand .adi-hero-btns .adi-btn{font-size:1.2cqw;padding:.85cqw 1.2cqw;}
.adi-brand .adi-hero-btns .adi-arrow{width:1.5cqw;height:1.5cqw;}

/* ---------- teaser karusel (portrétní karty 3:4) ---------- */
.adi-brand .adi-section{padding:48px 0 40px;}
.adi-brand .adi-teasers{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.adi-brand .adi-teaser{display:flex;flex-direction:column;gap:6px;}
.adi-brand .adi-teaser-img{display:flex;align-items:center;justify-content:center;aspect-ratio:3/4;background:var(--ad-grey);overflow:hidden;margin-bottom:10px;}
.adi-brand .adi-teaser-img img{width:100%;height:100%;object-fit:contain;padding:8%;mix-blend-mode:multiply;transition:transform .35s;}
.adi-brand .adi-teaser-official img{object-fit:cover;padding:0;mix-blend-mode:normal;}
.adi-brand .adi-teaser:hover .adi-teaser-img img{transform:scale(1.03);}
.adi-brand .adi-teaser strong{font-size:16px;font-weight:700;}
.adi-brand .adi-teaser-desc{font-size:15px;color:#000;min-height:42px;}
.adi-brand .adi-teaser .adi-link{margin-top:4px;}

/* ---------- produktový karusel bez cen (jako karty předlohy) ---------- */
.adi-brand .adi-tabs{display:flex;gap:10px;align-items:center;margin-bottom:22px;flex-wrap:wrap;}
.adi-brand .adi-tab{border:1px solid #000;padding:8px 14px;font-weight:700;font-size:14px;}
.adi-brand .adi-tab-active{background:#000;color:#fff;}
.adi-brand .adi-tabs .adi-link{margin-left:auto;font-size:14px;}
.adi-brand .adi-prods{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.adi-brand .adi-prod{display:flex;flex-direction:column;border:1px solid transparent;transition:border-color .2s;}
.adi-brand .adi-prod:hover{border-color:#000;}
.adi-brand .adi-prod-img{aspect-ratio:1/1;background:var(--ad-grey);display:flex;align-items:center;justify-content:center;overflow:hidden;}
.adi-brand .adi-prod-img img{width:100%;height:100%;object-fit:contain;padding:8%;mix-blend-mode:multiply;}
.adi-brand .adi-prod-name{font-size:15px;padding:10px 10px 2px;line-height:1.3;}
.adi-brand .adi-prod-cat{font-size:14px;color:var(--ad-grey2);padding:0 10px 12px;}

/* ---------- dlaždice „Objev něco nového" (3 sloupce, štítek vlevo dole) ---------- */
.adi-brand .adi-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.adi-brand .adi-tile{position:relative;aspect-ratio:1/1;background:var(--ad-grey);display:flex;align-items:center;justify-content:center;overflow:hidden;}
.adi-brand .adi-tile img{width:100%;height:100%;object-fit:contain;padding:10%;mix-blend-mode:multiply;transition:transform .35s;}
.adi-brand .adi-tile:hover img{transform:scale(1.04);}
.adi-brand .adi-tile-label{position:absolute;left:16px;bottom:16px;background:#fff;color:#000;font-weight:700;font-size:14px;padding:6px 10px;}

/* ---------- rychlé odkazy (4 sloupce) ---------- */
.adi-brand .adi-quick{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:12px 0 48px;}
.adi-brand .adi-quick h3{font-size:16px;font-weight:700;text-transform:uppercase;margin-bottom:12px;}
.adi-brand .adi-quick ul{list-style:none;}
.adi-brand .adi-quick li{font-size:14px;margin-bottom:8px;}
.adi-brand .adi-quick li a:hover{text-decoration:underline;}

/* ---------- černá sekce s příběhem značky (SEO blok předlohy) ---------- */
.adi-brand .adi-story{background:#000;color:#fff;padding:64px 0;}
.adi-brand .adi-story .adi-h2{text-align:center;max-width:960px;margin:0 auto 32px;}
.adi-brand .adi-story p{font-size:16px;line-height:22px;margin-bottom:16px;max-width:1009px;margin-left:auto;margin-right:auto;}
.adi-brand .adi-timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px;}
.adi-brand .adi-year{border-top:2px solid #fff;padding-top:14px;}
.adi-brand .adi-year strong{display:block;font-family:'Barlow Condensed',Helvetica,Arial,sans-serif;font-size:34px;font-weight:700;line-height:1;margin-bottom:8px;}
.adi-brand .adi-year span{font-size:14px;line-height:20px;color:#D3D7DA;}
.adi-brand .adi-story .adi-btn{margin-top:36px;}
.adi-brand .adi-story-cta{text-align:center;}

/* ---------- responzivita ---------- */
@media (max-width:1000px){
  .adi-brand .adi-teasers,.adi-brand .adi-prods{grid-template-columns:repeat(2,1fr);}
  .adi-brand .adi-quick{grid-template-columns:repeat(2,1fr);}
  .adi-brand .adi-timeline{grid-template-columns:repeat(2,1fr);}
  .adi-brand .adi-h2{font-size:30px;}
}
@media (max-width:760px){
  .adi-brand .adi-header .adi-wrap{flex-wrap:wrap;}
  .adi-brand .adi-header-note{display:none;}
  .adi-brand .adi-nav{gap:0 16px;}
  .adi-brand .adi-nav a{font-size:14px;}
  .adi-brand .adi-hero{padding-top:0;background:none;}
  .adi-brand .adi-hero::before{content:"";display:block;width:100%;padding-top:41.7%;background:url('/shop-data/campaign/adidas/Autumn_Shop26_DUAL_Desktop_2880x1200_a047257927-a35271.jpg') center/cover no-repeat;}
  .adi-brand .adi-hero-box{position:static;padding:16px 20px 0;gap:8px;}
  .adi-brand .adi-hero-box .adi-h1{font-size:24px;padding:0;}
  .adi-brand .adi-hero-box p{font-size:16px;padding:0;}
  .adi-brand .adi-hero-btns .adi-btn{font-size:15px;padding:12px 16px;}
  .adi-brand .adi-hero-btns .adi-arrow{width:18px;height:18px;}
  .adi-brand .adi-tiles{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:520px){
  .adi-brand .adi-teasers,.adi-brand .adi-prods,.adi-brand .adi-tiles,.adi-brand .adi-quick,.adi-brand .adi-timeline{grid-template-columns:1fr;}
  .adi-brand .adi-h2{font-size:26px;}
}

/* ---------- guardy šablony Upgates ---------- */
/* Šablona vykresluje nad obsahem vlastní H1 s názvem kategorie. Brand page má svoji
   hlavičku i hero, takže je to nahoře navíc — skrýváme. Smí se to jen proto, že
   hero má vlastní `<h1>` (viz `POVYS_NA_H1` v generátoru); ve zdrojovém balíčku to
   byl `<span>` a stránka by po skrytí zůstala bez nadpisu. Selektor míří na
   `ph-page` i na starší `ph-main` — šablona třídu přejmenovala. */
body:has(.adi-brand-wrapper) h1.ph-main,
body:has(.adi-brand-wrapper) h1.ph-page { display: none; }
/* Obsahový sloupec šablony je omezený na 640 px, brand page potřebuje plnou šířku. */
.max-w-xl:has(.adi-brand-wrapper) { max-width: none; }
/* Nadpisy: šablona tlačí vlastní font a u diakritiky pak padá na tučný fallback
   (řešeno u Tesly). Vynutíme Barlow Condensed i pro nadpisy uvnitř brand page. */
.adi-brand :where(h1, h2, h3, h4, h5, h6) {
  font-family: 'Barlow Condensed', system-ui, sans-serif;
}

/* ---------- protijedy na rozměry od šablony ---------- */
/* `_after.scss` se načítá jako POSLEDNÍ stylesheet (naše CSS je druhé), takže bez
   `!important` neprojdeme. Vnucuje `min-height:72px` 124 prvkům uvnitř obsahu
   (span, div, a, svg, h2, ul) a `width:100%` odkazům i divům. Na stránce s velkými
   bloky to není vidět (Saucony má postižených 14 prvků a vypadá dobře), ale adidas
   stojí na malých prvcích: tlačítka se roztáhla přes celou šířku a naskládala pod
   sebe, šipky a logo narostly na 72 px. V náhledu se to neprojeví — šablona tam
   není — takže se to pozná až na živé stránce. */
.adi-brand, .adi-brand *, .adi-brand *::before, .adi-brand *::after {
  min-height: 0 !important;
  min-width: 0 !important;
}
/* jediný min-height, který je náš vlastní (srovnává výšku popisků v teaserech) */
.adi-brand .adi-teaser-desc { min-height: 42px !important; }
/* odkazy, které mají být inline; blokové (dlaždice, karty) si 100 % nechávají */
.adi-brand .adi-btn,
.adi-brand .adi-nav a,
.adi-brand .adi-link { width: auto !important; }
/* hero box je absolutně pozicovaný, takže se má smrsknout na obsah */
.adi-brand .adi-hero-box { width: max-content !important; max-width: 46% !important; }
.adi-brand .adi-hero-box > * { width: auto !important; }
/* Logo: jeho odkaz nemá vlastní šířku a po resetu `min-width` se jako flex položka
   smrskl na 28 px, zatímco SVG uvnitř má 60 px — logo pak přetékalo do navigace. */
.adi-brand .adi-header .adi-wrap > a { flex: 0 0 auto; }
/* Šablona maluje `background:#fff` na každý div a h2 uvnitř obsahu. Ve světlých
   sekcích to není vidět, v černé sekci s příběhem ano: nadpis, odstavce i časová osa
   zmizely, protože jsou bílé na bílém. Uvnitř téhle sekce si pozadí předepisujeme
   jen u tlačítka, takže zbytek můžeme srovnat na průhledno. */
.adi-brand .adi-story *:not(.adi-btn) { background-color: transparent !important; }
@media (max-width: 760px) {
  /* na mobilu box vypadává z hera do toku a zabírá celou šířku */
  .adi-brand .adi-hero-box { width: auto !important; max-width: none !important; }
}
