/* Jasny wygląd: kremowy papier z Laponii, nocne niebo tylko jako scena (hero, kreator, zapis, stopka).
   Strona z listem dla dziecka (html.noc) zostaje w pełni nocna. Kolory tekstu biorą się z tokenów,
   więc ciemne „sceny” przywracają nocne tokeny u siebie. */
.jasny{
  --snow:#1d1a44; --mist:#5f5a86; --bg:#fbf6ec; --line:#eadcbc; --card:#fffdf8; --accent:#b01f2c;
  color-scheme:light;
}
.jasny,.jasny body{background:var(--bg);color:var(--snow)}
.jasny body{background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cg fill='none' stroke='%23c99a3a' stroke-opacity='.13' stroke-width='1.4' stroke-linecap='round'%3E%3Cpath d='M40 30v20M30 40h20M33 33l14 14M47 33L33 47'/%3E%3Cpath d='M130 110v14M123 117h14M125 112l10 10M135 112l-10 10'/%3E%3C/g%3E%3Ccircle cx='100' cy='40' r='1.6' fill='%23c99a3a' fill-opacity='.18'/%3E%3Ccircle cx='30' cy='140' r='1.3' fill='%23c99a3a' fill-opacity='.16'/%3E%3C/svg%3E"),
  radial-gradient(900px 500px at 85% 900px,#f6e7c8 0,transparent 70%),var(--bg)}
.jasny #scene,.jasny #sky,.jasny .veil{display:none}
.jasny body::before{background:#070b24}

/* Ciemne sceny: nocne tokeny wracają */
.jasny .hero,.jasny .creator,.jasny .zp,.jasny .sitefoot,.jasny .demo,.jasny .cta-box,.jasny header.top{--snow:#f3f5ff;--mist:#aab3e0;color:var(--snow)}

/* Nagłówek: granat jak niebo nad Laponią */
.jasny header.top{background:linear-gradient(180deg,#070b24,#0b1236);box-shadow:0 8px 30px -12px #070b2499}

/* Hero: pełnej szerokości nocne niebo z zorzą i śnieżnym brzegiem */
.jasny .hero{position:relative;isolation:isolate;padding-bottom:84px}
.jasny .hero::before{content:"";position:absolute;z-index:-1;top:-2px;bottom:0;left:calc(50% - 50vw);right:calc(50% - 50vw);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cg fill='%23fff'%3E%3Ccircle cx='20' cy='30' r='1.1' opacity='.8'/%3E%3Ccircle cx='90' cy='12' r='.8' opacity='.6'/%3E%3Ccircle cx='160' cy='60' r='1.3' opacity='.9'/%3E%3Ccircle cx='210' cy='20' r='.7' opacity='.5'/%3E%3Ccircle cx='60' cy='110' r='.9' opacity='.6'/%3E%3Ccircle cx='130' cy='150' r='.7' opacity='.5'/%3E%3Ccircle cx='200' cy='130' r='1' opacity='.7'/%3E%3Ccircle cx='30' cy='200' r='.8' opacity='.5'/%3E%3Ccircle cx='110' cy='220' r='1.2' opacity='.8'/%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(60% 55% at 78% 30%,#7cf0cf2e,transparent 70%),
    radial-gradient(50% 45% at 18% 20%,#9f7cff30,transparent 70%),
    radial-gradient(40% 40% at 50% 100%,#f1c96b1f,transparent 70%),
    linear-gradient(180deg,#0b1236 0,#121a4a 50%,#2a2f78 100%)}
.jasny .hero::after{content:"";position:absolute;z-index:-1;bottom:-1px;height:70px;left:calc(50% - 50vw);right:calc(50% - 50vw);
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 70' preserveAspectRatio='none'%3E%3Cpath d='M0 40C160 10 300 8 470 30S780 64 980 38 1300 6 1440 30V70H0Z' fill='%23fbf6ec'/%3E%3C/svg%3E") center bottom/100% 100% no-repeat}
.jasny .hero-media{box-shadow:0 40px 80px -30px #000c,0 0 0 1px #f1c96b66,0 0 0 8px #f1c96b14}
@media (max-width:860px){
  .jasny .hero-media::after{background:linear-gradient(180deg,#0b123666 0,transparent 18%,transparent 55%,#121a4a 100%)}
}

/* Nagłówki sekcji */
.jasny .eyebrow{color:var(--accent)}
.jasny .hero .eyebrow,.jasny .zp .eyebrow,.jasny .creator .eyebrow{color:var(--gold)}
.jasny .sec-h h2{color:#1d1a44}
.jasny .sec-h h2::after{content:"";display:block;width:64px;height:3px;margin-top:12px;border-radius:3px;background:linear-gradient(90deg,var(--accent),var(--gold))}
.jasny .sec-h.c h2::after{margin-inline:auto}
@media (max-width:860px){.jasny .sec-h h2::after{margin-inline:auto}}
.jasny .sec{padding-block:64px 8px}
.jasny a:not(.btn){color:var(--accent)}
.jasny .hero a:not(.btn),.jasny .sitefoot a{color:var(--mist)}

/* Karty na papierze */
.jasny .stepc,.jasny .whyc,.jasny .qa,.jasny .plan,.jasny .extra,.jasny .vs-c{background:var(--card);border:1px solid var(--line);box-shadow:0 1px 0 #fff inset,0 24px 50px -30px #7a5a1f55}
.jasny .stepc .art{background:#f3ead7}
.jasny .stepc h3,.jasny .whyc b,.jasny .plan h2,.jasny .extra h2,.jasny .vs-c h3,.jasny .qa summary{color:#1d1a44}
.jasny .medal{box-shadow:0 6px 14px #7a5a1f55}
.jasny .stepc .art.bg4{background:radial-gradient(circle at 50% 30%,#2a3a8a,#0a1030 70%)}
.jasny .qa p{color:#47426e}
.jasny .qa summary::after{color:var(--accent)}

/* Szablony filmów: zdjęcia zostają ciemne, napisy jasne */
.jasny .tpl{border:0;box-shadow:0 24px 44px -24px #3b2a0a99}
.jasny .tpl .meta,.jasny .dur,.jasny .tag:not(.hot){color:#fff}

/* Kreator jako nocne studio */
.jasny .creator{background:radial-gradient(120% 80% at 80% 0,#2a2f78,#0d1440 60%);border:0;box-shadow:0 50px 90px -40px #0b1236cc}

/* Certyfikat i formularze na papierze */
.jasny .cert-ctl input.big,.jasny .bk-copy input.big{background:#fff;border:1.5px solid var(--line);color:var(--accent)}
.jasny .cert-ctl input.big:focus,.jasny .bk-copy input.big:focus{border-color:var(--gold-2);outline:0;box-shadow:0 0 0 4px #f1c96b44}
.jasny .cert-frame{box-shadow:0 40px 70px -30px #5a3f0f88,0 0 0 1px #e3cf9f}
.jasny .upsell{color:var(--accent);background:#b01f2c0d;border-color:#b01f2c40}

/* Zapis: granatowa pocztówka */
.jasny .zp{background:radial-gradient(120% 90% at 50% 0,#2a2f78,#0d1440 70%);border:0;box-shadow:0 40px 80px -40px #0b1236cc}

/* Ceny */
.jasny .ceny-h h1,.jasny .hero-copy h1{text-shadow:none}
.jasny .ceny-h h1{color:#1d1a44}
.jasny .ceny-h h1 .script,.jasny .foot .script,.jasny .vs-c h3 .script,.jasny .vs-mid span,.jasny .bk-copy h1 .script{color:var(--accent);text-shadow:none}
.jasny .ceny-h .lead,.jasny .doc .lead{color:#47426e}
.jasny .plan-art::after,.jasny .vs-art::after{background:linear-gradient(180deg,transparent 55%,var(--card))}
.jasny .plan-p b,.jasny .extra>b{color:var(--accent)}
.jasny .ticks li{color:#3a365f}
.jasny .ticks svg{color:#1f9d7a}
.jasny .ticks.no li{color:#7a7596}
.jasny .vs-art.same{background:#f3ead7}
.jasny .vs-c.plain h3{color:#7a7596}
.jasny .plan.hot,.jasny .vs-c.ours{border-color:var(--gold-2);box-shadow:0 0 0 1px var(--gold-2),0 30px 70px -30px #c99a3a88}
.jasny .ribbon{box-shadow:0 6px 16px #7a5a1f55}

/* Stopka strony startowej */
.jasny .foot .logo{filter:drop-shadow(0 2px 0 #0b1236) drop-shadow(0 8px 18px #0b123655)}
.jasny .legal{color:#7a7596}

/* Poradnik i podstrony */
.jasny .crumbs{padding-top:16px}
.jasny .crumbs [aria-current]{color:#1d1a44}
.jasny .doc{background:var(--card);border:1px solid var(--line);box-shadow:0 30px 60px -36px #7a5a1f66}

/* ---------- Bajka z imieniem ---------- */
#v-bajka{padding-top:8px}
.bk-hero{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:center;padding-block:28px 10px}
.bk-book{position:relative;width:min(400px,78vw);justify-self:center;perspective:1400px}
.bk-cover{position:relative;border-radius:4px 14px 14px 4px;overflow:hidden;transform:rotateY(-14deg) rotateZ(-1deg);transform-origin:left center;
  box-shadow:inset 6px 0 10px -4px #0006,0 40px 60px -24px #3b2a0acc,22px 30px 50px -30px #3b2a0a88}
.bk-cover img{width:100%;height:auto}
.bk-cover::before{content:"";position:absolute;inset:0 auto 0 0;width:16px;z-index:2;background:linear-gradient(90deg,#0005,#fff3,#0002 70%,transparent)}
.bk-pages{position:absolute;z-index:-1;inset:6px -10px 6px 10px;border-radius:4px 12px 12px 4px;background:repeating-linear-gradient(90deg,#fffdf6 0 2px,#eadcbc 2px 3px);transform:rotateY(-14deg) rotateZ(-1deg);transform-origin:left center;box-shadow:0 30px 50px -24px #3b2a0a88}
.bk-title{position:absolute;left:8%;right:8%;bottom:6%;z-index:3;text-align:center;padding:12px 10px 14px;border-radius:12px;background:#fffdf6e8;box-shadow:0 10px 24px -10px #0008;display:grid;gap:0}
.bk-title .script{font-size:clamp(38px,9vw,54px);line-height:1;color:var(--wax)}
.bk-title b{font-family:var(--f-display);font-weight:400;font-size:clamp(15px,3.4vw,20px);color:#1d1a44;line-height:1.15}
.bk-copy{display:grid;gap:14px;justify-items:start}
.bk-copy h1{font-size:clamp(32px,5vw,54px);line-height:1.04;color:#1d1a44}
.bk-copy h1 .script{display:block;font-size:1.25em;line-height:1;margin-top:.05em}
.bk-copy .lead{font-size:17.5px;color:#47426e;max-width:48ch}
.bk-copy input.big{max-width:360px}
.bk-buy{display:flex;flex-wrap:wrap;gap:10px}
.bk-price{display:grid;gap:2px;padding:10px 16px;border-radius:16px;background:var(--card,#fffdf8);border:1px solid var(--line,#eadcbc)}
.bk-price b{font-family:var(--f-display);font-weight:400;font-size:30px;line-height:1;color:var(--wax)}
.bk-price small{font-size:12.5px;color:var(--mist);line-height:1.3}
.bk-price.best{border-color:var(--gold-2);box-shadow:0 0 0 1px var(--gold-2)}
.bk-copy .btn-ghost{background:#fff;border:1.5px solid var(--line,#eadcbc);color:#1d1a44}
.bk-copy .trust{color:var(--mist)}
.jasny .trust i{background:#1f9d7a;box-shadow:none}
.jasny .hero .trust i{background:var(--aurora);box-shadow:0 0 8px var(--aurora)}
.spreads{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.spread{margin:0;display:grid;gap:12px;align-content:start;background:var(--card,#fffdf8);border:1px solid var(--line,#eadcbc);border-radius:20px;padding:12px 12px 18px;box-shadow:0 24px 50px -30px #7a5a1f55}
.spread img{width:100%;height:auto;border-radius:12px}
.spread figcaption{font-family:var(--f-hand);font-size:21px;line-height:1.3;color:#2a2655;padding-inline:6px}
.spread figcaption b{color:var(--wax);font-weight:700}
.bk-tagimg{position:relative}
.bk-tag{position:absolute;left:50.5%;top:61%;transform:translate(-50%,-50%) rotate(-2deg);width:24%;text-align:center;font-family:var(--f-hand);font-weight:700;font-size:clamp(16px,2.6vw,30px);line-height:1;color:#7a1620;overflow:hidden;white-space:nowrap;text-overflow:clip}
@media (max-width:900px){
  .bk-hero{grid-template-columns:1fr;gap:30px;padding-top:18px}
  .bk-copy{justify-items:center;text-align:center}
  .bk-buy,.bk-copy .ctas,.bk-copy .trust{justify-content:center}
  .spreads{grid-template-columns:1fr;max-width:520px;margin-inline:auto}
  .bk-tag{font-size:clamp(18px,6vw,30px)}
}
.jasny .sitefoot{background:#0b1236;border-top:0}
@media (max-width:900px){.bk-buy{display:grid;grid-template-columns:1fr 1fr;width:min(100%,420px)}.bk-price{text-align:center}}
.jasny header.top nav a:not([aria-current]),.jasny .crumbs a{color:var(--mist)}
.jasny .hero .btn-ghost{color:#f3f5ff}