:root{
  --bg:#FFFBF8; --ink:#2B1B12; --muted:#7A6A5F;
  --amber:#B8530E; --amber2:#C96921; --wave:#E18F4E; --peach:#F4BB8B;
  --line:#EFE2D9;
  --cookie:linear-gradient(135deg,#F4BB8B,#E18F4E 40%,#C96921 70%,#A54F0F);
}
*{margin:0;padding:0;box-sizing:border-box}
/* mandatory: aretace DRŽÍ na sekci (běžící video) — dál se jede jen razantnějším scrollem */
html{scroll-behavior:smooth;scroll-padding-top:56px;scroll-snap-type:y mandatory}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
main{position:relative;z-index:1}
a{color:inherit}

/* ── Zlatá nit: vysílací signál pulzující celou stránkou ─────────── */
.signal-field{position:fixed;inset:0;z-index:0;display:flex;align-items:center;justify-content:center;pointer-events:none;overflow:hidden}
.sf-ring{position:absolute;width:42vmax;height:42vmax;border-radius:50%;border:1.5px solid var(--wave);opacity:0;animation:sfripple 7.5s ease-out infinite}
.sf-ring:nth-child(2){animation-delay:2.5s}
.sf-ring:nth-child(3){animation-delay:5s}
@keyframes sfripple{0%{transform:scale(.2);opacity:.14}80%{opacity:.04}100%{transform:scale(1.35);opacity:0}}

/* ── Hlavička ────────────────────────────────────────────────────── */
.hd{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:12px 24px;transition:background .3s,backdrop-filter .3s,box-shadow .3s}
.hd.scrolled{background:rgba(255,251,248,.82);backdrop-filter:blur(14px);box-shadow:0 1px 0 rgba(0,0,0,.05)}
.hd-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:600;font-size:18px}
.hd-logo{width:30px;height:30px;border-radius:8px}
.hd-nav{display:flex;gap:24px}
.hd-nav a{color:var(--muted);text-decoration:none;font-size:15px;transition:color .2s}
.hd-nav a:hover{color:var(--amber)}
.hd-cta{background:var(--amber);color:#fff;text-decoration:none;font-size:14px;padding:8px 16px;border-radius:10px;
  transition:transform .15s,filter .2s}
.hd-cta:hover{filter:brightness(1.06);transform:translateY(-1px)}

/* ── Jazykový přepínač ───────────────────────────────────────────── */
#lang-picker{
  appearance:none;-webkit-appearance:none;
  background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%237A6A5F'/%3E%3C/svg%3E") no-repeat right 8px center;
  border:1px solid var(--line);border-radius:8px;
  padding:5px 26px 5px 10px;font-size:13px;color:var(--ink);cursor:pointer;max-width:140px;
}
#lang-picker:hover{border-color:var(--amber2)}
@media(max-width:720px){#lang-picker{max-width:100px;font-size:12px;padding:4px 22px 4px 8px}}

/* ── Hero ────────────────────────────────────────────────────────── */
.hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  padding:96px 24px 64px;position:relative;scroll-snap-align:start}
.emitter{position:relative;width:150px;height:150px;display:flex;align-items:center;justify-content:center;margin-bottom:36px}
.em-logo{width:98px;height:98px;border-radius:24px;box-shadow:0 14px 44px rgba(184,83,14,.30);position:relative;z-index:2}
.em-ring{position:absolute;top:50%;left:50%;width:98px;height:98px;margin:-49px 0 0 -49px;border-radius:28px;
  border:2px solid var(--wave);opacity:0;animation:emripple 3.4s ease-out infinite}
