/* Link dla osób z zewnątrz (gola-medusa.vercel.app): nakładka na /o/style.css i /o/sejf.css */

/* pierwszy ekran: dłuższy tytuł niż „Otrzęsiny SGH” */
.hero-title{font-size:min(5.3vw,10.5vh)}
.hero-title .w2{margin-left:.12em}
.hs-face img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%}

/* skład */
.stars h2{font-size:clamp(46px,7vw,104px)}
.duo .act{margin:0;display:flex;flex-direction:column;gap:16px;text-align:center}
.act-ph{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;border-radius:6px;background:#1a1712;isolation:isolate}
.act-ph img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 30%;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.act-ph::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(70% 45% at 50% 0%,rgba(255,206,120,.24),transparent 70%),linear-gradient(180deg,transparent 55%,rgba(6,5,4,.78))}
.act:hover .act-ph img{transform:scale(1.03)}
.act-ph .role{position:absolute;z-index:1;left:0;right:0;bottom:18px;font:600 clamp(11px,1.1vw,14px)/1.3 'IBM Plex Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--gold2);text-shadow:0 1px 10px rgba(0,0,0,.9)}
.act figcaption b{display:block;font:900 clamp(22px,3vw,40px)/1 Unbounded,sans-serif;text-transform:uppercase;letter-spacing:-.03em}
.act figcaption i{display:block;margin-top:8px;font-style:normal;color:#c9c0ac;font-size:16px;max-width:34ch;margin-inline:auto}

/* ścianka */
.wall{padding:clamp(80px,11vw,150px) 0;border-top:1px solid var(--line);background:radial-gradient(50% 60% at 15% 50%,rgba(242,162,27,.12),transparent 70%),var(--bg2)}
.wall-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(30px,6vw,80px);align-items:center}
.wall-ph{position:relative;margin:0;border-radius:10px;overflow:hidden;background:#1a1712;transform:rotate(-1.2deg);box-shadow:0 40px 80px rgba(0,0,0,.5)}
.wall-ph img{display:block;width:100%;height:auto}
.wall-ph figcaption{position:absolute;left:0;right:0;bottom:0;padding:34px 16px 12px;font:600 12.5px/1 'IBM Plex Mono',monospace;letter-spacing:.06em;color:#fff;background:linear-gradient(to top,rgba(0,0,0,.7),transparent)}
.wall h2{font-weight:900;text-transform:uppercase;font-size:clamp(42px,6.2vw,92px);letter-spacing:-.045em;line-height:.9}
.wall h2 em{font-style:normal;color:var(--gold)}
.wall-copy>p{color:#d8cfbb;font-size:19px;margin:22px 0 0;max-width:34ch}
.wall-list{list-style:none;margin:30px 0 0;padding:0;border-top:1px solid var(--line)}
.wall-list li{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--line);font-weight:700;font-size:18px}
.wall-list li span{font:600 13px/1 'IBM Plex Mono',monospace;color:var(--gold2);letter-spacing:.08em}

/* pule: tablica kursów jak w kantorze */
.pule{list-style:none;margin:28px 0 0;padding:0;max-width:470px;border-top:1px solid var(--line);font-family:'IBM Plex Mono',monospace}
.pule li{display:grid;grid-template-columns:1fr auto;grid-template-areas:"nr cena" "st cena";gap:4px 16px;align-items:center;padding:14px 2px;border-bottom:1px solid var(--line);color:var(--muted)}
.pule .nr{grid-area:nr;font-weight:600;font-size:14px;letter-spacing:.1em;text-transform:uppercase}
.pule .st{grid-area:st;font-size:13px;letter-spacing:.02em}
.pule .c{grid-area:cena;font:900 clamp(28px,3vw,38px)/1 Unbounded,sans-serif;letter-spacing:-.03em;color:#6d6656}
.pule li.now{color:var(--ink)}
.pule li.now .nr{color:var(--gold2)}
.pule li.now .nr::after{content:" · teraz";color:var(--up)}
.pule li.now .c{color:var(--gold)}
.pule li.out .c{text-decoration:line-through;text-decoration-thickness:3px;color:#4d483e}
.pule li.out .st{color:#8a5b55}
.pule-bar{position:relative;display:block;height:7px;margin-top:10px;background:rgba(244,236,216,.1);border-radius:4px;overflow:hidden}
.pule-bar i{display:block;height:100%;width:var(--w,0%);border-radius:4px;background:linear-gradient(90deg,#c27a08,#f2a21b 60%,#ffd27a);box-shadow:0 0 14px rgba(242,162,27,.65);transition:width 1.6s cubic-bezier(.2,.7,.2,1)}
/* pasek „żyje”: światło przelatuje po całym torze, a złote wypełnienie rośnie z każdym sprzedanym biletem (bez liczb) */
.pule-bar::after{content:"";position:absolute;top:0;bottom:0;left:0;width:28%;background:linear-gradient(90deg,transparent,rgba(255,226,160,.45),transparent);animation:sweep 2.6s ease-in-out infinite}
@keyframes sweep{from{transform:translateX(-110%)}to{transform:translateX(370%)}}
.pule .st-t:empty{display:none}
.pule li:not(.now) .pule-bar{display:none}

@media (prefers-reduced-motion:reduce){.pule-bar::after{display:none}}
@media (max-width:980px){
  .wall-grid{grid-template-columns:1fr}
  .wall-ph{transform:none}
}
@media (max-width:760px){
  .hero-title{font-size:min(9.3vw,6.6vh)}
  .hero-cta .btn-ghost small{display:none}
  .duo{gap:12px}
  .act figcaption i{font-size:14px}
  .wall-copy>p{font-size:17px}
}