/* pass 19 - centred layout: rail removed, header + hero, centred column */

/* --- kill the two-column grid --- */
body{display:block}
body .rail{display:none}
body .main{padding:0;max-width:none;margin:0}

/* --- centred content column --- */
body .shell{max-width:none}
body .facts > .shell,
body .band > .shell,
body .contact > .shell{max-width:1120px;margin-left:auto;margin-right:auto;padding-left:clamp(24px,4vw,40px);padding-right:clamp(24px,4vw,40px);box-sizing:border-box}
body .facts,
body .band.tint,
body .band.dark{margin-left:0;margin-right:0;padding-left:0;padding-right:0}
body .more{max-width:1120px;margin-left:auto;margin-right:auto;padding-left:clamp(24px,4vw,40px);padding-right:clamp(24px,4vw,40px);box-sizing:border-box}

/* --- liczby: ink block bleeds, its content keeps the column --- */
body #liczby > .shell{max-width:none;padding-left:0;padding-right:0}
body #liczby .band-head,
body #liczby .stat:not(.ink){max-width:1120px;margin-left:auto;margin-right:auto;padding-left:clamp(24px,4vw,40px);padding-right:clamp(24px,4vw,40px);box-sizing:border-box}
body .stat.ink{margin-left:0;margin-right:0;padding-left:max(calc((100% - 1120px) / 2 + clamp(24px,4vw,40px)),clamp(24px,4vw,40px));padding-right:max(calc((100% - 1120px) / 2 + clamp(24px,4vw,40px)),clamp(24px,4vw,40px))}

