/* Úvodná stránka pre rodiča (statické HTML v index.html). Zdroj: návrh 9ZGVb9XsJwT3za82JkbrFk. Všetko pod #landing. */
html.landing-on,html.landing-on body{background:#070B1E}
html.app-on #landing{display:none}
html:not(.app-on) #root:empty{display:none}
#landing{display:block;overflow-x:clip}

/* Koncept: noc z detskej knihy (obloha → papier → zlato), ale rozprávané rodičovi. Jeden tmavý svet, bez svetlej verzie. */
#landing{
  --night:#070B1E; --night-2:#131B45; --night-3:#24306A;
  --paper:#F3E7C9; --paper-2:#E9DCBC; --ink:#2B2116; --ink-soft:#6B5A45;
  --gold:#E8B04B; --gold-hi:#FFD87A; --gold-ink:#1A1208; --cream:#F3E7C9; --cream-soft:#C9BFA6;
  --red:#B4372B; --line:rgba(243,231,201,.16);
  --f-title:Fraunces,Georgia,'Times New Roman',serif;
  --f-book:Literata,Georgia,'Times New Roman',serif;
  --f-hand:Caveat,'Comic Sans MS',cursive;
  --f-ui:Nunito,system-ui,-apple-system,'Segoe UI',sans-serif;
  color-scheme:dark;
}
#landing *{box-sizing:border-box}
html.landing-on{scroll-behavior:smooth}
#landing{background:var(--night);color:var(--cream);font-family:var(--f-book);font-weight:500;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
#landing img{max-width:100%;display:block}
#landing a{color:inherit}
#landing :focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
#landing .wrap{max-width:1120px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
#landing .narrow{max-width:680px}
#landing h1,#landing h2,#landing h3{font-family:var(--f-title);font-weight:700;line-height:1.08;text-wrap:balance;margin:0;letter-spacing:-.01em}
#landing h1 em,#landing h2 em,#landing h3 em{font-style:italic;color:var(--gold-hi);font-weight:600}
#landing p{margin:0}
#landing .hand{font-family:var(--f-hand);font-weight:700;color:var(--gold-hi);font-size:1.6rem;line-height:1.1}
#landing .eyebrow{font-family:var(--f-ui);font-weight:900;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
#landing .muted{color:var(--cream-soft)}
#landing .picker{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:#03050F;border-bottom:1px solid var(--line);font-family:var(--f-ui)}
#landing .picker .wrap{display:flex;align-items:center;gap:10px;padding-block:8px;overflow-x:auto;scrollbar-width:none}
#landing .picker__lbl{font-weight:800;font-size:.8rem;color:var(--cream-soft);white-space:nowrap}
#landing .picker button{flex:none;font:inherit;font-weight:800;font-size:.9rem;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--cream);cursor:pointer;white-space:nowrap}
#landing .picker button[aria-selected="true"]{background:var(--gold);color:var(--gold-ink);border-color:var(--gold)}