.em-ring:nth-child(2){animation-delay:1.13s}
.em-ring:nth-child(3){animation-delay:2.26s}
@keyframes emripple{0%{transform:scale(1);opacity:.5}100%{transform:scale(2.7);opacity:0;border-radius:50%}}
.hero h1{font-size:clamp(34px,6vw,64px);font-weight:600;line-height:1.08;letter-spacing:-.02em;margin-bottom:22px}
/* Rotující moto: řádky se prolínají (script.js), druhá osa v brand amber */
#hero-motto .mline{display:inline-block;transition:opacity .45s ease,transform .45s ease}
#hero-motto.motto-out .mline{opacity:0;transform:translateY(12px)}
#hero-motto #motto-b{color:var(--amber)}
.hero-sub{font-size:clamp(16px,2.4vw,21px);color:var(--muted);max-width:560px;margin:0 auto 32px}
.hero-tag{font-style:italic;color:var(--amber2);font-size:15px;margin-top:28px}
.scroll-cue{position:absolute;bottom:26px;left:50%;width:20px;height:20px;margin-left:-10px;
  border-right:2px solid var(--amber2);border-bottom:2px solid var(--amber2);transform:rotate(45deg);
  opacity:.55;animation:bounce 1.9s infinite}
@keyframes bounce{0%,100%{transform:rotate(45deg) translateY(0)}50%{transform:rotate(45deg) translateY(8px)}}