/* --- header --- */
body .hdr{background:var(--ink);color:var(--paper);position:sticky;top:0;z-index:40}
body .hdr-in{max-width:1120px;margin:0 auto;padding:0 clamp(24px,4vw,40px);min-height:62px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;box-sizing:border-box}
body .hbd{font-family:var(--a);font-weight:800;font-size:15.5px;letter-spacing:-.02em;text-transform:uppercase;color:var(--paper);text-decoration:none;white-space:nowrap}
body .hbd em{font-style:normal;color:var(--redL)}
body .hnav{display:flex;align-items:center;gap:clamp(12px,1.8vw,26px);flex-wrap:wrap}
body .hnav a{font-family:var(--a);font-weight:600;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:#D8D8DE;text-decoration:none}
body .hnav a:hover{color:var(--redL)}
body .hnav a.hen{font-weight:700;color:var(--paper);border-bottom:2px solid var(--red);padding-bottom:2px}

/* --- hero --- */
body .hero{background:var(--ink);color:var(--paper);padding:clamp(52px,6vw,86px) 0 clamp(54px,6.4vw,92px)}
body .hero-in{max-width:1120px;margin:0 auto;padding:0 clamp(24px,4vw,40px);box-sizing:border-box}
body .heyeb{font-family:var(--a);font-weight:700;font-size:11.5px;letter-spacing:.15em;text-transform:uppercase;color:#8C8C93;margin:0 0 26px}
body .hero h1{font-family:var(--a);font-weight:900;font-size:clamp(30px,5vw,58px);line-height:1.0;letter-spacing:-.045em;text-transform:uppercase;margin:0;max-width:34ch;color:var(--paper)}
body .hero h1 em{font-style:normal;color:var(--redL)}
body .hlede{font-family:var(--b);font-size:16.5px;line-height:1.62;color:#B8B8C0;margin:28px 0 0;max-width:58ch}
body .hcta{display:flex;flex-wrap:wrap;gap:14px;margin-top:38px}
body .hcta .btn{display:inline-block;background:var(--red);color:var(--paper);border:1px solid var(--red);text-decoration:none;font-family:var(--a);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding:15px 26px}
body .hcta .btn.ghost{background:transparent;color:var(--paper);border-color:#4A4A52}
body .hcta .btn:hover{background:var(--redL);border-color:var(--redL)}
body .hcta .btn.ghost:hover{background:transparent;border-color:var(--paper)}

/* --- talk tiles: no hairline grid behind ink tiles --- */
body .watch{background:none;border:0;gap:clamp(16px,2vw,26px)}
@media(min-width:760px){body .watch{background:none;border:0;gap:clamp(16px,2vw,26px)}}

/* --- lane source: only the link --- */
body .lane .proof{padding-top:11px}
body .lane .proof .src{margin-top:0}

@media(max-width:900px){
  body .hdr-in{min-height:0;padding-top:12px;padding-bottom:12px;align-items:flex-start;flex-direction:column;gap:12px}
  body .hnav{gap:10px 16px}
}

/* pass 20 - hero type down a step, real vertical rhythm, portrait in colour */
body .hero h1{font-size:clamp(27px,3.5vw,46px);max-width:none}
body .hero{padding-top:clamp(44px,5vw,72px);padding-bottom:clamp(46px,5.2vw,76px)}
body .band{padding-top:clamp(40px,4.4vw,66px);padding-bottom:clamp(40px,4.4vw,66px)}
body .band.tint,body .band.dark{padding-top:clamp(34px,3.6vw,52px);padding-bottom:clamp(34px,3.6vw,52px)}
body .band-head{padding-top:0}
body .about .portrait img{filter:none}

/* pass 21 - talk tiles: real YouTube still appears under a gradient on hover */
body .watch .wcard{position:relative;display:block;overflow:hidden}
body .watch .wcard img{display:block;position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;opacity:0;filter:none;transition:opacity .32s ease;z-index:0}
body .watch .wcard:hover img,body .watch .wcard:focus-visible img{opacity:1;filter:grayscale(1) brightness(.46) contrast(.92)}
body .watch .wcard .vtile{position:relative;z-index:1;transition:background .32s ease}
body .watch .wcard:hover .vtile,body .watch .wcard:focus-visible .vtile{background:linear-gradient(180deg,rgba(13,13,15,.30) 0%,rgba(13,13,15,.52) 46%,rgba(13,13,15,.88) 100%)}
body .watch .wcard:hover .vtile .play,body .watch .wcard:focus-visible .vtile .play{border-left-color:#fff}

/* pass 22 - talk tiles: cover visible from the start, dark, everything overlaid, colour on hover */
body .watch .wcard{position:relative;display:block;overflow:hidden;aspect-ratio:16/9;background:var(--ink)}
body .watch .wcard img{display:block;position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;opacity:1;z-index:0;filter:grayscale(1) brightness(.40) contrast(.95);transition:filter .32s ease}
body .watch .wcard:hover img,body .watch .wcard:focus-visible img{filter:none}
body .watch .wcard .vtile{position:absolute;left:0;top:0;right:0;bottom:0;width:auto;aspect-ratio:auto;z-index:2;padding:10px 12px 11px;background:linear-gradient(180deg,rgba(13,13,15,.52) 0%,rgba(13,13,15,.20) 34%,rgba(13,13,15,.84) 100%);transition:background .32s ease}
body .watch .wcard:hover .vtile,body .watch .wcard:focus-visible .vtile{background:linear-gradient(180deg,rgba(13,13,15,.46) 0%,rgba(13,13,15,.22) 36%,rgba(13,13,15,.88) 100%)}
body .watch .wcard .vtile .play{border-left:13px solid #fff;border-top:8px solid transparent;border-bottom:8px solid transparent;filter:drop-shadow(0 1px 3px rgba(0,0,0,.6))}
body .watch .wcard:hover .vtile .play,body .watch .wcard:focus-visible .vtile .play{border-left-color:var(--redL)}
body .watch .wcard .vtile b{font-size:12.5px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 1px 4px rgba(0,0,0,.75)}
body .watch .wcard .vtile span{font-size:8.5px;letter-spacing:.11em;margin-top:5px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;color:#C8C8CE;text-shadow:0 1px 3px rgba(0,0,0,.7)}
@media(max-width:1099px){body .watch .wcard .vtile b{font-size:15px}body .watch .wcard .vtile span{font-size:10px}}

/* pass 22b - resting state darker, channel line no longer truncated */
body .watch .wcard img{filter:grayscale(1) brightness(.33) contrast(.95)}
body .watch .wcard .vtile{background:linear-gradient(180deg,rgba(13,13,15,.62) 0%,rgba(13,13,15,.30) 34%,rgba(13,13,15,.88) 100%)}
body .watch .wcard .vtile span{-webkit-line-clamp:2;font-size:8px;letter-spacing:.09em;margin-top:4px}
body .watch .wcard .vtile b{-webkit-line-clamp:3}

/* pass 23 - talk cards: format line on one row, pinned to the bottom so rows align */
/* height:100% on a grid item breaks in WebKit - stretch already does it */
body .talk .fmt{margin-top:auto;padding-top:6px;line-height:1.6;white-space:normal}
body .talk .fmt b{margin-right:10px}
@media(max-width:760px){body .talk .fmt{line-height:1.8}}

/* pass 24 - section heads use the full column; Liczby rules inset to the content column */
body .band-head h2{max-width:none}
body .band-head > p{max-width:none}
body .contact h2{max-width:none}
body #liczby .stat:not(.ink){border-bottom:0;background-image:linear-gradient(var(--rule),var(--rule));background-repeat:no-repeat;background-position:bottom center;background-size:calc(100% - 2 * clamp(24px,4vw,40px)) 1px}
body #liczby .stat:not(.ink):last-child{background-image:linear-gradient(var(--ink),var(--ink));background-size:calc(100% - 2 * clamp(24px,4vw,40px)) 2px}

/* pass 25 - contact band loses the rail's asymmetric padding; pawn over the red stop */
html body > section.contact{padding-left:0;padding-right:0}
html body > .foot{padding-left:max(calc((100% - 1120px) / 2 + clamp(24px,4vw,40px)),clamp(24px,4vw,40px));padding-right:max(calc((100% - 1120px) / 2 + clamp(24px,4vw,40px)),clamp(24px,4vw,40px));justify-content:space-between}
body .hero h1 .pk{display:inline-flex;flex-direction:column;align-items:center;justify-content:flex-end;vertical-align:baseline;line-height:1;margin-left:.09em;transform:translateY(.02em)}
body .hero h1 .pk svg{display:block;width:.46em;height:.66em;color:var(--redL)}
body .hero h1 .pk i{display:block;width:.17em;height:.17em;border-radius:50%;background:var(--redL);margin-top:.11em}

/* pass 26 - dla-firm: lead paragraph joins the column */
body .main > .lead{max-width:1120px;margin-left:auto;margin-right:auto;padding-left:clamp(24px,4vw,40px);padding-right:clamp(24px,4vw,40px);padding-top:clamp(34px,3.6vw,52px);box-sizing:border-box}

/* pass 27 - series and date once, under the tile */
body .txc .cov .ctag{display:none}

/* pass 28 - related-article cards inside a text */
body.plain .art .also{margin:46px 0;padding:22px 0 2px;border-top:2px solid var(--ink)}
body.plain .art .also-h{font-family:var(--a);font-weight:700;font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--red);margin:0 0 16px}
body.plain .art .also-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
body.plain .art .also-g a{display:block;text-decoration:none;color:inherit;border-top:1px solid var(--rule);padding-top:11px}
body.plain .art .also-g a span{display:block;font-family:var(--a);font-weight:700;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin-bottom:6px;line-height:1.35}
body.plain .art .also-g a b{display:block;font-family:var(--a);font-weight:800;font-size:14px;line-height:1.2;letter-spacing:-.025em}
body.plain .art .also-g a:hover b{color:var(--red)}
@media(max-width:640px){body.plain .art .also-g{grid-template-columns:minmax(0,1fr);gap:0}body.plain .art .also-g a{padding:12px 0}}

/* pass 29 - dla-firm: lead joins the hero so the ink block is continuous */
body[data-p="firm"] .hero{padding-bottom:clamp(34px,3.6vw,52px)}
body[data-p="firm"] .hero .lead{font-family:var(--b);font-size:16.5px;line-height:1.62;color:#B8B8C0;margin:26px 0 0;max-width:68ch;text-transform:none;padding:0;box-sizing:content-box}
body[data-p="firm"] .hero .lead strong{color:var(--paper)}
body[data-p="firm"] .facts.dark{padding-top:0}

/* pass 30 - hero mark: pawn only, no dot under it */
body .hero h1 .pk i{display:none}
body .hero h1 .pk{transform:translateY(.04em)}

/* pass 31 - facts strip: red bar like the lane mark, text in ink on the grey ground */
body .facts:not(.dark) .it p{border-left:3px solid var(--red);padding-left:14px;color:var(--ink);margin-top:11px}

/* pass 32 - talk photos run the full card width instead of sitting in a frame */
body .talk .tph{border:0;background:none;padding:0;width:calc(100% + 40px);margin:-20px -20px 14px;height:auto}
@media(max-width:719px){body .talk .tph{width:calc(100% + 40px);margin:-20px -20px 14px}}

/* pass 33 - full stop back as a square red dot on the baseline, pawn stacked above it */
body .hero h1 .pk{display:inline-block;position:relative;width:.46em;margin-left:.10em;vertical-align:baseline;transform:none;line-height:1}
body .hero h1 .pk i{display:block;width:.17em;height:.17em;border-radius:0;background:var(--redL);margin:0 auto}
body .hero h1 .pk svg{position:absolute;left:50%;bottom:.30em;transform:translateX(-50%);width:.46em;height:.62em;color:var(--redL);display:block}

/* pass 34 - hero: double the air around the headline */
body .heyeb{margin:0 0 clamp(30px,3.7vw,52px)}
body .hlede{margin:clamp(32px,4vw,56px) 0 0}

/* pass 35 - no dot under the hero pawn; pawn joins the wordmark */
body .hero h1 .pk i{display:none}
body .hero h1 .pk{width:.46em}
body .hbd{display:inline-flex;align-items:center;gap:9px}
body .hbd .pw{width:12px;height:18px;color:var(--redL);flex:0 0 auto;display:block}

/* pass 36 - original .bd logo lockup in the bar; hero pawn sits on the baseline */
body .hdr-in .bd{color:var(--paper)}
body .hdr-in .bd .pawn{width:15px;height:21px;color:var(--redL);flex:0 0 auto;display:block}
body .hero h1 .pk{display:inline-block;position:relative;width:.46em;height:.62em;margin-left:.12em;vertical-align:baseline;line-height:1;transform:none}
body .hero h1 .pk svg{position:static;left:auto;bottom:auto;transform:none;width:.46em;height:.62em;display:block}

/* pass 37 - wider article measure, figures break out, inline video placeholders */
body.plain .art{max-width:46rem}
body.plain .art figure{width:min(54rem,calc(100vw - 48px));margin-left:50%;transform:translateX(-50%)}
body.plain .art .vemb{display:flex;flex-direction:column;justify-content:space-between;aspect-ratio:16/9;box-sizing:border-box;text-decoration:none;background:var(--ink);padding:16px 18px;margin:32px 0;transition:background .25s ease}
body.plain .art .vemb:hover{background:#17171B}
body.plain .art .vemb .play{display:block;width:0;height:0;border-left:15px solid var(--redL);border-top:9px solid transparent;border-bottom:9px solid transparent}
body.plain .art .vemb .vemb-t{display:block;font-family:var(--a);font-weight:800;font-size:17px;line-height:1.18;letter-spacing:-.03em;color:var(--paper);margin-top:auto}
body.plain .art .vemb .vemb-s{display:block;font-family:var(--a);font-weight:700;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:#8C8C93;margin-top:8px}