.ak-brand{
  --ak-red:#ED1C24;--ak-red-dark:#C8151C;--ak-ink:#111827;--ak-grey:#6B7280;
  --ak-g100:#F3F4F6;--ak-g200:#E5E7EB;--ak-g400:#9CA3AF;
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color:var(--ak-ink);font-size:16px;line-height:1.5;background:#fff;max-width:1400px;margin:0 auto;
}
.ak-brand *,.ak-brand *::before,.ak-brand *::after{box-sizing:border-box;margin:0;padding:0;}
.ak-brand img{max-width:100%;height:auto;display:block;}
.ak-brand a{text-decoration:none;color:inherit;}
.ak-brand .ak-wrap{max-width:1280px;margin:0 auto;padding:0 32px;}
.ak-brand .ak-pill{display:inline-block;border-radius:9999px;padding:8px 32px;font-size:16px;line-height:1.5;font-weight:500;transition:transform .5s;}
.ak-brand .ak-pill:hover{transform:scale(1.05);}
.ak-brand .ak-pill-white{background:#fff;color:var(--ak-red);}
.ak-brand .ak-pill-red{background:var(--ak-red);color:#fff;}

/* ---------- červená navigační lišta ----------
   Nad ní býval bílý pruh s logem a (falešným) vyhledávacím polem podle akai.com.
   Vyhledávání šlo pryč 2026-09-08 (duplikovalo funkční hledání šablony), logo hned
   po něm — v hero je logo znovu, takže se v hlavičce jen opakovalo. Lišta je teď
   první prvek stránky. */
.ak-brand .ak-nav{background:#fff;border-top:1px solid var(--ak-g200);border-bottom:3px solid var(--ak-red);}
.ak-brand .ak-nav .ak-wrap{display:flex;align-items:center;justify-content:center;padding-top:4px;padding-bottom:4px;}
.ak-brand .ak-nav ul{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:0 24px;}
.ak-brand .ak-nav a{color:var(--ak-ink);font-weight:700;font-size:17px;padding:10px 0;display:inline-block;transition:color .2s;}
.ak-brand .ak-nav a:hover{color:var(--ak-red);}

/* ---------- hero slider (1921:678, CSS crossfade) ---------- */
.ak-brand .ak-hero{position:relative;width:100%;padding-top:35.3%;overflow:hidden;background:#fff;container-type:inline-size;}
.ak-brand .ak-slide{position:absolute;inset:0;opacity:0;visibility:hidden;animation:ak-fade 18s infinite;}
.ak-brand .ak-slide:nth-child(1){animation-delay:0s;}
.ak-brand .ak-slide:nth-child(2){animation-delay:6s;}
.ak-brand .ak-slide:nth-child(3){animation-delay:12s;}
@keyframes ak-fade{0%{opacity:0;visibility:visible}5%{opacity:1}33.33%{opacity:1}38.33%{opacity:0;visibility:hidden}100%{opacity:0;visibility:hidden}}
.ak-brand .ak-slide-photo{position:absolute;inset:0;background-size:cover;background-position:center;}
.ak-brand .ak-slide-white{position:absolute;inset:0;background:#fff;}
/* užší červený šikmý pás dole (zmírněná verze pásu z předlohy) */
.ak-brand .ak-band{position:absolute;left:0;right:0;bottom:0;height:13%;background:linear-gradient(90deg,#C8151C,var(--ak-red) 55%,#F04A50);clip-path:polygon(0 45%,100% 0,100% 100%,0 100%);}
.ak-brand .ak-slide-text{position:absolute;left:5%;top:16%;width:38%;}
/* Logo v hero: `width:60%` textového sloupce dělalo na 1400px kontejneru ~320 px
   z 200px předlohy, tedy 1,6× nahoru — a na retině 3,2×. Na stránce to bylo vidět
   jako rozmazané (nahlásil uživatel 2026-09-08). Vyšší rozlišení téhle znělky
   nemáme odkud vzít: akai.com má 320×63 bez linky „Tokyo Japan" a jen na bílé,
   obrázky kategorií na obou e-shopech 160 px. Logo se proto kreslí NEJVÝŠ ve své
   vlastní velikosti — zmenšovat se smí, zvětšovat ne. */
.ak-brand .ak-slide-text .ak-slide-logo{width:200px;max-width:58%;margin-bottom:1.2cqw;}
.ak-brand .ak-slide-text h2{font-size:2.9cqw;line-height:1.1;font-weight:800;color:var(--ak-ink);margin-bottom:.9cqw;}
.ak-brand .ak-slide-text p{font-size:1.25cqw;color:#374151;margin-bottom:1.6cqw;max-width:34ch;}
.ak-brand .ak-slide-text .ak-pill{font-size:1.1cqw;padding:.6cqw 2.2cqw;}
.ak-brand .ak-slide-prod{position:absolute;right:6%;top:6%;width:48%;height:70%;display:flex;align-items:center;justify-content:center;}
.ak-brand .ak-slide-prod img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 24px rgba(0,0,0,.18));}
.ak-brand .ak-dots{position:absolute;bottom:4%;left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:3;}
.ak-brand .ak-dots span{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.55);animation:ak-dot 18s infinite;}
.ak-brand .ak-dots span:nth-child(1){animation-delay:0s}.ak-brand .ak-dots span:nth-child(2){animation-delay:6s}.ak-brand .ak-dots span:nth-child(3){animation-delay:12s}
@keyframes ak-dot{0%,33.33%{background:#fff}33.34%,100%{background:rgba(255,255,255,.55)}}

/* ---------- karty kategorií (rounded-3xl, h-250, gradienty předlohy) ---------- */
.ak-brand .ak-cats{background:var(--ak-g100);padding:40px 0 20px;}
.ak-brand .ak-cat-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;}
.ak-brand .ak-cat{position:relative;height:250px;border-radius:24px;padding:40px 0 40px 20px;display:flex;align-items:flex-end;color:#fff;overflow:hidden;transition:transform .3s;}
.ak-brand .ak-cat:hover{transform:scale(1.03);}
.ak-brand .ak-cat-red{background:linear-gradient(to bottom right,var(--ak-red),rgba(237,28,36,.9));}
.ak-brand .ak-cat-grey{background:linear-gradient(to bottom right,rgba(156,163,175,.9),#F3F4F6);}
.ak-brand .ak-cat > div{width:58%;position:relative;z-index:2;}
.ak-brand .ak-cat p{font-size:36px;line-height:40px;font-weight:700;opacity:.9;margin-bottom:40px;text-transform:uppercase;position:relative;z-index:2;}
.ak-brand .ak-cat .ak-pill{position:relative;z-index:2;margin-bottom:16px;}
.ak-brand .ak-cat img{position:absolute;right:0;top:50%;transform:translateY(-50%);width:250px;}
.ak-brand .ak-cat-grey img{mix-blend-mode:multiply;right:12px;width:230px;}
.ak-brand .ak-cat-grey p{color:#111827;opacity:.85;}

/* ---------- produktové sekce (Popular Product) ---------- */
.ak-brand .ak-products{background:var(--ak-g100);padding:20px 0 40px;}
.ak-brand .ak-products h2{font-size:24px;line-height:32px;font-weight:700;color:var(--ak-ink);margin:24px 0 20px;}
.ak-brand .ak-products .ak-sub{color:var(--ak-grey);font-size:15px;margin:-12px 0 20px;}
.ak-brand .ak-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.ak-brand .ak-card{display:block;transition:opacity .2s;}
.ak-brand .ak-card:hover .ak-card-img img{opacity:.75;}
.ak-brand .ak-card-img{aspect-ratio:7/8;width:100%;overflow:hidden;border-radius:8px;background:var(--ak-g200);display:flex;align-items:center;justify-content:center;}
.ak-brand .ak-card-img img{width:100%;height:100%;object-fit:contain;padding:8%;mix-blend-mode:multiply;transition:opacity .2s;}
.ak-brand .ak-card h3{margin-top:16px;text-align:center;font-size:14px;line-height:20px;font-weight:600;color:var(--ak-ink);}
.ak-brand .ak-card p{text-align:center;font-size:13px;color:var(--ak-grey);margin-top:2px;}
.ak-brand .ak-more{text-align:center;margin-top:28px;}

/* ---------- pás O značce (bg-cover, h-96, rounded-3xl) ---------- */
.ak-brand .ak-about{background:var(--ak-g100);padding:20px 0 40px;}
.ak-brand .ak-about-band{position:relative;height:384px;border-radius:24px;overflow:hidden;background-image:url('/shop-data/campaign/akai/ak-kuchyne-foto.png');background-size:cover;background-position:center;}
.ak-brand .ak-about-band::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(17,24,39,.82) 0%,rgba(17,24,39,.6) 55%,rgba(17,24,39,.25) 100%);}
.ak-brand .ak-about-text{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;justify-content:center;padding:40px 80px;max-width:760px;color:#fff;}
.ak-brand .ak-about-text .ak-kicker{color:#FCA5A5;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:13px;margin-bottom:10px;}
.ak-brand .ak-about-text h2{font-size:30px;line-height:36px;font-weight:700;margin-bottom:14px;}
.ak-brand .ak-about-text p{font-size:18px;line-height:28px;color:#F3F4F6;}
.ak-brand .ak-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:32px;}
.ak-brand .ak-fact{background:#fff;border-radius:24px;padding:28px 28px 26px;box-shadow:0 1px 3px rgba(0,0,0,.06);}
.ak-brand .ak-fact strong{display:block;color:var(--ak-red);font-size:30px;font-weight:800;line-height:1;margin-bottom:10px;}
.ak-brand .ak-fact h3{font-size:17px;font-weight:700;margin-bottom:6px;}
.ak-brand .ak-fact p{font-size:15px;color:var(--ak-grey);}

/* ---------- patička (bg-gray-100) ---------- */
.ak-brand .ak-footer{background:var(--ak-g200);padding:40px 0 32px;}
.ak-brand .ak-footer .ak-wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px;}
.ak-brand .ak-footer .ak-logo{width:140px;margin-bottom:14px;}
.ak-brand .ak-footer p{font-size:14px;color:#374151;max-width:44ch;}
.ak-brand .ak-footer h4{font-size:15px;font-weight:700;margin-bottom:10px;}
.ak-brand .ak-footer ul{list-style:none;}
.ak-brand .ak-footer li{font-size:14px;color:#374151;margin-bottom:6px;}
.ak-brand .ak-footer li a:hover{color:var(--ak-red);}

@media (max-width:1000px){
  .ak-brand .ak-grid{grid-template-columns:repeat(3,1fr);}
  .ak-brand .ak-cat p{font-size:28px;line-height:32px;margin-bottom:28px;}
  .ak-brand .ak-cat img{width:200px;}
}
@media (max-width:800px){
  .ak-brand .ak-wrap{padding:0 18px;}
  .ak-brand .ak-nav a{font-size:15px;}
  .ak-brand .ak-cat-grid{grid-template-columns:1fr;}
  .ak-brand .ak-grid{grid-template-columns:repeat(2,1fr);gap:16px;}
  .ak-brand .ak-about-text{padding:28px 28px;}
  .ak-brand .ak-about-text h2{font-size:24px;line-height:30px;}
  .ak-brand .ak-about-text p{font-size:16px;line-height:24px;}
  .ak-brand .ak-facts{grid-template-columns:1fr;}
  .ak-brand .ak-footer .ak-wrap{grid-template-columns:1fr 1fr;}
}
@media (max-width:560px){
  .ak-brand .ak-hero{padding-top:0;height:auto;}
  .ak-brand .ak-slide{position:relative;opacity:1;visibility:visible;animation:none;display:none;}
  .ak-brand .ak-slide:first-child{display:block;padding:24px 18px 70px;}
  .ak-brand .ak-slide-text{position:static;width:100%;}
  .ak-brand .ak-slide-text .ak-slide-logo{width:120px;}
  .ak-brand .ak-slide-text h2{font-size:26px;}
  .ak-brand .ak-slide-text p{font-size:15px;}
  .ak-brand .ak-slide-text .ak-pill{font-size:15px;padding:8px 26px;}
  .ak-brand .ak-slide-prod{position:static;width:100%;height:auto;margin-top:16px;}
  .ak-brand .ak-slide-prod img{max-height:220px;}
  .ak-brand .ak-dots,.ak-brand .ak-slide-white{display:none;}
  .ak-brand .ak-slide-text{position:relative;z-index:2;}
  .ak-brand .ak-slide-prod{position:relative;z-index:2;}
  .ak-brand .ak-band{height:28px;}
  .ak-brand .ak-cat{height:220px;padding-left:16px;}
  .ak-brand .ak-cat p{font-size:22px;line-height:26px;margin-bottom:24px;}
  .ak-brand .ak-cat > div{width:60%;}
  .ak-brand .ak-cat img{width:150px;}
  .ak-brand .ak-grid{grid-template-columns:1fr 1fr;}
  .ak-brand .ak-footer .ak-wrap{grid-template-columns:1fr;}
}
/* ---------- guardy šablony Upgates (stejné jako u ostatních brand pages) ---------- */
/* Šablona kategorie vykresluje nad obsahem vlastní H1 s názvem stránky; hero má svůj
   vlastní claim, takže duplicitní nadpis skryjeme. */
body:has(.ak-brand-wrapper) h1.ph-main,
body:has(.ak-brand-wrapper) h1.ph-page { display: none; }
/* vlastní H1 skrytý jen vizuálně (fragment ho jinak nemá) — brand_nadpis.py */
.ak-brand .ak-sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
/* Obsahový sloupec šablony je omezený na 640 px, brand page potřebuje plnou šířku. */
.max-w-xl:has(.ak-brand-wrapper) { max-width: none; }
/* Nadpisy: šablona tlačí vlastní font. AKAI má záměrně SYSTÉMOVÝ font (jako akai.global),
   takže se nevynucuje žádná rodina, jen se přebije dědění ze šablony. */
.ak-brand :where(h1, h2, h3, h4, h5, h6) {
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}