/* sekwencje przewijania – V2/V3 */
.seq{position:relative;height:420vh;background:var(--ink);color:var(--cream)}
.seq--layers{height:380vh}
.seq__pin{position:sticky;top:0;height:100svh;overflow:hidden}
.seq__v,.seq__hi{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover}
.seq__hi{pointer-events:none;will-change:opacity}
.seq__hi--b{opacity:0}
#unterbau .seq__hi{object-position:42% 50%}
.seq__shade{position:absolute;inset:0;pointer-events:none}
.seq--hero .seq__shade{background:linear-gradient(180deg,rgba(13,26,19,.62) 0%,rgba(13,26,19,0) 24%,rgba(13,26,19,0) 48%,rgba(13,26,19,.86) 100%),linear-gradient(90deg,rgba(13,26,19,.55) 0%,rgba(13,26,19,0) 58%)}
.seq--layers .seq__shade{background:linear-gradient(90deg,rgba(13,26,19,.9) 0%,rgba(13,26,19,.72) 34%,rgba(13,26,19,0) 62%)}
.seq__ui{position:relative;z-index:2;height:100%}
.seq__cap{position:absolute;left:var(--gutter);right:var(--gutter);bottom:clamp(84px,12vh,130px);will-change:opacity,transform}
.seq__cap--b,.seq__cap--c{opacity:0}
.seq__big{font:750 clamp(46px,min(8vw,13vh),118px)/1 var(--serif);letter-spacing:-.045em;margin:18px 0 0;max-width:14ch}
.seq__big em,.seq__cap h1 em{font-style:normal;color:var(--brass-2)}
.seq__sub{margin-top:18px;font-size:clamp(17px,1.5vw,20px);color:rgba(246,242,234,.88);max-width:44ch}
.seq__hint{display:flex;align-items:center;gap:14px;margin-top:26px;color:rgba(246,242,234,.78);font-size:15px;font-weight:600}
.seq__hint span{width:24px;height:38px;border:1.5px solid rgba(246,242,234,.55);border-radius:13px;position:relative;flex:none}
.seq__hint span::after{content:"";position:absolute;left:50%;top:7px;width:3px;height:8px;margin-left:-1.5px;border-radius:3px;background:var(--brass-2);animation:cue 1.8s var(--ease) infinite}
.seq__cap h1{font-size:clamp(42px,min(7vw,11vh),100px);font-weight:750;line-height:1;letter-spacing:-.04em;max-width:13ch;margin:0 0 22px}
.seq__cap .lead{color:rgba(246,242,234,.88);max-width:46ch;font-size:clamp(17px,1.5vw,20px)}
.seq__rating{display:inline-flex;align-items:center;gap:12px;margin-left:8px;color:var(--cream);text-decoration:none;font-size:13.5px;line-height:1.3}
.seq__rating b{font:300 38px/1 var(--sans);letter-spacing:-.04em}
.seq__rating .stars{display:block;font-size:14px}
.seq__foot{position:absolute;left:0;right:0;bottom:24px;z-index:3;display:flex;align-items:center;gap:16px}
.seq__bar{flex:1;height:2px;background:rgba(246,242,234,.18);border-radius:2px;overflow:hidden}
.seq__bar i{display:block;height:100%;width:0;background:var(--brass-2)}
.seq__ki{font:700 10.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:rgba(246,242,234,.72);background:rgba(13,26,19,.45);border:1px solid rgba(246,242,234,.16);padding:6px 9px;border-radius:999px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.seq__load{font:600 12px/1 var(--sans);color:rgba(246,242,234,.6);min-width:34px;text-align:right}
.ix__ki{position:absolute;top:16px;right:16px;z-index:5}

/* warstwy podjazdu */
.seq__ui--layers{display:flex;align-items:center}
.lay{max-width:470px;padding-top:40px}
.lay h2{margin:16px 0 16px;color:var(--cream)}
.lay h2 em{color:var(--brass-2)}
.lay__lead{color:rgba(246,242,234,.8);font-size:17px;margin-bottom:26px}
.lay__list{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.lay__list li{display:grid;grid-template-columns:52px 1fr;gap:12px;padding:14px 16px;border-radius:16px;border:1px solid transparent;opacity:.42;transition:opacity .45s,background .45s,border-color .45s,transform .45s var(--ease)}
.lay__list li b{font:300 30px/1 var(--sans);letter-spacing:-.04em;color:var(--brass-2)}
.lay__list li strong{display:block;font:700 18px/1.25 var(--serif);letter-spacing:-.02em;color:var(--cream);margin-bottom:3px}
.lay__list li span{color:rgba(246,242,234,.78);font-size:14.5px;line-height:1.5}
.lay__list li.done{opacity:.7}
.lay__list li.on{opacity:1;background:rgba(246,242,234,.08);border-color:rgba(224,194,116,.35);transform:translateX(6px)}

@media (max-width:700px){
  .seq{height:340vh}
  .seq--layers{height:320vh}
  .seq__cap{bottom:76px}
  .seq--hero .seq__shade{background:linear-gradient(180deg,rgba(13,26,19,.55) 0%,rgba(13,26,19,0) 22%,rgba(13,26,19,.2) 45%,rgba(13,26,19,.92) 100%)}
  .seq__cap .hero__ctas .btn{flex:1 1 200px}
  .seq__rating{margin:6px 0 0}
  .seq--layers .seq__shade{background:linear-gradient(180deg,rgba(13,26,19,.25) 0%,rgba(13,26,19,.5) 35%,rgba(13,26,19,.94) 62%)}
  .seq__ui--layers{align-items:flex-end;padding-bottom:64px}
  .lay{padding-top:0}
  .lay h2{font-size:30px;margin:10px 0 10px}
  .lay__lead{display:none}
  .lay__list li{padding:9px 12px;grid-template-columns:38px 1fr}
  .lay__list li b{font-size:22px}
  .lay__list li strong{font-size:16px}
  .lay__list li span{font-size:13px}
  .lay__list li:not(.on) span{display:none}
}

/* bez animacji / zrzut */
.seq--static{height:auto}
.seq--static .seq__pin{position:relative;height:100svh;min-height:640px}
.seq--static .seq__cap--a,.seq--static .seq__cap--b{display:none}
.seq--static .seq__cap--c{opacity:1}
.seq--static .lay__list li{opacity:1}
.seq--static .seq__bar,.seq--static .seq__load{visibility:hidden}
@media (max-width:700px){.seq--static .seq__pin{height:auto;min-height:100svh}}
@media (max-width:700px){.seq__big{font-size:clamp(38px,11vw,52px);max-width:none}}

/* oddech między przed/po a sekcją Unterbau */
.ba{padding-bottom:clamp(64px,8vw,120px)}
/* telefon: przekrój podjazdu w górnej części, kroki pod spodem */
@media (max-width:700px){
  #unterbau .seq__v,#unterbau .seq__hi{top:64px;bottom:auto;height:42%;object-position:50% 70%}
  #unterbau .seq__shade{background:linear-gradient(180deg,rgba(13,26,19,0) 0%,rgba(13,26,19,0) 40%,rgba(13,26,19,1) 52%)}
  #unterbau .seq__pin{background:var(--ink)}
  #unterbau .seq__ui--layers{padding-bottom:84px}
  #unterbau .lay__list li span{display:block}
  #unterbau .lay__list li:not(.on) span{display:none}
}
@media (max-width:700px){
  #unterbau .lay__list li:not(.on) span{display:block;font-size:0;line-height:0}
  #unterbau .lay__list li:not(.on) span strong{font-size:15px;line-height:1.3;margin:0;color:rgba(246,242,234,.6)}
  #unterbau .lay__list li{align-items:center}
}

/* przed/po: całe okienko w kadrze z oddechem pod spodem (Kuba 14.10) */
.ba__pin{padding-top:76px;padding-bottom:clamp(40px,6vh,64px);justify-content:center}
.ba__frame{height:min(calc(100svh - 340px),620px);min-height:300px}
@media (max-width:640px){.ba__pin{padding-top:72px;padding-bottom:104px}.ba__frame{height:min(calc(100svh - 390px),480px);min-height:240px}}
/* hero: 3 etapy przemiany (24 s) – dłuższe przewijanie */
.seq--hero{height:640vh}
@media (max-width:700px){.seq--hero{height:520vh}}
