/* Ekran startowy / lista akcji – motyw niebieski (tokeny z theme-blue.css) + efekty z assets/js/list.js */
.al-page{background:var(--ink);color:var(--cream);min-height:100vh;overflow-x:clip}
.al-page .it{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0;color:var(--gold)}
.al-page :focus-visible{outline:3px solid var(--gold-hi);outline-offset:4px}

/* ================= HERO ================= */
.al-hero{position:relative;isolation:isolate;min-height:min(100svh,940px);display:flex;flex-direction:column;justify-content:center;overflow:hidden;
  background:radial-gradient(120% 90% at 50% 110%,#0B2A55 0%,transparent 60%),var(--ink)}
.al-sky{position:absolute;inset:0;width:100%;height:100%;z-index:-1;display:block}
.al-aurora{position:absolute;inset:-20%;z-index:-3;filter:blur(70px);opacity:.75}
.al-aurora i{position:absolute;border-radius:50%;mix-blend-mode:screen;animation:alDrift 22s ease-in-out infinite alternate}
.al-aurora i:nth-child(1){width:52%;height:52%;left:8%;top:12%;background:radial-gradient(circle,#1F6FE5 0%,transparent 68%)}
.al-aurora i:nth-child(2){width:46%;height:46%;right:6%;top:4%;background:radial-gradient(circle,#4FBDFF 0%,transparent 66%);animation-duration:27s;animation-delay:-8s;opacity:.7}
.al-aurora i:nth-child(3){width:40%;height:40%;left:34%;bottom:6%;background:radial-gradient(circle,rgba(200,23,74,.55) 0%,transparent 64%);animation-duration:31s;animation-delay:-15s;opacity:.55}
@keyframes alDrift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(6%,-5%) scale(1.12)}100%{transform:translate(-5%,6%) scale(.94)}}
.al-spot{position:absolute;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(420px circle at var(--mx,50%) var(--my,40%),rgba(79,189,255,.16),transparent 70%);transition:background .1s}

/* świecąca droga */
.al-road{position:absolute;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none;overflow:visible}
.al-road path{fill:none;stroke-linecap:round}
.al-road-line{stroke-width:2.2;opacity:.9}
.al-road-glow{stroke-width:14;opacity:.45}
.al-road-2{stroke-width:1.2;opacity:.45;stroke-dasharray:3 14}
.al-js .al-road-line:not(.al-road-2),.al-js .al-road-glow{stroke-dasharray:2200;stroke-dashoffset:2200;animation:alDraw 2.6s cubic-bezier(.6,.1,.2,1) .2s forwards}
.al-js .al-road-2{animation:alFlow 5s linear infinite}
@keyframes alDraw{to{stroke-dashoffset:0}}
@keyframes alFlow{to{stroke-dashoffset:-170}}

.al-hero-in{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding-block:clamp(56px,9vh,110px) clamp(96px,14vh,150px)}

/* logotyp */
.al-lockup{position:relative;display:flex;align-items:center;gap:clamp(14px,2.4vw,30px)}
.al-dk{width:clamp(58px,8vw,104px);height:auto;filter:drop-shadow(0 10px 30px rgba(31,111,229,.45))}
.al-sep{display:block;width:2px;height:clamp(54px,7.5vw,96px);background:linear-gradient(to bottom,transparent,rgba(243,248,255,.6),transparent);transform-origin:50% 50%}
.al-word{position:relative;display:block;line-height:0;padding:4px 2px}
.al-word img{width:clamp(220px,40vw,560px);height:auto;filter:drop-shadow(0 14px 40px rgba(79,189,255,.35))}
.al-word-text{font-family:var(--display);font-weight:800;font-size:clamp(56px,11vw,150px);line-height:1;letter-spacing:-.04em;color:var(--gold)}
/* przebłysk tylko na literach: maska z kształtu logotypu, pas światła przesuwany w tle maski */
.al-shine{position:absolute;inset:4px 2px;pointer-events:none;-webkit-mask:var(--wm) center/100% 100% no-repeat;mask:var(--wm) center/100% 100% no-repeat;
  background:linear-gradient(105deg,transparent 0%,transparent 40%,rgba(255,255,255,.95) 50%,transparent 60%,transparent 100%) no-repeat;background-size:250% 100%;background-position:130% 0;mix-blend-mode:screen}
.al-dots{position:absolute;right:clamp(-36px,-3.4vw,-18px);top:clamp(-6px,-.6vw,-2px);display:flex;align-items:flex-end;gap:5px}
.al-dots i{display:block;border-radius:50%}
.al-dots i:nth-child(1){width:clamp(8px,1vw,12px);height:clamp(8px,1vw,12px);background:#D9B96A}
.al-dots i:nth-child(2){width:clamp(11px,1.3vw,16px);height:clamp(11px,1.3vw,16px);background:var(--yellow);margin-bottom:clamp(6px,.8vw,10px)}
.al-dots i:nth-child(3){width:clamp(14px,1.6vw,20px);height:clamp(14px,1.6vw,20px);background:var(--crimson);margin-bottom:clamp(14px,1.8vw,22px)}
.al-motto{margin:clamp(12px,1.6vw,20px) 0 0;font-family:var(--serif);font-style:italic;font-size:clamp(18px,2vw,24px);color:var(--cream-dim)}

.al-title{font-family:var(--display);font-weight:800;font-size:clamp(40px,7.4vw,98px);line-height:.96;letter-spacing:-.035em;margin:clamp(26px,4vh,44px) 0 0;max-width:12ch;text-wrap:balance}
.al-w{display:inline-block}
.al-title .it{font-size:1.06em}

.al-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:10px clamp(28px,5vw,64px);margin:clamp(24px,4vh,40px) 0 0}
.al-stats div{display:flex;flex-direction:column-reverse;align-items:center;gap:4px;min-width:90px}
.al-stats dd{margin:0;font-family:var(--display);font-weight:800;font-size:clamp(34px,4.6vw,58px);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;
  background:linear-gradient(180deg,#fff 0%,var(--gold-hi) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.al-stats dt{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--cream-dim)}
.al-lead{margin-top:24px;color:var(--cream-dim);font-size:18px}

.al-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:clamp(26px,4vh,42px)}
.al-go-btn{box-shadow:0 0 0 0 rgba(79,189,255,.6);animation:alPulse 2.8s ease-out 3.2s infinite}
.al-go-btn span{display:inline-block;animation:alBob 1.8s ease-in-out infinite}
@keyframes alPulse{0%{box-shadow:0 0 0 0 rgba(79,189,255,.55)}70%{box-shadow:0 0 0 18px rgba(79,189,255,0)}100%{box-shadow:0 0 0 0 rgba(79,189,255,0)}}
@keyframes alBob{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}

/* pasek z nazwami akcji */
.al-ticker{position:absolute;left:0;right:0;bottom:0;border-top:1px solid rgba(79,189,255,.18);background:rgba(7,26,51,.55);backdrop-filter:blur(6px);overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.al-ticker-in{display:flex;width:max-content;gap:22px;padding:15px 0;white-space:nowrap;animation:alMarquee 38s linear infinite}
.al-ticker span{font-family:var(--display);font-weight:700;font-size:17px;letter-spacing:-.01em}
.al-ticker i{font-style:normal;color:var(--gold)}
@keyframes alMarquee{to{transform:translateX(-50%)}}

/* ---------- sekwencja wejścia (tylko z JS i bez ograniczenia animacji) ---------- */
.al-js .al-dk{animation:alPop .9s cubic-bezier(.34,1.56,.64,1) .15s both}
.al-js .al-sep{animation:alGrow .6s cubic-bezier(.2,.8,.2,1) .55s both}
.al-js .al-word{animation:alWipe 1.1s cubic-bezier(.7,0,.2,1) .7s both}
.al-js .al-shine{animation:alShine 1.3s ease-in-out 1.7s 1 both,alShine 1.3s ease-in-out 8s infinite}
.al-js .al-dots i{animation:alDot .7s cubic-bezier(.34,1.8,.64,1) both}
.al-js .al-dots i:nth-child(1){animation-delay:1.55s}
.al-js .al-dots i:nth-child(2){animation-delay:1.7s}
.al-js .al-dots i:nth-child(3){animation-delay:1.85s}
.al-js .al-motto{animation:alRise .9s cubic-bezier(.2,.8,.2,1) 1.6s both}
.al-js .al-w{animation:alWord .9s cubic-bezier(.2,.9,.2,1) calc(var(--i) * 90ms + 1.85s) both}
.al-js .al-stats,.al-js .al-lead{animation:alRise .9s cubic-bezier(.2,.8,.2,1) 2.35s both}
.al-js .al-cta{animation:alRise .9s cubic-bezier(.2,.8,.2,1) 2.55s both}
.al-js .al-ticker{animation:alRise 1s ease 2.8s both}
@keyframes alPop{0%{opacity:0;transform:scale(.3) rotate(-25deg)}100%{opacity:1;transform:none}}
@keyframes alGrow{0%{transform:scaleY(0);opacity:0}100%{transform:none;opacity:1}}
@keyframes alWipe{0%{clip-path:inset(-40% 100% -40% -10%);transform:translateX(-18px)}100%{clip-path:inset(-40% -10% -40% -10%);transform:none}}
@keyframes alShine{0%{background-position:130% 0}100%{background-position:-30% 0}}
@keyframes alDot{0%{opacity:0;transform:translateY(-38px) scale(.4)}100%{opacity:1;transform:none}}
@keyframes alRise{0%{opacity:0;transform:translateY(22px)}100%{opacity:1;transform:none}}
@keyframes alWord{0%{opacity:0;transform:translateY(.55em) rotate(4deg);filter:blur(8px)}100%{opacity:1;transform:none;filter:none}}

/* ================= KARTY ================= */
.al-main{position:relative;padding-block:clamp(64px,9vw,110px) clamp(56px,8vw,96px);background:radial-gradient(70% 40% at 50% 0%,rgba(31,111,229,.18),transparent 70%)}
.al-section-head{margin-bottom:clamp(28px,4vw,48px)}
.al-eyebrow{color:var(--gold)}
.al-section-head h2{font-family:var(--display);font-weight:800;font-size:clamp(34px,5vw,64px);line-height:1;letter-spacing:-.03em;margin:14px 0 0}
.al-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:clamp(18px,2.6vw,32px);perspective:1200px}
.al-card{min-width:0}
.al-link{--rx:0deg;--ry:0deg;--gx:50%;--gy:50%;position:relative;display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit;border-radius:var(--r);
  background:linear-gradient(var(--ink-2),var(--ink-2)) padding-box,radial-gradient(360px circle at var(--gx) var(--gy),rgba(138,212,255,.9),rgba(34,66,110,.9) 45%,rgba(34,66,110,.9)) border-box;
  border:1.5px solid transparent;overflow:hidden;transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;
  transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .4s;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.al-link:hover{box-shadow:0 30px 80px rgba(3,12,28,.7),0 0 40px rgba(79,189,255,.18)}
.al-link.is-tilting{transition:transform .08s linear,box-shadow .4s}
.al-glare{position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;opacity:0;transition:opacity .3s;
  background:radial-gradient(420px circle at var(--gx) var(--gy),rgba(255,255,255,.18),transparent 55%)}
.al-link:hover .al-glare{opacity:1}
.al-cover{position:relative;display:block;aspect-ratio:1200/630;background:var(--ink);overflow:hidden}
.al-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(12,36,70,.85),transparent 45%)}
.al-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.4s cubic-bezier(.2,.8,.2,1)}
.al-link:hover .al-cover img{transform:scale(1.07)}
.al-cover-empty{display:grid;place-items:center;height:100%;font-family:var(--display);font-weight:800;font-size:72px;color:var(--gold)}
.al-badge{position:absolute;z-index:1;top:14px;left:14px;background:var(--gold);color:var(--ink);font-weight:700;font-size:12px;letter-spacing:.04em;padding:5px 11px;border-radius:99px;box-shadow:0 6px 20px rgba(79,189,255,.4)}
.al-num{position:absolute;z-index:1;right:16px;bottom:8px;font-family:var(--display);font-weight:800;font-size:52px;line-height:1;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px rgba(243,248,255,.55)}
.al-body{position:relative;display:flex;flex-direction:column;gap:8px;padding:20px 24px 24px;flex:1;transform:translateZ(30px)}
.al-meta{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-dim)}
.al-name{font-family:var(--display);font-weight:800;font-size:clamp(23px,2.3vw,29px);line-height:1.06;letter-spacing:-.02em;text-wrap:balance}
.al-desc{color:var(--cream-dim);font-size:15.5px;line-height:1.5}
.al-go{margin-top:auto;padding-top:12px;font-weight:700;color:var(--gold)}
.al-go span{display:inline-block;transition:transform .3s}
.al-link:hover .al-go span{transform:translateX(6px)}
@media (min-width:900px){ .al-grid:has(> .al-card:nth-child(2)) .al-card.is-first{grid-column:span 2} }
.al-js .al-card{opacity:0;transform:translateY(34px) scale(.98)}
.al-js .al-card.is-in{animation:alCardIn .9s cubic-bezier(.2,.8,.2,1) calc(var(--i) * 110ms) both}
@keyframes alCardIn{0%{opacity:0;transform:translateY(34px) scale(.98)}100%{opacity:1;transform:none}}
.al-note{margin:28px 0 0;font-size:13px;color:var(--cream-dim);max-width:70ch}
.al-empty{color:var(--cream-dim);font-size:18px}
.al-foot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-block:22px 34px;border-top:1px solid var(--line);color:var(--cream-dim);font-size:13px}
.al-foot a{color:var(--cream-dim)}

/* ================= telefon ================= */
@media (max-width:640px){
  .al-hero{min-height:auto}
  .al-hero-in{padding-block:64px 104px}
  .al-lockup{gap:12px}
  .al-sep{height:48px}
  .al-dots{right:-14px;top:-10px;gap:3px}
  .al-title{font-size:clamp(40px,12vw,56px)}
  .al-stats div{min-width:0}
  .al-ticker span{font-size:15px}
  .al-num{font-size:40px}
}

/* ================= ograniczenie animacji ================= */
@media (prefers-reduced-motion: reduce){
  .al-aurora i,.al-ticker-in,.al-go-btn,.al-go-btn span,.al-js .al-road-2{animation:none}
  .al-js .al-dk,.al-js .al-sep,.al-js .al-word,.al-js .al-shine,.al-js .al-dots i,.al-js .al-motto,.al-js .al-w,.al-js .al-stats,.al-js .al-lead,.al-js .al-cta,.al-js .al-ticker{animation:none}
  .al-js .al-road-line:not(.al-road-2),.al-js .al-road-glow{animation:none;stroke-dashoffset:0}
  .al-js .al-card,.al-js .al-card.is-in{opacity:1;transform:none;animation:none}
  .al-link,.al-cover img{transition:none}
  .al-ticker{overflow-x:auto}
}