/* ——— spoločné prvky stránky ——— */
#landing .site{position:relative;background:linear-gradient(180deg,var(--night) 0%,var(--night-2) 38%,var(--night) 100%)}
#landing .stars{position:absolute;inset:0 0 auto;height:900px;pointer-events:none;opacity:.9;
  background-image:radial-gradient(1.4px 1.4px at 12% 18%,#FFF6DA,transparent 60%),radial-gradient(1px 1px at 28% 8%,#FFF6DA,transparent 60%),radial-gradient(1.6px 1.6px at 44% 22%,#FFF6DA,transparent 60%),radial-gradient(1px 1px at 63% 12%,#FFF6DA,transparent 60%),radial-gradient(1.3px 1.3px at 78% 26%,#FFF6DA,transparent 60%),radial-gradient(1px 1px at 90% 9%,#FFF6DA,transparent 60%),radial-gradient(1.2px 1.2px at 6% 42%,#FFF6DA,transparent 60%),radial-gradient(1px 1px at 52% 38%,#FFF6DA,transparent 60%),radial-gradient(1.4px 1.4px at 86% 48%,#FFF6DA,transparent 60%),radial-gradient(1px 1px at 34% 52%,#FFF6DA,transparent 60%)}
@media (prefers-reduced-motion:no-preference){#landing .stars{animation:lp-twinkle 6s ease-in-out infinite alternate}@keyframes lp-twinkle{to{opacity:.55}}}
#landing .hdr{position:relative;z-index:2}
#landing .hdr .wrap{display:flex;align-items:center;gap:12px;padding-block:14px}
#landing .brand{display:flex;align-items:center;gap:10px;text-decoration:none}
#landing .brand img{width:40px;height:40px;border-radius:50%;box-shadow:0 0 0 2px rgba(232,176,75,.55),0 0 24px rgba(255,220,140,.25)}
#landing .brand span{font-family:var(--f-title);font-style:italic;font-weight:700;font-size:1.35rem;color:var(--gold-hi)}
#landing .hdr nav{margin-left:auto;display:flex;align-items:center;gap:6px;font-family:var(--f-ui);font-weight:800;font-size:.92rem}
#landing .hdr nav a{text-decoration:none;padding:8px 10px;border-radius:10px}
#landing .hdr nav a:hover{background:rgba(243,231,201,.08)}
#landing .hdr .lang{color:var(--cream-soft);font-size:.82rem}
@media (max-width:560px){#landing .hdr .hide-sm{display:none}}

#landing .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:54px;padding:0 26px;border-radius:999px;font-family:var(--f-ui);font-weight:900;font-size:1.05rem;text-decoration:none;border:0;cursor:pointer;transition:transform .15s,box-shadow .15s}
#landing .btn--gold{background:linear-gradient(180deg,#F6CF6A,var(--gold));color:var(--gold-ink);box-shadow:0 8px 30px rgba(232,176,75,.35),inset 0 -3px 0 rgba(0,0,0,.15)}
#landing .btn--gold:hover{transform:translateY(-2px);box-shadow:0 12px 36px rgba(232,176,75,.45),inset 0 -3px 0 rgba(0,0,0,.15)}
#landing .btn--ghost{background:transparent;color:var(--cream);box-shadow:inset 0 0 0 1.5px rgba(243,231,201,.4)}
#landing .btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--cream)}
#landing .ctas{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
#landing .fine{font-family:var(--f-ui);font-weight:700;font-size:.88rem;color:var(--cream-soft)}
#landing .fine b{color:var(--cream)}

#landing .sec{padding-block:72px;position:relative}
#landing .sec__head{display:flex;flex-direction:column;gap:12px;margin-bottom:36px;max-width:640px}
#landing .sec__head h2{font-size:clamp(1.9rem,4.4vw,2.8rem)}

/* papierová strana – rovnaký materiál ako detská kniha */
#landing .paper{background:var(--paper);color:var(--ink);border-radius:6px 16px 16px 6px;
  background-image:radial-gradient(circle at 30% 20%,rgba(255,255,255,.45),transparent 60%),repeating-linear-gradient(0deg,rgba(120,90,50,.045) 0 2px,transparent 2px 5px);
  box-shadow:inset 18px 0 30px -18px rgba(80,50,20,.45),0 24px 60px rgba(0,0,0,.45)}
#landing .paper h2,#landing .paper h3{color:var(--ink)}
#landing .paper h2 em,#landing .paper h3 em{color:var(--red)}
#landing .paper .hand{color:#1F3C88}
#landing .paper .muted{color:var(--ink-soft)}

/* kroky (skutočné poradie) */
#landing .steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;counter-reset:s}
#landing .step{padding:26px 24px 28px;display:flex;flex-direction:column;gap:10px;min-width:0}
#landing .step__n{font-family:var(--f-title);font-style:italic;font-weight:700;font-size:2.6rem;line-height:1;color:var(--red)}
#landing .step h3{font-size:1.35rem}
#landing .step p{font-size:1rem;color:var(--ink-soft)}
#landing .step__who{font-family:var(--f-ui);font-weight:900;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
@media (max-width:820px){#landing .steps{grid-template-columns:1fr}}

/* dôvera */
#landing .trust{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden}
#landing .trust div{background:var(--night);padding:22px 20px;display:flex;flex-direction:column;gap:6px;min-width:0}
#landing .trust b{font-family:var(--f-title);font-size:1.15rem;font-weight:700;color:var(--cream)}
#landing .trust span{font-size:.95rem;color:var(--cream-soft);line-height:1.5}
#landing .trust svg{width:28px;height:28px;stroke:var(--gold);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;margin-bottom:4px}
@media (max-width:900px){#landing .trust{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){#landing .trust{grid-template-columns:1fr}}

/* cena */
#landing .price{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;align-items:center}
#landing .price__card{padding:30px 28px;display:flex;flex-direction:column;gap:14px}
#landing .price__row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:12px 0;border-top:1px dashed rgba(43,33,22,.25);font-family:var(--f-ui);font-weight:800}
#landing .price__row b{font-family:var(--f-title);font-size:1.5rem;font-variant-numeric:tabular-nums}
#landing .price__row small{font-weight:700;color:var(--ink-soft)}
#landing .price__free{display:flex;align-items:center;gap:10px;font-family:var(--f-ui);font-weight:900;color:#155C3A}
@media (max-width:820px){#landing .price{grid-template-columns:1fr}}

/* FAQ */
#landing .faq{display:flex;flex-direction:column;border-top:1px solid var(--line)}
#landing .faq details{border-bottom:1px solid var(--line)}
#landing .faq summary{list-style:none;cursor:pointer;padding:20px 40px 20px 0;position:relative;font-family:var(--f-title);font-weight:600;font-size:1.2rem}
#landing .faq summary::-webkit-details-marker{display:none}
#landing .faq summary::after{content:"+";position:absolute;right:6px;top:16px;font-size:1.6rem;color:var(--gold)}
#landing .faq details[open] summary::after{content:"–"}
#landing .faq details p{padding:0 0 22px;color:var(--cream-soft);max-width:62ch}

#landing .final{text-align:center;display:flex;flex-direction:column;align-items:center;gap:18px;padding-block:90px}
#landing .final h2{font-size:clamp(2rem,5vw,3.2rem)}
#landing .moonbig{width:120px;height:120px;border-radius:50%;background:radial-gradient(circle at 34% 32%,#FFFBEA 0%,#F6E7B5 55%,#E2C67C 100%);box-shadow:0 0 80px 26px rgba(255,232,160,.25)}
#landing .foot{border-top:1px solid var(--line);font-family:var(--f-ui);font-weight:700;font-size:.88rem;color:var(--cream-soft)}
#landing .foot .wrap{display:flex;flex-wrap:wrap;gap:10px 22px;padding-block:26px}
#landing .foot a{text-decoration:none}
#landing .foot a:hover{color:var(--cream)}

/* poznámka k návrhu (pre Táňu, nie súčasť stránky) */
#landing .note{margin:0 auto;max-width:1120px;padding-block:28px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
#landing .note__in{border:1.5px dashed rgba(232,176,75,.55);border-radius:18px;padding:22px 22px;font-family:var(--f-ui);font-weight:700;font-size:.95rem;line-height:1.55;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;background:rgba(232,176,75,.05)}
#landing .note__in h4{margin:0 0 6px;font-weight:900;color:var(--gold);font-size:.8rem;letter-spacing:.12em;text-transform:uppercase}
#landing .note__in ul{margin:0;padding-left:18px;color:var(--cream-soft)}
#landing .note__in .lead{grid-column:1/-1;color:var(--cream);font-size:1.02rem}
@media (max-width:820px){#landing .note__in{grid-template-columns:1fr}}

/* ═════════ A · Rozprávka o rodičovi ═════════ */
#landing .a-hero{position:relative;z-index:1;padding-block:40px 30px;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
#landing .a-hero h1{font-size:clamp(2.3rem,5.6vw,4rem)}
#landing .a-hero__txt{display:flex;flex-direction:column;gap:20px;min-width:0}
#landing .a-hero__lead{font-size:1.15rem;color:var(--cream-soft);max-width:34ch}
#landing .a-book{position:relative;aspect-ratio:3/4;max-width:420px;width:100%;justify-self:center;perspective:2400px}
#landing .a-book__cover{position:absolute;inset:0;border-radius:6px 18px 18px 6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:30px;
  background:radial-gradient(circle at 50% 38%,#24306A 0%,#141B45 55%,#0A0E26 100%);
  box-shadow:inset 0 0 0 10px #0E1433,inset 0 0 0 13px #C9963A,inset 0 0 0 19px #0E1433,inset 0 0 0 20px rgba(201,150,58,.6),inset 22px 0 34px rgba(0,0,0,.5),0 30px 80px rgba(0,0,0,.6);
  transform-origin:0 50%;backface-visibility:hidden;transition:transform 1.1s cubic-bezier(.6,.05,.25,1)}
#landing .a-book__cover img{width:46%;border-radius:50%;box-shadow:0 0 0 5px rgba(201,150,58,.7),0 0 60px rgba(255,220,140,.3)}
#landing .a-book__cover b{font-family:var(--f-title);font-style:italic;font-size:clamp(2rem,4vw,2.6rem);color:var(--gold-hi);line-height:1}
#landing .a-book__cover small{font-family:var(--f-book);font-weight:600;color:#E9D7A8;letter-spacing:.04em}
#landing .a-book__page{position:absolute;inset:0;border-radius:6px 18px 18px 6px;overflow:hidden}
#landing .a-book__page img{width:100%;height:100%;object-fit:cover}
#landing .a-book__page p{position:absolute;inset:0 0 auto;padding:26px 24px 70px;background:linear-gradient(180deg,rgba(6,8,14,.88),rgba(6,8,14,.5) 65%,transparent);font-weight:600;font-size:1.15rem;line-height:1.35;text-align:center;color:var(--cream)}
#landing .a-book__page p em{font-family:var(--f-title);color:var(--gold-hi)}
#landing .a-book.is-open .a-book__cover{transform:rotateY(-105deg)}
#landing .a-book__btn{position:absolute;left:50%;bottom:-22px;translate:-50% 0;z-index:3;font-family:var(--f-ui);font-weight:900;font-size:.9rem;padding:10px 18px;border-radius:999px;border:0;background:var(--paper);color:var(--ink);cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.4);white-space:nowrap}
@media (max-width:860px){#landing .a-hero{grid-template-columns:1fr}#landing .a-book{max-width:340px}}

#landing .a-tale{position:relative;padding-block:120px 30px}
#landing .a-tale__rail{position:sticky;top:calc(env(safe-area-inset-top,0px) + 70px);z-index:2;display:flex;justify-content:center;pointer-events:none;height:0}
#landing .a-moon{width:64px;height:64px;border-radius:50%;position:relative;overflow:hidden;translate:0 -96px;background:radial-gradient(circle at 34% 32%,#FFFBEA 0%,#F6E7B5 55%,#E2C67C 100%);box-shadow:0 0 0 1.5px rgba(232,176,75,.6),0 0 40px 10px rgba(255,232,160,.25)}
#landing .a-moon i{position:absolute;top:-2%;width:104%;height:104%;border-radius:50%;background:#10173C;opacity:.94;left:calc(14% + var(--p,0) * 92%);transition:left .3s}
#landing .a-pages{display:flex;flex-direction:column;gap:48px;max-width:860px;margin:0 auto}
#landing .a-page{display:grid;grid-template-columns:1fr 1fr;min-height:340px}
#landing .a-page>div{padding:34px 32px;display:flex;flex-direction:column;justify-content:center;gap:14px;min-width:0}
#landing .a-page h2{font-size:clamp(1.6rem,3.4vw,2.2rem)}
#landing .a-page p{font-size:1.08rem}
#landing .a-page figure{margin:0;position:relative;overflow:hidden;border-radius:0 16px 16px 0;min-height:280px}
#landing .a-page figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#landing .a-page--flip figure{order:-1;border-radius:6px 0 0 6px}
#landing .a-page__folio{font-family:var(--f-book);font-size:.85rem;color:var(--ink-soft)}
#landing .tally{font-family:var(--f-hand);font-size:4rem;text-align:center;line-height:1;color:var(--red);letter-spacing:.06em}
#landing .a-pair{display:grid;grid-template-columns:1fr 1fr;gap:2px;position:absolute;inset:0}
#landing .a-pair div{position:relative}
#landing .a-pair img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#landing .a-pair span{position:absolute;left:10px;bottom:10px;font-family:var(--f-ui);font-weight:900;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;background:rgba(6,8,14,.75);color:var(--cream);padding:5px 9px;border-radius:999px}
@media (max-width:720px){#landing .a-page{grid-template-columns:1fr}#landing .a-page figure,#landing .a-page--flip figure{order:-1;border-radius:6px 16px 0 0;min-height:0;aspect-ratio:4/3}#landing .a-page>div{padding:26px 22px}}
#landing .a-end{text-align:center;padding-block:40px 10px;display:flex;flex-direction:column;align-items:center;gap:16px}
#landing .a-end p{font-family:var(--f-title);font-style:italic;font-size:clamp(1.6rem,4vw,2.4rem);color:var(--gold-hi)}

/* ═════════ B · Kúzlo pred a po ═════════ */
#landing .b-hero{position:relative;z-index:1;padding-block:36px 40px;display:grid;grid-template-columns:1fr minmax(0,440px);gap:48px;align-items:center}
#landing .b-hero h1{font-size:clamp(2.2rem,5.2vw,3.8rem)}
#landing .b-hero__txt{display:flex;flex-direction:column;gap:20px;min-width:0}
#landing .b-hero__lead{font-size:1.12rem;color:var(--cream-soft);max-width:38ch}
#landing .b-demo{border-radius:22px;overflow:hidden;background:#0B1030;box-shadow:0 0 0 1px var(--line),0 30px 80px rgba(0,0,0,.55);display:flex;flex-direction:column}
#landing .b-demo__art{position:relative;aspect-ratio:4/5}
#landing .b-demo__art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity 1.1s ease}
#landing .b-demo__art .after{opacity:0}
#landing .b-demo.is-done .after{opacity:1}
#landing .b-demo__cap{position:absolute;inset:0 0 auto;padding:20px 20px 60px;background:linear-gradient(180deg,rgba(6,8,14,.9),rgba(6,8,14,.45) 70%,transparent);text-align:center}
#landing .b-demo__cap small{font-family:var(--f-ui);font-weight:900;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
#landing .b-demo__cap p{font-weight:600;font-size:1.08rem;line-height:1.35;margin-top:4px}
#landing .b-demo__cap .reveal{display:none}
#landing .b-demo.is-done .b-demo__cap .tease{display:none}
#landing .b-demo.is-done .b-demo__cap .reveal{display:block}
#landing .b-demo__moon{position:absolute;right:16px;bottom:16px;width:58px;height:58px;border-radius:50%;overflow:hidden;background:radial-gradient(circle at 34% 32%,#FFFBEA 0%,#F6E7B5 55%,#E2C67C 100%);box-shadow:0 0 30px 8px rgba(255,232,160,.3)}
#landing .b-demo__moon i{position:absolute;top:-2%;width:104%;height:104%;border-radius:50%;background:#10173C;opacity:.94;left:calc(14% + var(--p,0) * 92%);transition:left .6s cubic-bezier(.3,1.3,.5,1)}
#landing .b-demo__habits{display:flex;flex-direction:column;gap:8px;padding:16px}
#landing .b-demo__habits p{font-family:var(--f-ui);font-weight:800;font-size:.85rem;color:var(--cream-soft);text-align:center}
#landing .habit{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:8px 14px;border-radius:14px;border:1.5px solid var(--line);background:rgba(243,231,201,.04);color:var(--cream);font-family:var(--f-ui);font-weight:800;font-size:1rem;text-align:left;cursor:pointer;transition:background .2s,border-color .2s}
#landing .habit:hover{border-color:rgba(243,231,201,.35)}
#landing .habit__box{flex:none;width:28px;height:28px;border-radius:9px;border:2px solid rgba(243,231,201,.5);display:grid;place-items:center}
#landing .habit__box svg{width:16px;height:16px;stroke:var(--gold-ink);stroke-width:3.2;fill:none;opacity:0}
#landing .habit[aria-pressed="true"]{background:rgba(232,176,75,.14);border-color:var(--gold)}
#landing .habit[aria-pressed="true"] .habit__box{background:var(--gold);border-color:var(--gold)}
#landing .habit[aria-pressed="true"] .habit__box svg{opacity:1}
#landing .habit small{margin-left:auto;color:var(--gold);font-weight:900}
@media (max-width:900px){#landing .b-hero{grid-template-columns:1fr}#landing .b-demo{max-width:440px;width:100%;justify-self:center}}

#landing .b-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px}
#landing .b-day{display:flex;flex-direction:column;gap:8px;min-width:0}
#landing .b-day figure{margin:0;aspect-ratio:2/3;border-radius:10px;overflow:hidden;box-shadow:0 0 0 1px var(--line)}
#landing .b-day img{width:100%;height:100%;object-fit:cover}
#landing .b-day b{font-family:var(--f-ui);font-weight:900;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
#landing .b-day span{font-family:var(--f-title);font-weight:600;font-size:.98rem;line-height:1.2}
@media (max-width:900px){#landing .b-week{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:150px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x mandatory}#landing .b-day{scroll-snap-align:start}}

/* ═════════ C · Večer pri posteli ═════════ */
#landing .c-hero{position:relative;min-height:min(760px,92vh);display:flex;align-items:flex-end;overflow:hidden}
#landing .c-hero__img{position:absolute;inset:0}
#landing .c-hero__img img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
#landing .c-hero__img::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,11,30,.92) 0%,rgba(7,11,30,.65) 45%,rgba(7,11,30,.1) 75%),linear-gradient(0deg,var(--night) 0%,transparent 35%)}
#landing .c-hero .hdr{position:absolute;inset:0 0 auto}
#landing .c-hero__txt{position:relative;z-index:1;display:flex;flex-direction:column;gap:20px;padding-block:140px 70px;max-width:620px}
#landing .c-hero h1{font-size:clamp(2.6rem,7vw,5rem)}
#landing .c-hero__lead{font-size:1.15rem;color:var(--cream);max-width:36ch;opacity:.9}
@media (max-width:720px){#landing .c-hero__img::after{background:linear-gradient(0deg,var(--night) 8%,rgba(7,11,30,.82) 55%,rgba(7,11,30,.35) 100%)}}

#landing .c-nag{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}
#landing .c-nag__q{padding:34px 30px;display:flex;flex-direction:column;gap:16px;transform:rotate(-1.2deg)}
#landing .c-nag__q h2{font-size:clamp(1.6rem,3.6vw,2.3rem)}
#landing .c-count{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
#landing .c-count button{width:52px;height:52px;border-radius:50%;border:2px solid var(--ink);background:transparent;color:var(--ink);font-family:var(--f-title);font-size:1.6rem;cursor:pointer;line-height:1}
#landing .c-count output{font-family:var(--f-hand);font-size:3.4rem;line-height:1;color:var(--red);min-width:2ch;font-variant-numeric:tabular-nums}
#landing .c-count__msg{font-family:var(--f-hand);font-size:1.5rem;color:#1F3C88;line-height:1.15;flex-basis:100%}
#landing .c-nag__a{display:flex;flex-direction:column;gap:16px;min-width:0}
#landing .c-nag__a p{font-size:1.1rem;color:var(--cream-soft)}
@media (max-width:820px){#landing .c-nag{grid-template-columns:1fr}#landing .c-nag__q{transform:none}}

#landing .c-time{position:relative;display:flex;flex-direction:column;gap:0;max-width:820px}
#landing .c-time::before{content:"";position:absolute;left:92px;top:10px;bottom:10px;width:2px;background:linear-gradient(180deg,var(--gold),rgba(232,176,75,.15))}
#landing .c-t{display:grid;grid-template-columns:80px 24px 1fr;gap:0 14px;align-items:start;padding-block:16px}
#landing .c-t time{font-family:var(--f-title);font-weight:700;font-size:1.3rem;color:var(--gold-hi);text-align:right;font-variant-numeric:tabular-nums;padding-top:2px}
#landing .c-t__dot{width:16px;height:16px;border-radius:50%;margin:8px 0 0 5px;background:var(--night);box-shadow:0 0 0 3px var(--gold)}
#landing .c-t--full .c-t__dot{background:radial-gradient(circle at 34% 32%,#FFFBEA,#E2C67C);box-shadow:0 0 0 3px var(--gold),0 0 22px 6px rgba(255,232,160,.4)}
#landing .c-t div{display:flex;flex-direction:column;gap:6px;min-width:0}
#landing .c-t h3{font-size:1.3rem}
#landing .c-t p{color:var(--cream-soft)}
#landing .c-t img{border-radius:12px;margin-top:8px;max-width:360px;width:100%;aspect-ratio:16/10;object-fit:cover;box-shadow:0 0 0 1px var(--line)}
@media (max-width:520px){#landing .c-time::before{left:68px}#landing .c-t{grid-template-columns:56px 24px 1fr;gap:0 10px}#landing .c-t time{font-size:1.05rem}}

/* ═════════ dym a pohyb pri skrolovaní ═════════ */
/* plátno v nižšom rozlíšení roztiahnuté na obrazovku (dym je mäkký); bez mix-blend-mode – ten nútil prehliadač miešať celú stránku pri každej snímke */
#landing .smoke{position:fixed;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:4;contain:strict}
#landing .band{min-height:min(64vh,560px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;padding-block:30px}
#landing .band__slot{width:min(300px,72vw);aspect-ratio:1}
#landing .band__slot--sm{width:100%;height:100%}
#landing .band__txt{font-size:clamp(1.6rem,4vw,2.1rem);max-width:22ch}
#landing .moonbig{width:240px;height:240px;background:none;box-shadow:none}
/* mesiac sa plní posunom (transform), nie zmenou left → bez prepočtu rozloženia */
#landing .a-moon i{left:14%;transition:transform .3s;transform:translate3d(calc(var(--p,0)*88.5%),0,0)}
#landing .c-hero__img{inset:-30% 0 0 0}
@media (min-width:701px){#landing .c-hero__img{will-change:transform}}
#landing h1 .w{display:inline-block}
@media (prefers-reduced-motion:no-preference){
  #landing h1 .w{animation:lp-smoke-in 1.2s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i)*85ms + 120ms)}
  @keyframes lp-smoke-in{from{opacity:0;filter:blur(16px);transform:translate3d(0,.35em,0)}}
}
@media (max-width:700px) and (prefers-reduced-motion:no-preference){
  /* telefón: slová bez rozmazania (filter je na slabšom GPU drahý), len vystúpia z hmly */
  @keyframes lp-smoke-in{from{opacity:0;transform:translate3d(0,.35em,0)}}
}

/* ═════════ telefón najprv ═════════ */
#landing .c-hero{min-height:min(760px,92vh);min-height:min(760px,92svh)}
#landing .a-tale__rail{top:calc(env(safe-area-inset-top,0px) + 14px)}
@media (min-width:701px){
  #landing .c-hero__img{left:36%}
  #landing .c-hero__img img{object-position:50% 82%}
  #landing .c-hero__img::after{background:linear-gradient(90deg,var(--night) 0%,rgba(7,11,30,.55) 22%,rgba(7,11,30,0) 55%),linear-gradient(0deg,var(--night) 0%,rgba(7,11,30,0) 30%),linear-gradient(180deg,rgba(7,11,30,.6) 0%,rgba(7,11,30,0) 20%)}
}
@media (max-width:700px){
  #landing .c-hero{min-height:0;display:block}
  #landing .c-hero__img{position:relative;inset:auto;height:50vh;height:50svh;min-height:300px}
  #landing .c-hero__img img{object-position:50% 92%}
  #landing .c-hero__img::after{background:linear-gradient(0deg,var(--night) 0%,rgba(7,11,30,0) 45%),linear-gradient(180deg,rgba(7,11,30,.75) 0%,rgba(7,11,30,0) 28%)}
  #landing .c-hero__txt{padding-block:0 40px;margin-top:-80px;gap:14px}
  #landing .c-hero__lead{font-size:1.05rem}
  #landing .a-tale{padding-block:90px 20px}
  #landing .a-tale__rail{justify-content:flex-end;padding-right:max(14px,env(safe-area-inset-right,0px))}
  #landing .a-moon{width:42px;height:42px;translate:0 -70px}
  #landing .a-pages{gap:28px}
  #landing .band{min-height:min(52vh,420px);min-height:min(52svh,420px);padding-block:10px}
  #landing .band__slot{width:min(240px,64vw)}
  #landing .sec{padding-block:52px}
  #landing .sec__head{margin-bottom:24px}
  #landing .final{padding-block:60px}
  #landing .moonbig{width:190px;height:190px}
  #landing .faq summary{font-size:1.08rem}
  #landing .price__card{padding:24px 20px}
}
@media (max-width:480px){
  #landing .ctas{flex-direction:column;align-items:stretch}
  #landing .ctas .btn{width:100%}
  #landing .hdr .wrap{padding-block:10px}
  #landing .brand span{font-size:1.2rem}
}

#landing #landing .band__txt em{font-family:var(--f-title);font-style:italic;font-weight:700;color:var(--gold-hi)}