/* ── Store badge ─────────────────────────────────────────────────── */
.badges{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.badge{display:inline-flex;align-items:center;gap:10px;background:#1A140F;color:#fff;text-decoration:none;
  border-radius:12px;padding:9px 16px;transition:transform .15s,filter .2s}
.badge:hover{transform:translateY(-2px);filter:brightness(1.15)}
.badge-ic{width:24px;height:24px;fill:#fff;flex:none}
.badge span{display:flex;flex-direction:column;line-height:1.15;text-align:left}
.badge small{font-size:10px;opacity:.85}
.badge b{font-size:15px;font-weight:500}

/* ── Příběhy — celoplošné pruhy (full-bleed bandy, žádná „okna") ──── */
/* Film sedí ÚPLNĚ nahoře sekce (aretace chytí přesně na něm, žádný barevný okraj nad ním);
   text se centruje ve zbývajícím prostoru pruhu (margin:auto). */
.story{min-height:100vh;display:flex;align-items:center;justify-content:flex-start;text-align:center;
  flex-direction:column;padding:0 0 48px;position:relative;scroll-snap-align:start}
.story-in{max-width:760px;padding:0 24px;margin-top:auto;margin-bottom:auto}
/* Střídavé podbarvení pruhů přes celou šířku stránky */
.s1,.s4,.s6{background:#FFF1E6}
.s2,.s5{background:var(--bg)}
.kicker{text-transform:uppercase;letter-spacing:.14em;font-size:13px;color:var(--amber);font-weight:600;margin-bottom:18px}
.story h2{font-size:clamp(26px,4.6vw,48px);font-weight:600;line-height:1.12;letter-spacing:-.02em;margin-bottom:18px}
.micro{font-size:clamp(15px,2vw,19px);color:var(--muted);margin-bottom:28px}
.slogan{font-size:clamp(20px,3.4vw,34px);font-weight:500;color:var(--amber);line-height:1.25}

/* ── Jak to funguje / Soukromí — celoplošné pruhy ────────────────── */
.how,.privacy{padding:96px 24px;scroll-snap-align:start}
.how{background:#FFFFFF}
.privacy{background:#241712;color:#F2E3D8}
.privacy .kicker{color:var(--wave)}
.privacy .step{background:rgba(255,255,255,.07);box-shadow:none}
.privacy .step b{color:#F6E8DC}
.privacy .step p{color:#C9B6A8}
.how-in{max-width:920px;margin:0 auto;text-align:center}
.how h2,.privacy h2{font-size:clamp(26px,4vw,42px);font-weight:600;margin-bottom:40px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;text-align:left}
.step{background:#FFF6EE;border:none;border-radius:18px;padding:24px;box-shadow:0 8px 28px rgba(43,27,18,.07)}
.step-n{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;
  background:var(--peach);color:#7A3C09;font-weight:600;margin-bottom:14px}
.step b{display:block;font-size:18px;margin-bottom:6px}
.step p{color:var(--muted);font-size:15px}

/* ── Stáhnout (finální gradientní pruh) ──────────────────────────── */
.download{min-height:78vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  padding:96px 24px;position:relative;overflow:hidden;background:linear-gradient(135deg,#E89A57,#B8530E);color:#fff;
  scroll-snap-align:start}
.download h2{font-size:clamp(28px,4.5vw,46px);font-weight:600;margin-bottom:10px}
.download p{font-size:18px;opacity:.93;margin-bottom:28px}
.dl-emitter{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.dl-emitter .em-ring{border-color:rgba(255,255,255,.5);width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%}
.download .badges{position:relative;z-index:1}
.download .badge{background:rgba(0,0,0,.28)}

/* ── Patička ─────────────────────────────────────────────────────── */
.ft{background:#241712;color:#CDBBAE;padding:48px 24px;display:flex;gap:40px;flex-wrap:wrap;justify-content:space-between;
  scroll-snap-align:end}  /* s mandatory snapem musí mít i konec stránky aretační bod */
.ft .hd-brand{color:#F0DFD6}
.ft-col{min-width:170px}
.ft-col>b{display:block;color:#F0DFD6;font-size:15px;margin-bottom:12px;font-weight:600}
.ft-col a:not(.hd-brand){display:block;color:#CDBBAE;text-decoration:none;font-size:14px;margin-bottom:8px;transition:color .2s}
.ft-col a:hover{color:var(--wave)}
.ft-fine{font-size:13px;color:#9A8579;max-width:300px;margin-top:12px;line-height:1.6}

/* ── Rozetmívání / stmívání při scrollu ──────────────────────────── */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.6,.2,1),transform .9s cubic-bezier(.2,.6,.2,1)}
.reveal.in{opacity:1;transform:none}
.story-in .reveal:nth-child(2),.hero .reveal:nth-child(2){transition-delay:.1s}
.story-in .reveal:nth-child(3),.hero .reveal:nth-child(3){transition-delay:.2s}
.story-in .reveal:nth-child(4),.hero .reveal:nth-child(4){transition-delay:.3s}
.hero .reveal:nth-child(5){transition-delay:.4s}
.steps .reveal:nth-child(2){transition-delay:.12s}
.steps .reveal:nth-child(3){transition-delay:.24s}

/* ── Responzivně ─────────────────────────────────────────────────── */
@media (max-width:720px){
  .hd-nav{display:none}
  .hd{padding:10px 18px}
  .steps{grid-template-columns:1fr}
  .hero{padding:88px 20px 56px}
  .story{padding:0 0 40px}
  .story-in{padding:0 20px}
  .ft{gap:28px}
}

/* ── Méně pohybu ─────────────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  html{scroll-snap-type:none;scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .sf-ring,.em-ring,.scroll-cue{animation:none}
  .sf-ring{opacity:.05}
  .story-scene{opacity:1;transform:none}
  .sc-card:last-child{opacity:1;transform:none}
  .sc-bar{display:none}
}

/* ── Story scene — full-bleed filmový pás přes celou šířku ───────── */
/* Žádné „okno v okně": bez zaoblení, bez stínu, od kraje ke kraji (à la celoplošné sekce). */
.story-scene{
  width:100%;max-width:none;margin:0 auto 52px;
  border-radius:0;overflow:hidden;
  opacity:0;transform:translateY(14px);
  transition:opacity .9s ease,transform .9s ease;
}
.story-scene.sc-visible{opacity:1;transform:none}

.s1,.s2,.s3,.s4,.s5,.s6,.s7{flex-direction:column;padding-top:0;padding-bottom:48px}

/* Film frame */
.sc-film{
  position:relative;width:100%;aspect-ratio:760/266;max-height:62vh;
  background:#1C0F08;overflow:hidden;
}

/* Cinematic top/bottom vignette */
.sc-film::before,.sc-film::after{
  content:'';position:absolute;left:0;right:0;height:36%;z-index:2;pointer-events:none;
}
.sc-film::before{top:0;background:linear-gradient(to bottom,#1C0F08 10%,transparent)}
.sc-film::after {bottom:0;background:linear-gradient(to top,#1C0F08 10%,transparent)}

/* Cards: all stacked, hidden */
.sc-card{
  position:absolute;inset:0;z-index:1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:14px;padding:28px 12%;text-align:center;
  opacity:0;transform:translateY(22px);
}
.sc-num{
  font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:#8B6244;font-family:inherit;
}
.sc-shot{
  font-size:clamp(12px,1.65vw,18px);color:#EDD8C4;line-height:1.6;
  max-width:640px;font-family:inherit;
}
.sc-line{
  font-size:clamp(15px,2.1vw,24px);font-weight:500;font-style:italic;
  color:#E18F4E;line-height:1.35;max-width:680px;font-family:inherit;
}
.sc-note{
  font-size:clamp(10px,1.2vw,13px);color:#7A5A3A;font-style:italic;font-family:inherit;
}

/* Progress bar */
.sc-bar{
  position:absolute;bottom:0;left:0;height:2px;width:0;
  background:var(--amber);z-index:3;opacity:.65;
}

/* ── Card animations (.sc-play) ─────────────────────────────────── */
/* Interval 3s, duration 3.6s → 0.6s překryv = crossfade bez černých mezer */
.sc-play .sc-card:nth-child(1){animation:cardFlow 3.6s linear  0.3s both}
.sc-play .sc-card:nth-child(2){animation:cardFlow 3.6s linear  3.3s both}
.sc-play .sc-card:nth-child(3){animation:cardFlow 3.6s linear  6.3s both}
.sc-play .sc-card:nth-child(4){animation:cardFlow 3.6s linear  9.3s both}
.sc-play .sc-card:nth-child(5){animation:cardFlow 3.6s linear 12.3s both}
.sc-play .sc-card:nth-child(6){animation:cardFlow 3.6s linear 15.3s both}
.sc-play .sc-card:nth-child(7){animation:cardFlow 3.6s linear 18.3s both}
.sc-play .sc-card:nth-child(8){animation:cardFlow 3.6s linear 21.3s both}
.sc-play .sc-card:nth-child(9){animation:cardLast 3.6s linear 24.3s both}
.sc-play .sc-bar              {animation:barFill    28s linear  0.3s both}

/* Bez plateau: karta vystoupá nahoru, v půlce je plně viditelná, plynule odejde */
@keyframes cardFlow{
  0%  {opacity:0;transform:translateY(24px);animation-timing-function:cubic-bezier(0,.2,.3,1)}
  50% {opacity:1;transform:translateY(0);  animation-timing-function:cubic-bezier(.6,0,1,.8)}
  100%{opacity:0;transform:translateY(-18px)}
}
/* Poslední karta zůstane */
@keyframes cardLast{
  0%  {opacity:0;transform:translateY(24px);animation-timing-function:cubic-bezier(0,.2,.3,1)}
  50% {opacity:1;transform:translateY(0)}
  100%{opacity:1;transform:translateY(0)}
}
@keyframes barFill{
  from{width:0}to{width:100%}
}

@media(max-width:720px){
  .story-scene{border-radius:0;margin-bottom:32px}
  .s1{padding-top:0;padding-bottom:40px}
  .sc-card{gap:12px;padding:24px 8%}
  /* Na mobilu je široký filmový poměr moc nízký (~⅕ obrazovky) → pevná výška ~56vh,
     ať je plocha videa vyvážená s textem sloganu pod ním. */
  .sc-film{aspect-ratio:auto;height:56vh;max-height:none}
  .sc-shot{font-size:15px;max-width:88%}
  .sc-line{font-size:19px;max-width:92%}
}