/* Warstwa ruchu „Tęczowy Las": spokojna, leśna, bez WebGL. Tylko transform/opacity. Wszystko wyłączane przez prefers-reduced-motion. */
:root{--wow-ease:cubic-bezier(.22,1,.36,1)}
html{scroll-behavior:smooth;scroll-padding-top:72px}

/* nić tęczy: postęp czytania */
.wow-thread{position:fixed;left:0;top:0;right:0;height:3px;z-index:60;pointer-events:none;transform-origin:0 50%;transform:scaleX(var(--p,0));background:linear-gradient(90deg,#C33849,#E8871C,#C9A227,#0F614A,#2E7FB8,#5B4B9A,#8E3F8F)}

/* HERO: oddychające zdjęcie, linie nagłówka wsuwają się spod maski (CSS, bez JS: H1 jest w DOM od pierwszego renderu) */
.tl-hero-img{transform:scale(1.04);animation:wow-breathe 26s ease-in-out infinite alternate;will-change:transform}
@keyframes wow-breathe{to{transform:scale(1.12) translate3d(-1.2%,-1%,0)}}
.tl-hero h1{overflow:hidden;padding-bottom:.08em}
.tl-hero h1 .wow-line{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.tl-hero h1 .wow-line>span{display:block;transform:translate3d(0,105%,0);animation:wow-rise 1.15s var(--wow-ease) forwards;animation-delay:calc(.25s + var(--i)*.14s)}
@keyframes wow-rise{to{transform:none}}
.tl-hero .tl-lead,.tl-hero .tl-actions{animation:wow-fade 1s var(--wow-ease) both}
.tl-hero .tl-lead{animation-delay:.85s}.tl-hero .tl-actions{animation-delay:1.05s}
@keyframes wow-fade{from{opacity:0;transform:translate3d(0,14px,0)}to{opacity:1;transform:none}}
/* tęczowa kreska pod nagłówkiem */
.tl-hero h1::after{content:"";display:block;height:4px;width:min(260px,40vw);margin-top:.35em;border-radius:4px;transform-origin:0 50%;transform:scaleX(0);animation:wow-draw 1.4s var(--wow-ease) 1.1s forwards;background:linear-gradient(90deg,#C33849,#E8871C,#C9A227,#4CA66F,#2E7FB8,#5B4B9A,#8E3F8F)}
@keyframes wow-draw{to{transform:scaleX(1)}}
/* świetliki */
.wow-motes{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.wow-motes i{position:absolute;bottom:-10px;width:var(--s);height:var(--s);border-radius:50%;background:radial-gradient(circle,rgba(255,236,170,.95),rgba(255,236,170,0) 70%);opacity:0;animation:wow-mote var(--d) linear var(--w) infinite}
@keyframes wow-mote{0%{opacity:0;transform:translate3d(0,0,0)}12%{opacity:.85}60%{opacity:.5}100%{opacity:0;transform:translate3d(var(--x),-78vh,0)}}
.wow-motes.is-paused i{animation-play-state:paused}

/* REVEAL: jednorazowy, tylko gdy JS działa (bez JS wszystko widoczne) */
.js .wow-r{opacity:0;transform:translate3d(0,22px,0);transition:opacity 1s var(--wow-ease),transform 1s var(--wow-ease);transition-delay:calc(var(--d,0)*90ms)}
.js .wow-r.is-in{opacity:1;transform:none}
.tl-head .tl-kicker{position:relative}
.js .tl-head .tl-kicker::before{content:"";position:absolute;left:0;bottom:-8px;height:2px;width:0;background:currentColor;opacity:.45;transition:width 1.2s var(--wow-ease) .2s}
.js .tl-head.is-in .tl-kicker::before{width:48px}

/* tęcza: łuki rysują się po kolei */
.js .tl-rainbow .tl-arc{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.8s var(--wow-ease) calc(var(--i)*.16s),opacity .25s,stroke-width .25s}
.js .tl-rainbow.is-in .tl-arc{stroke-dashoffset:0}
.tl-arc-hit{pointer-events:stroke}
.tl-arc{pointer-events:none}

/* hover / focus: dotyk jakości */
.tl-btn{transition:background-color .35s var(--wow-ease),color .35s,border-color .35s,transform .45s var(--wow-ease),box-shadow .45s var(--wow-ease)}
@media (hover:hover) and (pointer:fine){
 .tl-btn-main:hover{transform:translate3d(0,-2px,0);box-shadow:0 14px 28px -14px rgba(11,75,57,.7)}
 .tl-btn-ghost:hover{transform:translate3d(0,-2px,0)}
 .tl-plans article,.tl-guar-list article{transition:transform .6s var(--wow-ease),box-shadow .6s var(--wow-ease)}
 .tl-plans article:hover{transform:translate3d(0,-6px,0);box-shadow:0 30px 50px -34px rgba(15,97,74,.5)}
}
.tl-btn:focus-visible,.tl-plans article:focus-within{outline:3px solid #E8871C;outline-offset:3px}
.tl-header nav a{position:relative}
.tl-header nav a::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;background:currentColor;transform:scaleX(0);transform-origin:0 50%;transition:transform .45s var(--wow-ease)}
.tl-header nav a:hover::after,.tl-header nav a:focus-visible::after{transform:scaleX(1)}
.tl-header{transition:box-shadow .4s}
.tl-header.is-stuck{box-shadow:0 12px 30px -24px rgba(11,75,57,.5)}
.tl-poem{position:relative}
.tl-faq details{transition:background-color .3s}
.tl-faq details>summary{transition:color .3s}

@media (prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .tl-hero-img,.wow-motes i,.tl-hero .tl-lead,.tl-hero .tl-actions{animation:none!important}
 .tl-hero h1 .wow-line>span{animation:none!important;transform:none!important}
 .tl-hero h1::after{animation:none!important;transform:none!important}
 .wow-motes{display:none}
 .js .wow-r,.js .tl-rainbow .tl-arc{opacity:1!important;transform:none!important;stroke-dashoffset:0!important;transition:none!important}
 .wow-thread{display:none}
}
