/* Rolki i social media — style tylko dla tej podstrony. Wszystkie klasy z przedrostkiem rk-, żeby nie kolidować z site.css (08.09: kolizja .reel). */

/* hero: tekst | trzy rolki */
.rk-hero-reels{display:grid;gap:clamp(2rem,4vw,4rem);align-items:center;grid-template-columns:1fr}
@media (min-width:900px){.rk-hero-reels{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}}
.rk-hero-reels .hero-h1{max-width:14ch}

/* rolka = kadr 9:16 z plakatem, play i podpisem */
.rk-reels{display:grid;gap:clamp(.75rem,1.5vw,1.25rem);grid-template-columns:repeat(3,1fr);align-items:start}
.rk-reels--wall{margin-top:clamp(3rem,5vw,4.5rem);grid-template-columns:repeat(2,1fr);gap:clamp(.6rem,1.5vw,1.25rem)}
@media (min-width:700px){.rk-reels--wall{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1200px){.rk-reels--wall{grid-template-columns:repeat(4,1fr)}}
.rk-reels--hero .rk-reel:nth-child(2){margin-top:2rem}
@media (max-width:899px){
  .rk-reels--hero{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:.75rem;margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);padding-bottom:.25rem;scrollbar-width:none}
  .rk-reels--hero::-webkit-scrollbar{display:none}
  .rk-reels--hero .rk-reel{flex:0 0 62%;scroll-snap-align:start;margin-top:0}
  .rk-reels--hero .rk-reel:nth-child(2){margin-top:0}
}
@media (min-width:560px) and (max-width:899px){.rk-reels--hero .rk-reel{flex-basis:44%}}
.rk-reel{margin:0;min-width:0}
.rk-reel__frame{position:relative;aspect-ratio:9/16;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--hairline);background:#0E0F12;box-shadow:inset 0 1px 0 rgb(255 255 255 / .06)}
.rk-reel__frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#0E0F12;opacity:1}
.rk-reel__play{position:absolute;left:50%;top:50%;translate:-50% -50%;width:52px;height:52px;border-radius:50%;border:0;background:var(--accent);color:#fff;display:grid;place-items:center;cursor:pointer;padding:0;box-shadow:0 8px 24px rgb(0 0 0 / .35);transition:transform var(--d-hover) var(--ease-soft),opacity var(--d-hover) var(--ease-soft),background var(--d-hover) var(--ease-soft)}
.rk-reel__play:hover{transform:scale(1.06);background:color-mix(in oklab,var(--accent) 88%,white)}
.rk-reel__play svg{display:block;margin-left:3px}
.rk-reel.rk-is-playing .rk-reel__play{opacity:0;pointer-events:none}
.rk-reel__frame::after{content:'';position:absolute;inset:auto 0 0 0;height:34%;background:linear-gradient(to top,rgb(8 9 10 / .55),transparent);pointer-events:none;transition:opacity var(--d-hover) var(--ease-soft)}
.rk-reel.rk-is-playing .rk-reel__frame::after{opacity:0}
.rk-reel__stop{position:absolute;right:10px;top:10px;width:36px;height:36px;border-radius:50%;border:1px solid rgb(255 255 255 / .2);background:rgb(8 9 10 / .55);color:#fff;display:none;place-items:center;cursor:pointer;padding:0;backdrop-filter:blur(8px)}
.rk-reel.rk-is-playing .rk-reel__stop{display:grid}
.rk-reel__cap{margin-top:.7rem;font-size:.8125rem;line-height:1.4;color:var(--fg-faint)}
.rk-reel__cap b{font-weight:500;color:var(--fg-muted)}
.rk-reel__cap i{display:block;font-style:normal;margin-top:.1rem}
.rk-reels .rk-is-more{display:none}
.rk-reels.rk-is-open .rk-is-more{display:block}
.rk-reels__more{display:flex;justify-content:center;margin-top:2rem}
.rk-reels__more[hidden]{display:none}

/* liczby pod hero: trzy dowody w jednym pasku */
.rk-proof{display:grid;gap:1.25rem 2rem;grid-template-columns:1fr;border-top:1px solid var(--hairline);padding-top:1.5rem;margin-top:clamp(2.5rem,5vw,4rem)}
@media (min-width:640px){.rk-proof{grid-template-columns:repeat(3,1fr)}}
.rk-proof b{display:block;font-weight:500;font-size:clamp(1.5rem,2.4vw,2rem);letter-spacing:-.024em;line-height:1.1;font-variant-numeric:tabular-nums}
.rk-proof span{display:block;margin-top:.35rem;font-size:.875rem;color:var(--fg-faint)}

/* karta scenariusza (w kafelku) */
.rk-script{margin:0;font-family:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.8125rem;line-height:1.6;border:1px solid var(--hairline);border-radius:var(--r-md);background:var(--surface);box-shadow:inset 0 1px 0 rgb(255 255 255 / .06);padding:clamp(1.25rem,2vw,1.75rem);color:var(--fg-muted);max-width:none;width:100%}
.rk-script__t{display:flex;justify-content:space-between;gap:1rem;color:var(--fg-faint);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;margin-bottom:.9rem}
.rk-script__r{display:grid;grid-template-columns:2.8rem 6.2rem minmax(0,1fr);gap:.6rem;padding:.35rem 0;border-top:1px solid rgb(255 255 255 / .06)}
.rk-script__r span:first-child{color:var(--accent);font-variant-numeric:tabular-nums}
.rk-script__r span:nth-child(2){color:var(--fg-faint)}
.rk-script__r span:last-child{color:var(--fg)}
.rk-script__f{margin-top:.9rem;padding-top:.75rem;border-top:1px dashed rgb(255 255 255 / .12);color:var(--fg-faint);font-size:.75rem}
@media (max-width:420px){.rk-script__r{grid-template-columns:2.6rem minmax(0,1fr)}.rk-script__r span:nth-child(2){display:none}}

/* co to daje: tagi, wyniki, przykładowy miesiąc */
.rk-tags{list-style:none;margin:1.5rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.rk-tags li{font-size:.875rem;color:var(--fg-muted);padding:.4rem .8rem;border:1px solid var(--hairline);border-radius:var(--r-pill)}
.rk-gives{display:grid;gap:clamp(2rem,5vw,4rem);grid-template-columns:1fr;align-items:start;margin-top:clamp(3rem,5vw,4.5rem)}
@media (min-width:1000px){.rk-gives{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}}
.rk-outcomes{border-top:1px solid var(--hairline)}
.rk-outcome{padding:1.25rem 0;border-bottom:1px solid var(--hairline)}
.rk-outcome b{display:block;font-weight:500;font-size:1.25rem;letter-spacing:-.02em;line-height:1.25;text-wrap:balance}
.rk-outcome p{margin-top:.5rem;font-size:.9375rem;max-width:none}
.rk-outcomes .note{margin-top:1.25rem}
.rk-month{border:1px solid var(--hairline);border-radius:var(--r-md);background:var(--surface);box-shadow:inset 0 1px 0 rgb(255 255 255 / .06);padding:clamp(.9rem,1.6vw,1.4rem)}
.rk-month__head{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:6px;font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-faint);text-align:center}
.rk-month__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
@media (min-width:600px){.rk-month__head,.rk-month__grid{gap:6px}}
.rk-day{position:relative;aspect-ratio:1/1.2;border-radius:8px;border:1px solid rgb(255 255 255 / .06);background:rgb(255 255 255 / .02);overflow:hidden;display:flex;align-items:flex-end;justify-content:center}
.rk-day__n{position:absolute;left:6px;top:4px;font-size:.6875rem;color:var(--fg-faint);font-variant-numeric:tabular-nums;z-index:2}
.rk-day svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-bottom:auto;margin-top:auto}
.rk-day__l{position:absolute;left:0;right:0;bottom:5px;font-size:.5625rem;letter-spacing:.04em;text-transform:uppercase;text-align:center;color:var(--fg-faint);padding-inline:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rk-day--shoot{border-color:var(--accent);background:color-mix(in oklab,var(--accent) 18%,transparent);color:#fff}
.rk-day--shoot .rk-day__n,.rk-day--shoot .rk-day__l{color:rgb(255 255 255 / .8)}
.rk-day--reel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.rk-day--reel::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgb(8 9 10 / .6),transparent 55%)}
.rk-day--reel .rk-day__n{color:#fff;text-shadow:0 1px 2px rgb(0 0 0 / .6)}
.rk-day--ad{border-color:rgb(255 255 255 / .18);color:var(--fg)}
.rk-day--ad svg{color:var(--accent)}
@media (max-width:599px){.rk-day__l{display:none}.rk-day svg{width:18px;height:18px}}
.rk-month__legend{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;margin-top:.9rem;font-size:.8125rem;color:var(--fg-faint)}
.rk-month__legend span{display:inline-flex;align-items:center;gap:.5rem}
.rk-lg{width:12px;height:12px;border-radius:3px;border:1px solid rgb(255 255 255 / .18);display:inline-block}
.rk-lg--shoot{border-color:var(--accent);background:color-mix(in oklab,var(--accent) 35%,transparent)}
.rk-lg--reel{background:rgb(255 255 255 / .35)}
.rk-lg--ad{border-color:var(--accent)}
/* wejście kalendarza: dni pojawiają się po kolei (30 × 22 ms), tylko gdy działa reveal */
.rk-month .rk-day{opacity:0;translate:0 6px;transition:opacity 480ms var(--ease-out),translate 480ms var(--ease-out)}
.rk-month.is-in .rk-day{opacity:1;translate:0 0}
.rk-month.is-in .rk-day{transition-delay:calc(var(--i,0) * 22ms)}
@media (scripting:none){.rk-month .rk-day{opacity:1;translate:0 0}}

/* czym się różnimy: bento */
.rk-bento{display:grid;gap:clamp(.75rem,1.5vw,1.25rem);margin-top:clamp(3rem,5vw,4.5rem);grid-template-columns:1fr}
@media (min-width:700px){.rk-bento{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.rk-bento{grid-template-columns:repeat(4,1fr)}}
.rk-tile{position:relative;padding:clamp(1.5rem,2.4vw,2rem);border-radius:var(--r-md);border:1px solid var(--hairline);background:var(--surface);min-width:0;display:flex;flex-direction:column;gap:.5rem;transition:border-color var(--d-hover) var(--ease-soft),background var(--d-hover) var(--ease-soft)}
.rk-tile:hover{border-color:rgb(255 255 255 / .18);background:rgb(255 255 255 / .06)}
.rk-tile h3{font-size:1.25rem;font-weight:500;letter-spacing:-.018em;text-wrap:balance}
.rk-tile p{font-size:.9375rem;max-width:none}
.rk-tile__icon{width:40px;height:40px;border-radius:10px;border:1px solid var(--hairline);background:rgb(255 255 255 / .04);display:grid;place-items:center;margin-bottom:.75rem;color:var(--accent)}
.rk-tile__icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.rk-tile--wide,.rk-tile--wide2{grid-column:1 / -1}
.rk-tile--wide{display:grid;grid-template-columns:1fr;gap:1.5rem;align-items:start}
@media (min-width:700px) and (max-width:1099px){.rk-tile--wide{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center}}
@media (min-width:1100px){.rk-tile--wide{grid-column:span 2;grid-row:span 2;align-content:start}}
.rk-tile--wide2{display:grid;grid-template-columns:1fr;gap:1rem 2.5rem}
@media (min-width:700px){.rk-tile--wide2{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}.rk-tile--wide2 .rk-dual{margin-top:0;padding-top:0;border-top:0}}
.rk-tile--wide2 .rk-dual{max-width:24rem}
.rk-tile--poster{display:grid;grid-template-columns:minmax(0,1fr) 76px;gap:1rem;align-items:end}
.rk-tile__poster{aspect-ratio:9/16;border-radius:10px;overflow:hidden;border:1px solid var(--hairline)}
.rk-tile__poster img{width:100%;height:100%;object-fit:cover;display:block}
.rk-dual{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:.75rem;margin-top:1rem;padding-top:1rem;border-top:1px solid rgb(255 255 255 / .06)}
.rk-dual__reel{display:block;width:34px;aspect-ratio:9/16;border-radius:6px;border:1px solid rgb(255 255 255 / .25);background:linear-gradient(180deg,rgb(115 96 223 / .6),rgb(115 96 223 / .15))}
.rk-dual__arm{display:block;height:1px;background:linear-gradient(90deg,rgb(255 255 255 / .35),rgb(255 255 255 / .12));position:relative}
.rk-dual__arm::before,.rk-dual__arm::after{content:'';position:absolute;right:0;width:6px;height:6px;border-top:1px solid rgb(255 255 255 / .5);border-right:1px solid rgb(255 255 255 / .5);transform:rotate(45deg);top:-3px}
.rk-dual__to{display:grid;gap:.35rem}
.rk-dual__to b{font-weight:500;font-size:.8125rem;padding:.3rem .6rem;border:1px solid var(--hairline);border-radius:var(--r-pill);color:var(--fg-muted)}

/* kto trzyma telefon: paski zadań */
.rk-variants{margin-top:clamp(3rem,5vw,4.5rem);border-top:1px solid var(--hairline)}
.rk-legend{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;padding:1rem 0;font-size:.8125rem;color:var(--fg-faint);border-bottom:1px solid var(--hairline)}
.rk-legend span{display:inline-flex;align-items:center;gap:.5rem}
.rk-seg-dot{width:14px;height:10px;border-radius:3px;display:inline-block;border:1px solid rgb(255 255 255 / .3)}
.rk-seg-dot--my{background:var(--accent);border-color:var(--accent)}
.rk-seg-dot--opt{border-style:dashed}
.rk-variant{display:grid;gap:1rem 2.5rem;grid-template-columns:1fr;padding:1.5rem 0;border-bottom:1px solid var(--hairline)}
@media (min-width:900px){.rk-variant{grid-template-columns:minmax(0,4fr) minmax(0,8fr);align-items:center}}
.rk-variant__head h3{font-size:1.375rem;font-weight:500;letter-spacing:-.02em}
.rk-variant__head p{margin-top:.25rem;font-size:.9375rem;max-width:none}
.rk-variant__days{display:block;margin-top:.5rem;font-size:.8125rem;color:var(--fg-faint)}
.rk-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.rk-seg{border-radius:10px;padding:.7rem .6rem .6rem;min-height:64px;display:flex;flex-direction:column;justify-content:space-between;gap:.35rem;border:1px solid rgb(255 255 255 / .28);color:var(--fg)}
.rk-seg b{font-weight:500;font-size:.9375rem}
.rk-seg span{font-size:.75rem;letter-spacing:.04em;text-transform:uppercase;color:var(--fg-faint)}
.rk-seg--my{background:var(--accent);border-color:var(--accent);color:#fff}
.rk-seg--my span{color:rgb(255 255 255 / .75)}
.rk-seg--opt{border-style:dashed;color:var(--fg-muted)}
@media (max-width:480px){.rk-seg{padding:.55rem .5rem .5rem;min-height:58px}.rk-seg b{font-size:.875rem}.rk-seg span{font-size:.625rem}}
.rk-plans-cta{display:flex;justify-content:center;margin-top:2.5rem}

/* na planie: Oliwia i sprzęt */
.rk-setpiece{display:grid;gap:clamp(2rem,5vw,4rem);grid-template-columns:1fr;align-items:center}
@media (min-width:900px){.rk-setpiece{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}}
.rk-setpiece .h2+p{margin-top:1.5rem}
.rk-setpiece p+p{margin-top:1rem}
.rk-who{display:inline-flex;flex-direction:column;gap:.15rem;margin-top:1.75rem;padding:.9rem 1.1rem;border:1px solid var(--hairline);border-radius:var(--r-md);background:var(--surface)}
.rk-who b{font-weight:500;font-size:1.125rem;letter-spacing:-.018em}
.rk-who span{font-size:.8125rem;color:var(--fg-faint)}
.rk-kit{display:grid;gap:1px;background:var(--hairline);border:1px solid var(--hairline);border-radius:var(--r-md);overflow:hidden;grid-template-columns:repeat(2,1fr)}
.rk-kit__item{background:var(--bg);padding:clamp(1.1rem,1.8vw,1.5rem);display:flex;flex-direction:column;gap:.4rem;transition:background var(--d-hover) var(--ease-soft)}
.rk-kit__item:hover{background:var(--surface)}
.rk-kit__item svg{width:28px;height:28px;flex:none;fill:none;stroke:var(--accent);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-bottom:.35rem}
.rk-kit__item b{font-weight:500;font-size:1.0625rem;letter-spacing:-.014em}
.rk-kit__item span{font-size:.8125rem;color:var(--fg-faint);line-height:1.45}
.rk-kit__item:last-child{grid-column:1 / -1;flex-direction:row;align-items:center;gap:1rem}
.rk-kit__item:last-child svg{margin:0}
.rk-kit__item:last-child b{margin-right:.25rem}

@media (prefers-reduced-motion:reduce){
  .rk-month .rk-day{opacity:1;translate:0 0;transition:none}
  .rk-reel__play{transition:none}
}
