@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500;700&family=Inter:wght@400;500;600&display=swap');

/* ---------- scoped reset & tokeny (změřeno z předlohy) ---------- */
.nk-brand{
  --nk-ink:#111111;
  --nk-grey:#707072;
  --nk-light:#F5F5F5;
  --nk-line:#E5E5E5;
  font-family:'Inter',Helvetica,Arial,sans-serif;
  color:var(--nk-ink);
  font-size:16px;
  line-height:1.5;
  max-width:1400px;
  margin:0 auto;
  background:#fff;
}
.nk-brand *,.nk-brand *::before,.nk-brand *::after{box-sizing:border-box;margin:0;padding:0;}
.nk-brand img{max-width:100%;height:auto;display:block;}
.nk-brand a{text-decoration:none;color:inherit;}

/* ---------- typografie dle předlohy ---------- */
.nk-brand .nk-futura{font-family:'Oswald',Impact,sans-serif;font-weight:700;text-transform:uppercase;line-height:1.2;letter-spacing:-.01em;}
.nk-brand .nk-h{font-family:'Inter',Helvetica,Arial,sans-serif;font-weight:500;font-size:24px;line-height:1.25;color:var(--nk-ink);}
.nk-brand .nk-btn{
  display:inline-block;background:#fff;color:var(--nk-ink);border-radius:30px;
  font-family:'Inter',Helvetica,Arial,sans-serif;font-weight:500;font-size:16px;
  padding:6px 16px;line-height:1.75;transition:background .2s,color .2s;
}
.nk-brand .nk-btn:hover{background:#CACACB;}
.nk-brand .nk-btn-dark{background:var(--nk-ink);color:#fff;}
.nk-brand .nk-btn-dark:hover{background:var(--nk-grey);}

/* ---------- servisní lišta + bílá hlavička se swooshem ---------- */
.nk-brand .nk-topbar{background:var(--nk-light);text-align:right;font-size:12px;font-weight:500;color:var(--nk-ink);padding:8px 40px;}
.nk-brand .nk-header{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:12px 40px;}
.nk-brand .nk-swoosh{width:60px;height:60px;display:block;color:var(--nk-ink);}
.nk-brand .nk-swoosh svg{width:100%;height:100%;display:block;}
.nk-brand .nk-nav{display:flex;flex-wrap:wrap;gap:6px 24px;}
.nk-brand .nk-nav a{font-weight:500;font-size:16px;color:var(--nk-ink);padding:6px 0;border-bottom:2px solid transparent;}
.nk-brand .nk-nav a:hover{border-bottom-color:var(--nk-ink);}

/* ---------- celoplošný hero slider (text vlevo dole jako předloha) ---------- */
.nk-brand .nk-hero{position:relative;width:100%;padding-top:48.6%;overflow:hidden;background:#111;container-type:inline-size;}
.nk-brand .nk-slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;visibility:hidden;animation:nk-fade 14s infinite;}
.nk-brand .nk-slide:nth-child(1){animation-delay:0s;}
.nk-brand .nk-slide:nth-child(2){animation-delay:7s;}
@keyframes nk-fade{0%{opacity:0;visibility:visible;}5%{opacity:1;}50%{opacity:1;}55%{opacity:0;visibility:hidden;}100%{opacity:0;visibility:hidden;}}
.nk-brand .nk-slide-text{position:absolute;left:3.2cqw;bottom:4cqw;z-index:1;color:#fff;max-width:58%;}
.nk-brand .nk-slide-text h2{font-size:5.5cqw;color:#fff;margin-bottom:.9cqw;}
.nk-brand .nk-slide-text p{font-size:1.25cqw;font-weight:500;margin-bottom:1.6cqw;}
.nk-brand .nk-slide-text .nk-btn{font-size:1.15cqw;padding:.45cqw 1.2cqw;}
.nk-brand .nk-dots{position:absolute;left:0;right:0;bottom:1.6cqw;display:flex;justify-content:center;gap:8px;z-index:1;}
.nk-brand .nk-dots i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.45);animation:nk-dot 14s infinite;}
.nk-brand .nk-dots i:nth-child(1){animation-delay:0s;}
.nk-brand .nk-dots i:nth-child(2){animation-delay:7s;}
@keyframes nk-dot{0%{background:#fff;}50%{background:#fff;}51%{background:rgba(255,255,255,.45);}100%{background:rgba(255,255,255,.45);}}

/* ---------- sekce s centrovaným titulkem (jako NAKUPUJ NAŠE IKONY předlohy) ---------- */
.nk-brand .nk-section{padding:44px 40px 28px;text-align:center;}
.nk-brand .nk-section-head{display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:34px;}
.nk-brand .nk-section-head .nk-h{font-family:'Oswald',Impact,sans-serif;font-weight:700;font-size:56px;text-transform:uppercase;line-height:1.2;letter-spacing:-.01em;}
.nk-brand .nk-section-head a{font-weight:500;font-size:14px;color:var(--nk-grey);text-decoration:underline;text-underline-offset:3px;}
.nk-brand .nk-section-head a:hover{color:var(--nk-ink);}

/* ---------- dvě feature dlaždice 1:1 s popiskem dole (dle předlohy) ---------- */
.nk-brand .nk-features{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0 40px;}
.nk-brand .nk-feature{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;background-size:cover;background-position:center;text-align:left;}
.nk-brand .nk-feature::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.45),rgba(0,0,0,0) 45%);}
.nk-brand .nk-feature-text{position:absolute;left:36px;bottom:36px;right:36px;z-index:1;color:#fff;}
.nk-brand .nk-feature-text .nk-eyebrow{font-size:16px;font-weight:500;margin-bottom:6px;}
.nk-brand .nk-feature-text h3{font-family:'Inter',Helvetica,Arial,sans-serif;font-weight:500;font-size:24px;line-height:1.25;margin-bottom:14px;}

/* ---------- miniatury produktů (ikony jako v sekci NAKUPUJ NAŠE IKONY předlohy) ---------- */
.nk-brand .nk-cards{display:flex;flex-wrap:wrap;justify-content:center;gap:30px 26px;max-width:1160px;margin:0 auto;}
.nk-brand .nk-card{display:block;width:118px;text-align:center;}
.nk-brand .nk-card-img{width:96px;height:96px;margin:0 auto;display:flex;align-items:center;justify-content:center;overflow:hidden;background:transparent;}
.nk-brand .nk-card-img img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transition:transform .3s;}
.nk-brand .nk-card:hover .nk-card-img img{transform:scale(1.08);}
.nk-brand .nk-card h3{font-weight:500;font-size:14px;color:var(--nk-ink);margin:12px 0 2px;line-height:1.3;}
.nk-brand .nk-card span{font-size:12px;color:var(--nk-grey);display:block;line-height:1.3;}
.nk-brand .nk-card:hover h3{text-decoration:underline;text-underline-offset:3px;}

/* ---------- čtyři sloupce odkazů (blok Boty / Oblečení / Pro děti / Doporučujeme předlohy) ---------- */
.nk-brand .nk-links{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:40px 40px 48px;border-top:1px solid var(--nk-line);}
.nk-brand .nk-links h4{font-weight:500;font-size:16px;margin-bottom:10px;}
.nk-brand .nk-links a{display:block;font-size:16px;color:var(--nk-grey);padding:3px 0;}
.nk-brand .nk-links a:hover{color:var(--nk-ink);}

/* ---------- příběh značky ---------- */
.nk-brand .nk-story{display:flex;gap:48px;align-items:flex-start;padding:52px 40px;background:var(--nk-light);}
.nk-brand .nk-story h2{flex:0 0 38%;font-size:48px;}
.nk-brand .nk-story-text{flex:1;}
.nk-brand .nk-story-text p{margin-bottom:12px;max-width:620px;color:#333;}
.nk-brand .nk-story-text p strong{font-weight:600;color:var(--nk-ink);}
.nk-brand .nk-facts{display:flex;flex-wrap:wrap;gap:28px 40px;margin-top:22px;}
.nk-brand .nk-fact b{display:block;font-family:'Oswald',Impact,sans-serif;font-weight:700;font-size:34px;line-height:1;}
.nk-brand .nk-fact span{font-size:13px;font-weight:500;color:var(--nk-grey);}

/* ---------- CTA ---------- */
.nk-brand .nk-cta{text-align:center;padding:52px 28px;}
.nk-brand .nk-cta h2{font-size:48px;margin-bottom:10px;}
.nk-brand .nk-cta p{color:var(--nk-grey);margin-bottom:22px;}

/* ---------- responzivita ---------- */
@media (max-width:900px){
    .nk-brand .nk-features{grid-template-columns:1fr;padding:0 24px;}
  .nk-brand .nk-links{grid-template-columns:1fr 1fr;padding:32px 24px;}
  .nk-brand .nk-story{flex-direction:column;gap:20px;padding:40px 24px;}
  .nk-brand .nk-story h2{flex:0 0 auto;font-size:40px;}
  .nk-brand .nk-section{padding:32px 24px 20px;}
  .nk-brand .nk-section-head .nk-h{font-size:40px;}
  
  .nk-brand .nk-header,.nk-brand .nk-topbar{padding-left:24px;padding-right:24px;}
  .nk-brand .nk-slide-text{max-width:80%;}
}
@media (max-width:520px){
  .nk-brand .nk-links{grid-template-columns:1fr;}
  .nk-brand .nk-card{width:100px;}
  .nk-brand .nk-card-img{width:80px;height:80px;}
  .nk-brand .nk-hero{padding-top:75%;}
  .nk-brand .nk-slide-text h2{font-size:9cqw;}
  .nk-brand .nk-slide-text p{font-size:2.8cqw;}
  .nk-brand .nk-slide-text .nk-btn{font-size:2.6cqw;padding:1cqw 2.6cqw;}
  .nk-brand .nk-header{justify-content:center;}
}

/* ---------- 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í headline, takže duplicitní nadpis skryjeme. */
body:has(.nk-brand-wrapper) h1.ph-main,
body:has(.nk-brand-wrapper) h1.ph-page { display: none; }
/* vlastní H1 skrytý jen vizuálně (fragment ho jinak nemá) — brand_nadpis.py */
.nk-brand .nk-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(.nk-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 Oswald i pro nadpisy uvnitř brand page. */
.nk-brand :where(h1, h2, h3, h4, h5, h6) { font-family: 'Oswald', Impact, sans-serif; }